designer-skills
为设计师提供的AI编码工具结构化工作流技能集
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：designer-skills。 它的用途是：为设计师提供的AI编码工具结构化工作流技能集 完整的 Skill 内容见：https://321skill.com/skills/designer-skills/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
'我想为一个新的笔记应用设计登录页面'，然后使用`/design-flow`命令。AI会首先通过`/grill-me`技能详细询问你的品牌调性、目标用户和功能需求，接着引导你完成`/design-brief`制定设计概要，并可能调用其他技能生成具体的UI组件代码和样式建议，确保产出物紧扣设计目标。
介绍
这是一个专为设计师和原型开发者设计的AI助手技能集合，旨在解决AI编码工具（如Claude Code、Cursor）输出结果随机、缺乏设计流程引导的问题。它通过一系列预设技能，将设计过程编码化，引导AI遵循结构化的路径进行思考和产出，从而生成更符合设计意图和逻辑的代码与原型。
使用方式非常灵活，你可以通过简单的命令行npx skills add进行安装，交互式CLI会引导你选择要安装的技能、目标AI代理以及安装范围。如果你使用Claude Code，还可以直接将其作为插件安装，所有技能会自动加载，你可以通过特定命令（如/designer-skills:design-brief）显式调用，或让AI根据任务描述自动触发。
这个技能集非常适合那些利用AI工具进行快速原型构建、界面开发或探索设计实现可能性的UI设计师、产品经理以及具备设计思维的前端或全栈开发者。它尤其适合在项目初期构思、设计评审或需要将设计想法快速转化为可交互原型的场景中使用。
建议用户从/design-flow命令开始，体验完整的引导式工作流程。由于技能文件本质上是指导AI的指令集，在用于敏感或生产环境前，请务必仔细审查技能内容。同时，确保你的开发环境和API密钥安全，并关注官方更新以获取最新功能和修复。
核心特点
与通用代码生成技能不同，它深度嵌入了设计思维流程（如设计简报、审问式需求澄清、设计评审），强制AI进行结构化思考，而非单纯生成代码片段；同时，它提供了`/design-flow`命令，能自动编排多个技能，引导用户完成从需求澄清到设计实现的全流程。
注意事项
不适合需要高度定制化、非结构化创意发散或完全脱离设计流程的纯代码实现任务。
常见问题
这个技能集支持哪些AI编码工具？
支持Claude Code、Cursor、Codex、Windsurf等40多种AI代理。
如何更新已安装的技能？
对于Claude Code插件，使用`/plugin update designer-skills@designer-skills`；对于通过CLI安装的，重新运行安装命令或检查仓库更新。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/designer-skills/raw/index.md 读取 designer-skills 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/designer-skills/raw/index.md（查看排版版本）