（14563期）mar-frontend-design – 拒绝平庸，打造 unforgettable 界面

拒绝平庸，打造 unforgettable 界面 生成高设计质量的前端界面代码，避免AI通用美学，支持多种风格方向与框架实现 使用说明 核心用法 该技能用于创建具有独特视觉风格的生产级前端界面，重点解决AI生成代码中常见的"平庸美学"问题。使用时需明确指定设计方向（极简/极繁/复古未来/有机自然/奢华精致/ playful/编辑杂志/粗野主义/装饰艺术/柔和 pastel/工业实用），并配合具体技术栈（HTML/CSS/JS、React、Vue 等）。 显著优点 设计意图明确：强制要求在使用前确定大胆的美学方向，避免模棱两可的中间态 反模式约束：明确禁止 Inter、Roboto、Arial 等通用字体及紫白渐变等陈词滥调配色 动态表现力强：提供 CSS 动画、Motion 库集成、错位布局、对角线流等高级视觉技巧 上下文适配：根据极繁或极简风格自动匹配合适的代码复杂度 输出质量保障：要求代码具备生产可用性，而非仅概念原型 潜在局限 学习成本：使用者需具备一定设计素养才能有效运用"大胆方向"的决策框架 主观性强：" memorable"标准依赖个人审美，团队协作时可能出现分歧 性能风险：极繁风格建议"复杂代码"，未内置性能预算约束 无障碍考虑不足：文档强调视觉效果，对 a11y 实践提及有限 框架依赖：Motion 库建议绑定 React 生态，Vue/Svelte 用户需自行替代 适合人群 希望突破"AI 生成感"的前端开发者 需要快速产出高保真原型的产品设计师 追求视觉差异化的创意技术工作者 具备基础设计判断力、能执行"极端风格"决策的开发者 常规风险 过度设计：极繁方向易导致动画冗余、CLS 累积 可维护性：大量自定义 CSS 变量、非标准布局增加长期维护成本 品牌一致性：若未建立设计系统，多次调用可能产生风格碎片化 设备兼容：高级效果（渐变网格、噪声纹理）在低端设备上性能降级 原始说明 Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when building web components, pages, or applications. Gener...