SuperAPI AI 工具集

frontend-design

前端与建站

查看项目

更新于 10-16 06:16

技能介绍

用途:该技能用于创建独特、达到生产级质量的前端界面,避免千篇一律的“AI 生成”审美。当用户要求构建 Web 组件、页面、应用或界面时使用。用户提供前端需求,可能包含用途、受众或技术约束等背景。

主要能力:在编码前先做设计思考,明确目标与受众、选定大胆的美学方向(如极简、复古未来、奢华、编辑杂志风、粗野主义等)、确定技术约束与差异化记忆点。随后实现可运行的代码(HTML/CSS/JS、React、Vue 等),要求生产可用、视觉醒目、风格统一、细节精致。

美学关注点:字体上选用美丽独特、有性格的字体,避免 Arial、Inter 等通用字体,采用独特展示字体搭配精致正文字体;配色上保持统一主题并用 CSS 变量,以主色配锐利点缀色;动效上用于效果与微交互,HTML 优先纯 CSS,React 可用 Motion 库,重视页面加载的编排与滚动、悬停状态;布局上采用非对称、重叠、对角流、打破网格等意外排版,以及充足留白或受控密度;背景与视觉细节上营造氛围与纵深,使用渐变网格、噪点纹理、几何图案、分层透明、戏剧化阴影、装饰边框、自定义光标、颗粒叠加等。

限制与要求:不得使用通用 AI 风格,如滥用的字体族、俗套配色(尤其白底紫色渐变)、可预测的布局与组件模式。需根据语境做出意想不到的选择,不同设计不应雷同,避免在多次生成中收敛到常见选择(如 Space Grotesk)。实现复杂度需与美学愿景匹配:极繁设计需大量动画与效果代码,极简设计则需克制、精准,注重间距、字体与微妙细节。

资料中未提供具体安装命令、定价或平台限制等信息。