用途 本技能用于在用户要求构建 Web 组件、页面、应用或界面时，指导创建独特、生产级且具有高设计质量的前端界面，避免千篇一律的“AI slop”审美。
主要能力
- 在编码前进行设计思考，明确用途、受众、技术约束与差异化点。
- 引导选择并贯彻一个大胆的美学方向，如极简、繁复、复古未来、自然、奢华、趣味、杂志编辑、粗野主义、装饰艺术、柔和粉彩、工业实用等。
- 输出真实可运行代码，支持 HTML/CSS/JS、React、Vue 等，要求功能完整、视觉醒目、风格统一、细节精致。
- 覆盖前端美学要点：字体选择、配色与主题、动效与微交互、空间构图、背景与视觉细节。
使用方式 用户提供前端需求，包括要构建的组件、页面、应用或界面，并可附带用途、受众或技术约束等背景信息。技能会先完成设计思考，再实现代码。对于 HTML 优先使用纯 CSS 方案实现动效；在 React 中可用 Motion 库。建议使用 CSS 变量保持配色一致，通过 animation-delay 实现错落式加载动画，并运用滚动触发与悬停状态。
适用场景 适合需要打造具有鲜明视觉个性、令人难忘且可直接投入生产的前端界面，例如品牌页面、作品集、营销站点、创意组件等。
限制
- 应避免通用 AI 审美，包括 Inter、Roboto、Arial、系统字体，白底紫色渐变，可预测布局与模板化组件。
- 不应在不同生成中收敛于相同选择，例如反复使用 Space Grotesk。
- 实现复杂度需与美学愿景匹配：繁复设计需要更精细的动画与效果代码，极简设计则需克制、精确并注重间距、排版与微妙细节。
- 资料未提供具体支持的框架版本、安装命令、收费价格、平台或效果数据，暂未提供相关信息。