docs(project): document synchronized design capabilities

This commit is contained in:
Jim Liu 宝玉
2026-07-25 22:00:53 -05:00
parent b99a5d9856
commit baf5d83b16
2 changed files with 10 additions and 4 deletions
+5 -2
View File
@@ -91,12 +91,15 @@ The skill drives a full design process — clarifying questions → gathering de
| **Core design** | Hifi design · Interactive prototype · Wireframe · Frontend aesthetic direction |
| **Decks** | Make a deck · Speaker notes |
| **Mobile & motion** | Mobile prototype · Animated video · Sound effects |
| **Web & campaigns** | Website & landing page · Social media content · HTML email · Flier · Trifold brochure |
| **Data & research** | Web research · Data science · Data visualization · Maps & geography · Experiment workflow |
| **Documents, 3D & illustration** | Make a doc · 3D object · Watercolor illustration |
| **Design systems** | Create design system · Use design system · Design system preview · Design Components (`.dc.html`) · Make tweakable |
| **Import sources** | Figma `.fig` (offline decode) · GitHub repo · Existing HTML/CSS |
| **Export & handoff** | Standalone HTML · PDF · PPTX (editable) · PPTX (screenshots) · Video (MP4) · Send to Figma · Send to Canva · Handoff to Claude Code |
| **AI assets & integration** | Gemini image generation · Call Claude from prototypes · Read PDF |
**Starter components** (in [`starter-components/`](skills/baoyu-design/starter-components/)) save the agent from handrolling the basics: iOS / Android / macOS / browser frames, a panzoom design canvas, a slidedeck stage, a timeline animation engine, a tweaks panel, and a fillable image slot.
**Starter components** (in [`starter-components/`](skills/baoyu-design/starter-components/)) save the agent from handrolling the basics: device, browser, and social-media shells; a panzoom design canvas; slide, animation, chart, document, file, and 3D stages; a tweaks panel; and a fillable image slot.
---
@@ -113,7 +116,7 @@ skills/baoyu-design/
│ ├── cursor.md # Tool map for Cursor
│ └── codex.md # Tool map for Codex Agent
├── built-in-skills/ # Specialized prompts (decks, mobile, import, export, …)
└── starter-components/ # Device frames, deck stage, canvas, animation engine, …
└── starter-components/ # Device/social shells, deck, chart, document, 3D, animation, …
```
When you ask for a design, the agent reads `SKILL.md`, loads the core methodology from `system-prompt.md`, detects whether it's running in Cursor, Claude Code, Codex Agent, or a generic filecapable harness, and reads the matching reference doc when one exists. It then pulls in only the builtin skill(s) the task needs. The split keeps craft rules harnessindependent while each environment resolves its own tools for *asking questions*, *previewing*, *screenshotting*, and *verifying*.
+5 -2
View File
@@ -92,12 +92,15 @@ Cursor、Codex、Claude 和 Claude Design 使用的是同一个 Reader Mac App P
| **核心设计** | 高保真设计 · 可交互原型 · 线框图 · 前端美学方向 |
| **幻灯片** | 制作演示文稿 · 演讲者备注 |
| **移动与动效** | 移动端原型 · 动画视频 · 音效 |
| **网站与营销** | 网站与落地页 · 社交媒体内容 · HTML 邮件 · 传单 · 三折页 |
| **数据与研究** | 网页研究 · 数据科学 · 数据可视化 · 地图与地理 · 实验工作流 |
| **文档、3D 与插画** | 制作文档 · 3D 对象 · 水彩插画 |
| **设计系统** | 创建设计系统 · 使用设计系统 · 设计系统预览 · 设计组件(`.dc.html`)· 可调参数化 |
| **导入设计源** | Figma `.fig`(离线解码)· GitHub 仓库 · 现成 HTML/CSS |
| **导出与交付** | 独立 HTML · PDF · PPTX可编辑· PPTX截图· 视频MP4· 导出到 Figma · 导出到 Canva · 交接给 Claude Code |
| **AI 素材与集成** | Gemini 图像生成 · 在原型中调用 Claude · 读取 PDF |
**起步组件**(位于 [`starter-components/`](skills/baoyu-design/starter-components/))让 Agent 不必从零手搓基础件:iOS / Android / macOS / 浏览器外壳可平移缩放的设计画布幻灯片舞台、时间轴动画引擎、参数调节面板以及可填充的图片占位槽。
**起步组件**(位于 [`starter-components/`](skills/baoyu-design/starter-components/))让 Agent 不必从零手搓基础件:设备、浏览器和社交媒体外壳可平移缩放的设计画布幻灯片、动画、图表、文档、文件和 3D 舞台;参数调节面板以及可填充的图片占位槽。
---
@@ -114,7 +117,7 @@ skills/baoyu-design/
│ ├── cursor.md # Cursor 的工具映射
│ └── codex.md # Codex Agent 的工具映射
├── built-in-skills/ # 专项子技能(幻灯片、移动端、导入、导出……)
└── starter-components/ # 设备外壳、幻灯片舞台、画布、动画引擎……
└── starter-components/ # 设备/社交外壳、幻灯片、图表、文档、3D、动画……
```
当你提出设计需求时Agent 会读取 `SKILL.md`,从 `system-prompt.md` 加载核心方法论,判断自己运行在 Cursor、Claude Code、Codex Agent还是一个通用的可读写文件 harness如果有匹配的参考文档就读取对应文档然后只按需载入这次任务用得到的子技能。这种拆分让「工艺规则」与具体 Agent 无关,而每个环境各自去解析自己的工具来完成「提问」「预览」「截图」「校验」。