Multica Design UI Impl

把 UI / 交互设计产物对接到设计协作平台(默认 Figma)。用于 @Designer 上传视觉稿、取回链接与标注,供前端下游消费。平台可替换。

it235 Updated

File contents

Artifact · UI Design Sync

Purpose

把 UI 设计产物落地到团队统一的设计协作平台,并让下游(前端)用稳定方式取回。

本 skill 把「平台对接」与「角色提示词」解耦:角色提示词只说"产出 UI 设计",不关心平台。换公司(用 Zeplin / 蓝湖 / MasterGo 等)只改本 skill,不动 @Designer 提示词。

默认平台:Figma

  • 产出:Figma 文件链接 + 标注(颜色 / 间距 / 字号 / 组件)+ 切图 / 导出。
  • 上传:在 Figma 内完成设计后,把文件链接关键 Frame 链接作为产物引用。
  • 取回:下游 @FrontendDev 通过链接读取,链接即稳定引用,不依赖本地文件。

产物内容规范(与角色解耦的部分)

无论平台是什么,UI 产物至少包含:

  • 页面 / 模块结构(与 PRD 信息架构对齐)
  • 状态:空态、加载态、异常态、无权限态
  • 交互:入口、跳转、校验反馈
  • 标注:尺寸、间距、色值、字体、组件边界

用法(角色侧只写这一句)

@Designer:「产出 UI 设计,用 multica-design-ui-impl skill 落地到团队设计平台,并把链接回传给 Leader。」

替换平台(不改角色提示词)

把本 skill 的「默认平台」段替换为你们的工具(蓝湖 / Zeplin / MasterGo / 内部设计库),保持「上传 + 回传稳定链接」接口不变即可。

为什么有效

平台在团队间差异极大,把平台名写进角色提示词会固化它;下沉到 skill 后,角色保持「产出什么内容」的稳定描述,平台随 skill 替换。

it235/multica-best-practices/tree/main/templates/zh_CN/skills/designer/multica-design-ui-impl commit 827c5e1fb6

Frequently asked questions

npx skillmds@latest add it235/multica-design-ui-impl-2