如何让 AI 优化现有项目的 UI 设计并提升质感

解决“AI 风格”过于泛滥或 UI 显得廉价的问题：通过系统性的设计审计，让 AI 在不破坏现有功能和架构的前提下，针对性地优化字体、色彩、布局和交互，将通用界面提升至专业级质感。

为什么需要这个技能

很多由 AI 快速生成的项目，或者早期开发的雏形，往往带有明显的“通用感”：使用默认的 Inter 字体、简单的圆角卡片、高饱和度的对比色，以及缺乏细节的交互状态。

如果直接要求 AI “重新设计”，它可能会倾向于重写整个框架或更改业务逻辑，导致项目崩溃。本技能提供了一套严谨的审计流程，引导 AI 在保留原有技术栈（如 Tailwind, CSS Modules）的同时，通过微调视觉参数（如光学对齐、色调统一、动态反馈）来提升整体质感。

全量扫描 (Scan)：读取代码库，识别当前使用的前端框架、样式方案（如 Tailwind 或原生 CSS）以及既有的设计模式。
专项诊断 (Diagnose)：按照设计审计清单（Typography $\to$ Color $\to$ Layout $\to$ Interactivity）逐一排查弱点，列出所有泛泛而谈的 UI 模式。
精准修复 (Fix)：在现有技术栈内实施针对性升级。禁止盲目重写，优先通过优化字体、调整间距、增加微交互来提升质感。

为了在最小风险下获得最大视觉提升，建议 AI 按以下顺序操作： 字体更换 $\to$ 色盘清理 $\to$ 交互状态补全 $\to$ 布局与间距优化 $\to$ 替换通用组件 $\to$ 状态页完善 $\to$ 细节精调。

解压后将目录放入你的 AI 工具 skills 文件夹，重启工具后即可使用。具体路径参考内附的 USAGE.zh.md。

暂无推荐