用途:为任意前端 UI 的创建、评审与修改引入资深产品设计师的判断力,强调原则而非代码模式,框架无关,可用于 React、HTML/CSS、Framer Code 组件等前端产出。
主要能力:先读取现有设计系统、组件库与代码库,优先扩展而非对抗;无系统时默认精致极简,并至少保留一个有意为之的个性选择。通过设置“旋钮”确定产品类型、密度与表现力,避免不同项目产出雷同。区分不可妥协的质量底线(对比度 4.5:1 正文、3:1 大字号与 UI、触控目标≥44×44px、可见焦点、语义 HTML、仅用 opacity/transform 动画、不用 transition: all、标签而非占位符当标签、prefers-reduced-motion、完整状态、无魔法数字、真实内容)与可有意覆盖的默认值。核心五条:每屏一个焦点、留白是结构、每种颜色须有理由、能删则删、先适配既有系统。七项原则:视觉层级、有意图的色彩、字体即结构、间距节奏、克制、一致性与系统、个性。
使用方式:按任务读取针对性参考文件,如组件模式、动效手感、动效性能、无障碍审查、重设计审计、内容真实感、视觉校准、前端实现护栏、最终打磨、shadcn 实现等,只加载最小必要集合。
适用场景:前端界面设计、评审、重设计与最终质量检查。
限制:资料未提供安装命令、收费、价格与平台信息;具体参考文件内容与完整细节暂未提供。