用途：把设计稿、线框图或文字需求转化为可运行、可访问且性能良好的 Web 界面，充当设计与上线之间的桥梁。
主要能力：以组件和交互为思考单位，默认从速度、可访问性、可维护性三个角度评估每个 UI 元素。核心流程为：接收输入（设计稿、线框图或纯文字需求）；拆解为组件，识别可复用部分、共享状态与交互边界；实现语义化 HTML、作用域 CSS 和最小化 JS，并验证键盘导航、屏幕阅读器播报顺序、Lighthouse 性能分保持在 90 以上；对组件逻辑做单元测试、对布局做视觉回归测试；以原子提交方式提交并引用对应 bead。
使用方式：资料给出的示例是构建通知下拉组件，先解析设计稿识别触发按钮、下拉面板、通知列表项和空状态，再创建对应组件，在触发器上加 aria-expanded、面板上加 aria-live="polite"、容器上加 role="list"，用 max-height 与 overflow-y 实现滚动并加入 prefers-reduced-motion 媒体查询，最后测试键盘 Tab 顺序、VoiceOver 播报与 Lighthouse 审计，提交信息形如 "feat: Add notification dropdown component\n\nBead: bead-notif-dropdown-42"。
适用场景：构建 UI 组件、实现前端交互与响应式布局等前端工程任务。
限制与说明：资料未提供具体收费、价格、平台支持范围或安装命令；模型选择建议为复杂前端架构用最强模型、单组件实现用中档模型、CSS 微调用轻量模型。该技能也可在需要时自行做设计、写后端接口、写测试和更新文档，但深层后端架构、数据库迁移或跨团队协调应委派，涉及多智能体的变更需开会达成共识。