用途:以竞品灵感为起点,系统化地搭建专业设计系统,并据此生成界面方案。
主要能力与流程:工作流为 发现提问 → 添加灵感图片 → extract-it → [expand-it] → merge-it → design-it。extract-it 分析 /inspiration 中的截图,输出 /generated/competitor-analysis.md;expand-it 为可选步骤,追加理念章节与可执行的实现指导;merge-it 将竞品分析与用户应用概念融合,输出 /generated/styles.md;design-it 依据该设计系统生成 React + Tailwind 组件,变体数量由用户指定(默认 3,可 1 至 5)。
必要用法:项目需有 /inspiration 文件夹(用户放入竞品截图)与 /generated 输出目录,缺失时创建;若 /inspiration 为空且需提取,先请用户添加图片。执行任何步骤前必须先做发现阶段提问,不得跳过或直接生成。新项目询问应用名称、用途、面向人群、期望传递的情绪、视觉灵感应用名、是否有截图、需要设计多少及哪些屏幕、平台;回归用户先检查已生成文件判断进度,再询问下一个屏幕、变体数量与特殊要求;design-it 请求还需确认屏幕、变体数与约束条件。用户答复后方可进入流程。
严格规则:生成的 UI 代码中任何位置都不得使用 emoji,包括 JSX、文本、标签、按钮、标题、占位符、提示等,需要视觉指示时改用 Lucide React 图标。命令分派按用户请求识别对应步骤并读取相应参考文件;请求不明确时检查 /generated 下已有文件并澄清。
限制:具体图标库版本、依赖安装方式和运行命令资料未提供;本工具聚焦设计与组件生成流程,未提供部署、测试或后端能力说明。