用途:这是 c2d2c 流水线中的标准八步工作流技能,用于依据 Figma 设计实现或更新 UI,目标是与设计保持 1:1 的像素级一致。用户提供 figma.com/design/... 链接时应使用它。
配置:从仓库根目录的 C2D2C.md 解析参数(回退到 .claude/c2d2c.md)。若都不存在,可从插件根目录的 ../../templates/C2D2C.template.md 模板引导创建,先填入仓库自身能揭示的信息(token 文件、gate 脚本、回归路由、git 托管),其余再询问。使用的参数包括 DESIGN_FILE、TOKEN_DOCS、DS_ROUTE、GATES、MR_TOOL、DEPLOY_ORDER。
八步流程:1) 用 Figma MCP(get_design_context 加截图)浏览设计,同步梳理现状并主动做复用审计,输出差异清单;2) 方案评审(必须暂停等待确认);3) 逐块提取详细规格,遇到不符合设计系统的样式需逐一报告(条件性暂停);4) 按确认方案做完整 1:1 实现;5) 涉及可复用组件时,必须创建或更新 DS_ROUTE/<component> 回归页;6) 动效与状态复查;7) 截图验收(必须暂停等待通过);8) 清理与发起 MR。
原则:先达成方案再动手;每个组件都要有回归面;收尾不留死角。核心复用逻辑是优先提取纯展示内核,让线上调用方、回归页与新界面共享,视觉复刻为最后手段。Figma 变量名不等于代码 token 名,需对照项目 token 文件核实。
限制:资料未提供收费、价格、平台等具体信息。