YaoApp/designer

Letzte erfasste Quellaktivität: 11. Juni 2026 um 00:53

SkillsMP-Katalog aktualisiert: 5. November 2026 um 19:57

gesammelte Skills: 8

GitHub-Stars: 0
GitHub-Forks: 0

Mit einem KI-Assistenten installieren

Diesen Prompt kopieren und in den verwendeten KI-Assistenten einfügen.

Follow https://skillsmp.com/skill-install/prompt.md to install Agent Skills from https://github.com/YaoApp/designer.

README des Repositorys

README-Quelldatei: README.md

README-Quelldatei lesen

Vollständige README anzeigen

# Designer `smith.designer` — AI-powered visual design and prototyping agent for web, app, and poster design projects. Give it a design brief ("SaaS admin dashboard with enterprise blue theme") and it plans the full project: picks a color palette, sets up typography, scaffolds HTML pages from templates, generates a design-spec.css token file, and serves it all with live reload via preview server. ## How to install Send this repo URL to Agent Smith: > Install the designer agent from https://github.com/YaoApp/designer.git Agent Smith reads the files, deploys them, and `smith.designer` appears in your agent list ready to use. ## What's inside | Layer | Files | | ------------- | ------------------------------------------------------- | | Config | `package.yao`, `sandbox.yao`, `prompts.yml` | | Locales | `locales/en-us.yml`, `locales/zh-cn.yml` | | Tests | `tests/inputs.jsonl`, `tests/ctx.json` | | Skills | `skills/*/SKILL.md` | ### Skills (8) | # | Skill | What it does | | --- | --------------------- | --------------------------------------------- | | 1 | `project-planning` | Collect requirements, match design library, output blueprint | | 2 | `project-management` | Create project.yml, directory layout, medium separation | | 3 | `page-management` | Create/edit/list HTML pages from design templates | | 4 | `color-palette` | Generate standard YAML palettes from built-in library, URLs, or trends | | 5 | `design-spec` | Generate design-spec.css from palette YAML, handle web/app/poster | | 6 | `font-management` | Install/list/recommend fonts from 11 seed typefaces + Google Fonts | | 7 | `global-conventions` | Cross-project defaults for fonts, viewport, CSS rules | | 8 | `preview-server` | Start/stop preview server with live reload at port 3000 | ## Architecture ``` User request → project-planning → DESIGN.md (blueprint) ↓ project-management → project.yml + dirs ↓ page-management → HTML pages from templates ↓ color-palette → palette.yml (standard YAML) ↓ design-spec → design-spec.css (CSS tokens) ↓ font-management → fonts on demand ↓ preview-server → live preview at port 3000 ``` ## Design workspace Everything goes under `$WORKDIR/design-works/{project-name}/`: ``` design-works/ {project-name}/ DESIGN.md # Blueprint (generated in planning) project.yml # Project metadata design-spec.css # CSS custom properties (auto-generated) pages/ # HTML pages .cache/assets/ # On-demand GitHub registry cache .library/ # Reusable palettes and design schemes .conventions.yml # Global cross-project defaults ``` ## Relationship to `YaoApp/design-assets` This repo (`YaoApp/designer`) is the **agent** — the code that orchestrates the design workflow. The sibling repo [`YaoApp/design-assets`](https://github.com/YaoApp/design-assets) is the **content registry** — the raw design assets the agent pulls at runtime. | Repo | Role | Ships | |------|------|-------| | `YaoApp/designer` | Agent logic | `package.yao`, `prompts.yml`, `sandbox.yao`, 8 skills | | `YaoApp/design-assets` | Content registry | 28 design schemes, 31 color palettes, 11 typefaces, 14 HTML templates, preview-server dist | At startup the agent downloads `INDEX.md` (~5 KB) from `design-assets` to discover what's available. When a user picks a palette, font, or template, the agent fetches just that asset on demand and caches it locally. Nothing is bundled — the agent stays lean, assets iterate independently.

README des Repositorys wird geladen…