zhaoxuya520/AI-Fullstack-Delivery-Workflow - 第 4 页

component-states

定义 UI 组件的所有状态时使用。适用于按钮、表单、列表、对话框等组件的状态完整覆盖。优先使用 8 种核心状态（默认/悬停/聚焦/禁用/加载/成功/错误/空/权限）。

design-handoff

把设计交接给前端时使用。适用于设计完成后的交付、设计审查通过后的执行准备。优先使用 Figma DevMode 实践 + 交接清单 + 待确认问题。

design-system-mapping

对标参考成熟设计系统时使用。适用于复杂后台、SaaS、开发者工具的设计。优先参考 Material/HIG/Carbon/Ant Design/shadcn/Radix 等成熟系统，按本项目约束适配。

design-tokens

建立设计令牌系统时使用。适用于设计系统建立、跨平台一致性、设计代码同步。优先使用 W3C DTCG 2025.10 标准 + 三层 Token + JSON 输出。

enterprise-patterns

设计企业级 UI 模式时使用。适用于后台管理、SaaS 控制台、表格表单密集页面。优先使用表单/表格/导航/危险操作的成熟模式。

hig-principles

设计移动 App 或多平台产品时使用。适用于 iOS/Android/桌面应用的平台原则适配。优先使用 Apple HIG 四原则 + Material Design 3 原则 + 平台规范。

information-architecture

设计产品整体信息架构和导航结构时使用。适用于多页面产品、复杂功能模块、内容组织。优先使用卡片分类 + 树状结构 + 导航模式选择。

page-structure

设计单页面结构和线框图时使用。适用于功能页面设计、内容布局、主次操作排布。优先使用页面目标导向方法 + 内容层级 + 主次操作区分。

responsive-design

设计跨设备适配时使用。适用于桌面/平板/移动端的布局、断点策略、内容优先级。优先使用 Mobile-First + 5 个标准断点 + 内容优先级降级策略。

usability-evaluation

评审界面可用性时使用。适用于设计稿评审、上线前检查、改版前诊断。优先使用 Nielsen 十大启发式 + 严重程度评分 + 行动项。

user-flow

设计用户从入口到完成任务的流程时使用。适用于功能流程梳理、页面跳转设计、决策点和异常路径定义。优先输出 Mermaid 流程图 + 主路径 + 异常路径。

visual-style

定义视觉风格和反 AI 化检查时使用。适用于设计前的风格定调、避免泛化和模板化。优先使用风格库选择 + 明确禁用的 AI 模板化效果。