baoyu-design Skill 技能

baoyu-design 是将 Claude Design 设计引擎打包为可移植 Agent Skill 的开源项目，让用户在本地 AI 编程工具中直接调用完整的设计工作流，输出为自包含的 HTML 原型，无需离开编辑器、无需订阅官网服务。

设计全流程覆盖，从澄清需求到交付可交互原型

baoyu-design 不是简单的 prompt 合集，而是一套完整的设计方法论。它驱动 AI 经过「需求澄清 → 收集设计上下文 → 产出 HTML 交付物 → 预览验证」的完整闭环，内置数十个专项技能，覆盖界面设计、原型、线框图、落地页、数据可视化、PPT 原生导出等场景。

内置技能包括：Hi-Fi 设计、可交互原型、线框图、前端美学方向、幻灯片（含演讲者备注）、移动端原型、动态视频与音效、社交媒体内容、HTML 邮件、三折页传单、数据科学、Web 研究、3D 对象、水彩插画、设计系统创建与使用、Figma 导入、PDF/PPTX/MP4 视频等导出格式，以及 Gemini 图像生成。

输出质量的关键在于模型强度——官方推荐 Claude Opus 4.8，配合使用效果最佳，其他强模型也能获得不错效果。

即时预览循环：边看边改，比截图反馈快十倍

由于产出是本地 localhost 上的纯 HTML 文件，用户可以借助 Cursor Browser / DevTools、Claude Preview 或 Codex Browser 的内置浏览器预览，手指指向任意元素直接说「把这个按钮改成蓝色」，AI 编辑底层源代码完成修改，形成紧密的视觉反馈循环。这比「截图 → 描述问题 → 等修改 → 再截图」的传统流程效率高出十倍不止。

本地运行的自由度

完全在本地执行，所有产出文件保存在 designs// 目录下，作为标准 HTML 版本控制、fork、二次定制或直接上线。安装简单，一行命令 npx skills add JimLiu/baoyu-design 即可，支持 Claude Code、Cursor、Codex 及 70+ 主流 AI 编程工具，也支持通过粘贴 GitHub 仓库 URL 让 AI 自动读取 SKILL.md 工作。

baoyu-design 将 claude.ai/design 绝大部分能力迁移到本地，把设计工作流真正融入了 AI 编程的日常。