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文件,帮助用户规划实施优先级。
用户希望分解工作项
根据设计简报创建任务列表
规划功能实现顺序
提及 'tasks' 或 'breakdown'
npx skills add julianoczkowski/designer-skills --skill brief-to-tasks -g -y
通过交互式访谈和代码库探索,协助用户制定UI/UX设计简报。适用于规划新功能、页面或定义UI方向,最终输出结构化Markdown文件至项目目录。
用户要求编写设计简报
计划新功能或页面
定义UI方向
提及brief
npx skills add julianoczkowski/designer-skills --skill design-brief -g -y
引导用户完成从构思到构建的全流程设计工作流。按顺序执行 grill-me、design-brief 等阶段,支持跳过特定步骤,确保每步确认后再进入下一阶段,适用于从零开始或完整走通设计流程的场景。
Run the full design flow
Walk me through the complete process for a new project
Start from scratch and take me through everything
Design flow for a dashboard app
npx skills add julianoczkowski/designer-skills --skill design-flow -g -y
对已构建应用进行结构化设计审查,对比设计简报评估视觉层级、一致性、响应式及无障碍性。强制要求截图验证视觉效果,检查代码实现与设计哲学的契合度。
用户请求设计审查或批评
提及 review 或 QA 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
指导构建具有独特美学风格的生产级前端界面,通过探索现有代码库和选择设计哲学(如极简或日式),生成注重细节的高质量组件与页面代码。
需要创建具有高设计质量的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
用于在产品或网站视觉设计前定义信息架构,涵盖导航、内容层级、页面结构、URL模式及用户流程。通过分析现有代码库并与用户访谈,生成IA文档以规划站点结构。
规划应用的信息架构
映射导航和页面结构
整理文档站点的內容
定义用户引导流程
提及IA或信息架构
npx skills add julianoczkowski/designer-skills --skill information-architecture -g -y


