用途:当用户要求构建网页组件、页面、应用或界面时,该技能引导产出独特、生产级的前端界面,避免通用化的“AI slop”审美,并以真实可运行的代码实现,注重美学细节与创意选择。
主要能力:在编码前先进行设计思考,明确界面要解决的问题与使用者;选择一种极端的基调方向,例如极简、极繁混乱、复古未来、有机自然、奢华精致、玩具感、杂志编辑风、粗野主义、装饰几何、柔和粉彩、工业实用等;考虑框架、性能、无障碍等技术约束;并思考差异化,即什么让界面令人难忘。随后实现可运行代码,支持 HTML/CSS/JS、React、Vue 等,要求生产级可用、视觉醒目、审美统一、细节精炼。
美学准则:字体选择美丽、独特、有趣,避免 Arial、Inter 等通用字体;色彩与主题保持统一,使用 CSS 变量,主色配锐利点缀优于平均分布;动效用于效果与微交互,重视高冲击时刻,如一次编排良好的页面加载与错落揭示;空间构图追求非预期布局、不对称、重叠、对角流动、打破网格,以及大量留白或受控密度;背景与视觉细节营造氛围与深度,而非默认纯色。明确禁止过度使用的字体、白底紫色渐变等陈词滥调配色、可预测的布局与组件模式。
使用方式:用户提供前端需求,包括要构建的组件、页面、应用或界面,并可附上用途、受众或技术约束等背景。技能据此先确定清晰的概念方向,再精确执行。
适用场景:需要高设计质量、有辨识度的前端界面构建任务。
限制:资料未提供具体安装命令、收费、价格、平台支持范围或效果保证等信息。