设计与视频
UI UX Pro Max：按需求生成整套设计系统
使用这技能的好处
先交出可执行的设计系统，再让界面与动效有同一套规则。
技能摘要
给项目背景后，按内置规则选出结构、风格、配色、字体和关键效果，直接给出一套可执行的设计系统。该开源条目以 Agent Skill / SKILL.md 形式发布，作者为 nextlevelbuilder，适合把可复用流程交给 Cursor、Claude Code、Codex 等编码代理执行。博然AI笔记撰写原创导读，帮助读者看清交付物、适用边界、安装方式与常见踩坑。请以开源仓库为安装与许可准绳，以本页为中文实践参考。主要读者包括设计师、产品经理。收录时公开星标约为 114,000（快照）。博然AI笔记按「设计与视频」收录并提供原创导读，便于 SEO/GEO 场景下按摘要、受众、用法与来源分层阅读；安装与许可以开源仓库为准。
适合谁
- 产品设计师
- UI 设计师
- 产品经理
- 前端工程师
- 设计系统负责人
- Figma 使用者
- 创业者
- 品牌设计师
- 交互设计师
- 增长产品
- 设计师
- 视觉设计师
- 动效设计师
- 视频创作者
- 产品设计师
- UI 设计师
- 产品经理
- 前端工程师
- 设计系统负责人
- Figma 使用者
- 创业者
- 品牌设计师
- 交互设计师
- 增长产品
- 设计师
- 视觉设计师
- 动效设计师
- 视频创作者
这样用它
- 先提供产品、受众和页面清单，再让它出设计系统而不是散点建议。
- 选定方向后再进入编码，避免边写边改审美。
- 先锁定审美方向、字体与间距规则，再生成界面或素材；不要边生成边改品牌基线。
- 交付时核对移动端可读性、对比度与焦点态，把可访问性当成验收项而不是事后补丁。
- 明确任务目标后，用一句话告诉 Agent「按「UI UX Pro Max：按需求生成设计系统」技能执行」，并附上输入材料与截止条件。
- 第一次使用先做冒烟验收：对照本页步骤跑通最小闭环，再扩大到正式项目。
安装与来源
- 打开 nextlevelbuilder 维护的开源仓库，阅读根目录或 skills/ 下的 SKILL.md，确认触发词、依赖与兼容的 Agent 运行时（Cursor / Claude Code / Codex 等）。
- 按仓库 README 的安装方式引入：常见路径包括 skills CLI、手动拷贝技能目录到本地 skills 加载路径，或按作者提供的安装脚本执行。
- 安装后重启或热加载 Agent，用本页「这样用它」第一条提示做冒烟测试，确认技能被正确识别且约束生效。
- 留意许可证、遥测开关与版本号；升级前阅读 CHANGELOG，避免破坏既有工作流。
- 星标与版本以仓库公开页面为准；本站摘要与步骤为博然原创整理，用于选型参考，不代表原作者立场，也不替代上游文档。
源码与许可证以 GitHub 仓库 为准；星标为收录快照。