rohaquinlop/spec-driven-designment

rohaquinlop 资料

最近记录的来源活动: 2026年10月6日 21:08

SkillsMP 收录数据更新: 2026年10月17日 00:09

已收集 skills: 5

GitHub 星标: 0
GitHub Forks: 0

仓库 README

仓库 README 来源：README.md

查看 README 源文件

展开完整 README

# sdd-design [![Validate plugin](https://github.com/rohaquinlop/spec-driven-designment/actions/workflows/validate-plugin.yml/badge.svg)](https://github.com/rohaquinlop/spec-driven-designment/actions/workflows/validate-plugin.yml) A design workflow for Claude. You write down your design rules once. Claude makes the work, reviews it against your rules and references, and fixes what the review finds. You only see the work when it is ready for your judgment. It is the designer version of [spec-driven-framework](https://github.com/rohaquinlop/spec-driven-framework) (`sdd`), a workflow for developers. Like `sdd`, it is only Markdown and JSON: no scripts, no dependencies, no telemetry. ## How it works ``` /sdd-design:setup → once per project: save your design rules /sdd-design:explore → think through an idea; optionally save notes /sdd-design:brief → write what to make and how to judge it /sdd-design:make → Claude makes it, reviews it, fixes it — then you approve /sdd-design:wrap-up → add what you learned to your rules and archive the brief ``` You don't have to type the commands. You can also say "let's start a brief for the pricing page" and Claude picks the right step. ### The review loop Design has no automatic test like code does. Your rules are the test. - Every rule and every acceptance criterion is one of three kinds: - **Measurable**: checked by exact value, e.g. "buttons use `#1A73E8`" or "text contrast is at least 4.5:1". - **Visual**: checked against a reference, e.g. "matches the hero frame in Figma". - **Judgment**: only you can decide, e.g. "feels calm". - In `make`, Claude makes the work. Then it reviews the work: it changes nothing during the review, checks every measurable and visual item, and shows its evidence. Then it fixes the problems the review found. - This repeats up to 3 times by default (a brief can change this), and stops early if the same problem keeps coming back. - Then you get the result: what passed, what is still open, and the judgment items for you to decide. You approve it or give feedback. Feedback starts a new round of fixes. ## Install ### In Claude Desktop (Cowork) Cowork needs a paid Claude plan. 1. Open the **Cowork** tab and select **Customize** in the sidebar, then **Plugins**. 2. Select **Add marketplace** and enter `rohaquinlop/spec-driven-designment`. 3. Find **sdd-design** and select **Install**. 4. Optional: open the plugin's **Connectors** tab and connect **Figma**, so Claude can read and edit your Figma files. Editing Figma files needs a Figma Full seat and edit access to the file. To update later, select **Check for updates** on the marketplace, or turn on **Sync automatically**. ### In Claude Code ``` /plugin marketplace add rohaquinlop/spec-driven-designment /plugin install sdd-design@spec-driven-designment ``` ## First steps 1. In Cowork, create a **Project** and attach the folder where you keep the work for this project. Start sessions from that project, on your computer. 2. Run `/sdd-design:setup`. Claude asks about your project, your sources of truth (like a Figma library), colors, type, layout, components, voice, and accessibility. It saves the answers as your design rules. 3. Paste the line that setup gives you into the Project's **Instructions**. 4. Start your first piece of work with `/sdd-design:brief <name>`. When your design system changes, run `/sdd-design:setup` again. It shows what you have and changes only what you tell it. You can also update one area, e.g. `/sdd-design:setup colors`, or re-read your Figma library with `/sdd-design:setup figma`. ## Where your files live Everything goes in a `design-specs` folder inside your work folder: ``` your-work-folder/ ├── CLAUDE.md # a short note Claude reads in this folder ├── pricing-page/ # your deliverables (location set per brief) └── design-specs/ ├── rules/ # your design rules — edit them any time ├── notes/ # saved explore notes ├── briefs/<name>/ # work in progress: brief, checklist, references, reviews └── archive/<name>/ # finished briefs ``` ## FAQ **Do I need git?** No. If your work folder is ever used with git, `design-specs/` is ignored automatically. You don't need to set anything up. **I don't use Figma.** Everything still works. The brief says what kind of output you want: images, HTML prototypes, copy, or something else. The review checks it with the evidence that fits. **What about cloud sessions?** Sessions on your computer work directly on your folder. A cloud session works on its own copy of the files. If it can't find your `design-specs` folder, Claude asks you to attach it instead of starting over. After each step, Claude lists the changed files so you can save them back to your folder. **Does Claude remember my rules?** Yes. They are files in `design-specs/rules/`, and every step reads them. Claude's own memory can forget details, but these files don't. ## Status Pre-1.0. The plugin is built and tested in Claude Code. Some Cowork-only behavior is still unconfirmed. See [docs/cowork-checklist.md](./docs/cowork-checklist.md). ## Versioning The `version` field in [`.claude-plugin/plugin.json`](./.claude-plugin/plugin.json) is set explicitly. Installs receive an update only when it is bumped. - **Major**: a breaking change to command names, arguments, or the `design-specs/` folder convention. - **Minor**: a new skill, template, or backward-compatible improvement. - **Patch**: wording, doc, or example fixes with no effect on behavior. Until `1.0.0`, the folder convention and skill instructions can still change. ## License MIT

正在加载仓库 README…

这个仓库中的 skills

职业分类待补全

skill

职业分类

描述

更新

brief

未分类

Start a piece of design work by writing a brief — goal, audience, output, references, and acceptance criteria — and a checklist of deliverables. Use when the designer is ready to commit to a direction. Takes a name or idea, e.g. "/sdd-design:brief pricing…

原文语言：英语

2026-10-06

make

未分类

Produce the design work for a brief, review it against the brief and the design rules, and fix what the review finds, in rounds, before asking the designer to approve. Use once a brief exists. Optionally takes the brief name, e.g. "/sdd-design:make…

原文语言：英语

2026-10-06

explore

未分类

Thinking partner for designers to investigate an idea, problem, or direction before starting a brief. Use before /sdd-design:brief when the designer wants to discuss options, research, or compare approaches, not produce design work yet.

原文语言：英语

2026-10-02

setup

未分类

Set up or update a project's design rules for sdd-design — sources of truth (such as a Figma library), colors, typography, layout, components, voice, and accessibility. Use the first time a designer works in a folder, or when the design system or brand…

原文语言：英语

2026-10-02

wrap-up

未分类

Close a finished, designer-approved brief — add the rule changes the designer confirms to the project's design rules and move the brief to the archive. Optionally takes the brief name, e.g. "/sdd-design:wrap-up pricing-page".

原文语言：英语

2026-10-02

已展示 5 / 5 个已收集 Skill。

用 AI 助手安装

复制这段 Prompt，发给你正在使用的 AI 助手。

Follow https://skillsmp.com/skill-install/prompt.md to install Agent Skills from https://github.com/rohaquinlop/spec-driven-designment.