SuperAPI AI 工具集

frontend-design

前端与建站

查看项目

更新于 10-15 19:56

技能介绍

用途:在构建 Web 页面或应用组件时,引导生成具有鲜明视觉风格、非模板化的生产级前端界面,避免常见的“AI 味”设计。

主要能力:先做设计思考,明确界面要解决的问题、使用者、技术约束(框架、性能、可访问性)以及差异化记忆点,并选定一个明确的美学方向(如极简、极繁、复古未来、自然、奢华、玩具感、杂志编辑、粗野主义、装饰几何、柔和粉彩、工业实用等)。随后实现可运行代码(HTML/CSS/JS、React、Vue 等),要求功能可用、视觉突出、风格统一、细节精致。

设计要点:排版上选择独特、有性格的字体,避免 Arial、Inter 等通用字体,用特色展示字体搭配精致正文字体;配色用 CSS 变量保持统一,以主色加锐利点缀;动效用动画与微交互,HTML 优先纯 CSS,React 可用 Motion 库,重视页面加载的错落揭示与滚动、悬停惊喜;空间构图追求非对称、重叠、对角流动、打破网格,以及大量留白或受控密度;背景与视觉细节用渐变网格、噪点纹理、几何图案、层叠透明、戏剧阴影、装饰边框、自定义光标、颗粒叠加等营造氛围与深度。

限制与注意:避免过度使用的字体、俗套配色(如白底紫色渐变)、可预测布局与千篇一律的组件模式;不同生成之间应在明暗主题、字体、美学上有所变化,不要收敛到常见选择。实现复杂度需匹配美学愿景:极繁设计需要大量动画与效果,极简设计则需克制、精确,注重间距、排版与微妙细节。资料未提供具体安装命令、收费方式或平台支持信息。