用途：适用于布局、层级、可用性、排版、间距、配色、无障碍或响应式行为会显著影响结果的前端界面改动。
主要流程与能力：先定义产品上下文，明确目标用户、主要任务、关键流程、必需内容与成功标准，并说明界面应呈现运营型、编辑型、活泼、数据密集或电商等具体产品气质；随后检查现有前端，沿用已有的组件、路由、状态、样式、令牌、图标与无障碍模式，优先复用本地设计系统；再编写简短设计简报，写明信息层级、主要操作、导航、空/加载/错误状态、断点与内容密度，并从产品目的而非视觉新奇度选择字号、间距与颜色角色。
图像生成：仅当产品目的、构图或视觉基调不明确时使用，生成 1 至 3 张 UI 效果图作为层级、密度与氛围参考，而非实现规格；不依赖生成文字、不可访问的对比度、装饰性堆砌或不可能的组件状态。
实现与验证：将方向转化为代码原生决策，定义布局区域、组件职责、响应式行为、焦点顺序、语义 HTML、颜色令牌、字号与交互状态；优先使用真实内容与真实数据；以小步可审查方式实现，避免布局偏移、文字重叠、控件裁切与视口相关破坏；在真实浏览器中检查代表性桌面与移动视口，覆盖悬停、焦点、键盘、空/加载/错误、长文本与密集数据状态，检查文字适配、对比度、目标尺寸、滚动行为，以及主流程是否无需解释性文案即可看懂；运行项目验证，如 lint、类型检查、测试、构建或项目级验证脚本，并记录仍需人工审查的视觉风险。
限制：资料未提供安装命令、收费方式、支持的平台或性能指标，也未给出具体代码示例；图像生成仅作方向参考，不得当作实现规格。