SuperAPI AI 工具集

ui-ux-design

设计与创作

查看项目

更新于 10-16 06:50

技能介绍

用途:在用户请求 UI 组件、页面或应用,或提到表单、仪表盘、落地页、模态框,以及要求设计、构建、创建或改进界面时自动启用,输出可运行的代码。

主要能力:按四步工作流执行。先评估上下文(要解决的问题、目标用户、美学方向、框架与无障碍等约束);再查阅 REFERENCES.md 获取配色(含符合 WCAG 的值)、字体搭配、组件模式与间距排版令牌;然后生成代码,包含全部交互状态(悬停、聚焦、激活、禁用、加载、错误)、语义化 HTML、移动优先响应式布局与 CSS 变量;最后按清单核验。

输出标准:文本对比度 4.5:1、UI 组件 3:1;所有交互元素有可见焦点轮廓;触控目标最小 44×44px;尊重 prefers-reduced-motion;输入均有标签;空状态给出提示与操作;错误状态说明原因与修复方式。

美学方向:极简、玻璃拟态、新粗野主义、编辑风、有机风、深色模式,按场景匹配。需避免通用 AI 输出特征,如白底紫蓝渐变、到处使用 Inter/Roboto/系统字体、千篇一律卡片、仅靠颜色表意、移除焦点轮廓、无解决方案的错误提示。

恢复策略:用户不喜欢方向时提供 2-3 个替代方案;显得太通用时对照反模式并应用独特排版;无障碍问题核查对比度、焦点与语义 HTML;状态不全时按清单逐项排查。

限制:资料未提供具体框架绑定、安装命令、收费与平台信息;REFERENCES.md 的具体内容未在资料中给出。