Agent Skills
› julianoczkowski/designer-skills
julianoczkowski/designer-skills
GitHub将设计简报拆解为可独立构建的垂直切片任务清单。通过扫描代码库理解现有组件和依赖,按依赖、视觉优先级和风险排序,生成有序的任务列表并保存为 Markdown 文件,帮助用户规划功能实现顺序。
Install All Skills
npx skills add julianoczkowski/designer-skills --all -g -y
Skills in Collection (8)
将设计简报拆解为可独立构建的垂直切片任务清单。通过扫描代码库理解现有组件和依赖,按依赖、视觉优先级和风险排序,生成有序的任务列表并保存为 Markdown 文件,帮助用户规划功能实现顺序。
用户希望将设计简报分解为具体任务
询问应该先构建哪些内容或如何规划构建顺序
提到创建任务列表或工作分解
npx skills add julianoczkowski/designer-skills --skill brief-to-tasks -g -y
通过交互式访谈和代码库探索,协助用户制定UI/UX设计简报。适用于规划新功能、页面或定义视觉方向,最终保存为Markdown文件。
用户要求编写设计简报
计划新功能的UI方向
定义页面或功能的设计规范
npx skills add julianoczkowski/designer-skills --skill design-brief -g -y
该技能用于引导用户完成从设计构思到前端实现的完整工作流。通过顺序执行 Grill Me、Design Brief 等阶段,提供结构化指导,支持跳过特定步骤,确保每个环节确认后再进入下一步,适用于从零开始的项目或提及“design flow”的场景。
用户希望运行完整的设计流程
用户要求从头开始新项目
用户提及 'design flow' 或 'full workflow'
npx skills add julianoczkowski/designer-skills --skill design-flow -g -y
对已构建应用进行结构化设计评审,检查视觉层级、一致性、响应式及无障碍性。强制捕获运行截图,对比设计简报与代码实现,确保美学保真度。
用户要求审查设计或进行 QA 测试
提及 review、critique、polish pass
npx skills add julianoczkowski/designer-skills --skill design-review -g -y
基于设计哲学生成项目基础的设计令牌(CSS变量或Tailwind配置),支持明暗模式、间距和类型比例。用于新项目启动或建立视觉系统,自动检测现有配置并扩展,确保组件引用统一而非硬编码。
初始化新项目视觉系统
提及tokens或design system
需要设置间距尺度和颜色调色板
npx skills add julianoczkowski/designer-skills --skill design-tokens -g -y
指导构建具有独特美学风格的生产级前端界面,强调设计质量与代码实现。通过探索现有代码库、理解上下文及遵循特定美学哲学(如 Dieter Rams 风格),生成注重细节、避免通用 AI 输出的高质量组件与页面代码。
需要构建具有特定美学风格的 UI 组件或页面
要求前端界面具备高设计质量和独特视觉风格
根据具体美学理念(如斯堪的纳维亚、日式杂志等)生成布局
npx skills add julianoczkowski/designer-skills --skill frontend-design -g -y
通过持续追问和压力测试,帮助用户深入审视计划或设计,理清决策树分支并达成理解。适用于用户希望挑战方案、验证思路或进行深度思考的场景。
用户要求压力测试计划或设计
用户提到 'grill me' 或类似表达
npx skills add julianoczkowski/designer-skills --skill grill-me -g -y
定义产品或网站的结构层,涵盖导航、内容层级、页面结构和用户流程。在视觉设计前规划站点结构,分析现有代码库路由与布局,并与用户确认决策,最终生成信息架构文档。
规划应用的信息架构
映射导航和页面结构
组织文档站点的內容
定义用户引导流程
提及 IA 或信息架构
npx skills add julianoczkowski/designer-skills --skill information-architecture -g -y


