用途
本技能用于对现有网站或应用进行视觉与交互升级，目标是达到“高端”品质。它不重写项目，而是基于现有技术栈进行针对性改进。
主要能力
技能包含一套完整的设计审计清单，覆盖以下方面：
- 排版：检查默认字体、标题表现力、正文宽度、字重层次、数字字体、字距、大小写、孤行等问题。
- 色彩与表面：检查纯黑背景、过饱和强调色、多强调色、灰阶混用、AI风格渐变、阴影、纹理、渐变均匀度、光照一致性、暗色区块突兀、区块缺乏视觉深度等。
- 布局：检查对称居中、三等分卡片、视口高度单位、Flexbox百分比计算、容器最大宽度、卡片等高、圆角统一、层次重叠、垂直内边距对称、仪表盘侧边栏、留白、按钮底部对齐、功能列表起始位置、垂直节奏、光学对齐等。
- 交互与状态：检查悬停状态、按下反馈、过渡时长、焦点环、加载状态、空状态、错误状态、死链、导航当前页指示、滚动跳跃、动画属性等。
- 内容：检查通用姓名、假数字、占位公司名、AI文案陈词滥调、感叹号、错误消息语气、被动语态、日期随机性、头像重复、Lorem Ipsum、标题大小写等。
- 组件模式：检查通用卡片、按钮组合、药丸徽章、手风琴FAQ、三卡轮播推荐、三塔定价表、模态框滥用、圆形头像、明暗切换、页脚链接农场等。
- 图标：检查图标库选择、陈词滥调图标、描边宽度一致性、favicon、库存照片等。
- 代码质量：检查语义化HTML、内联样式、硬编码宽度、alt文本、z-index、死代码、导入幻觉、元标签等。
- 战略遗漏：检查法律链接、返回导航、自定义404、表单验证、跳转内容链接、Cookie同意等。
此外，技能提供了升级技术参考，包括排版升级（可变字体动画、描边到填充过渡、文本遮罩揭示）、布局升级（破格网格、留白最大化、视差卡片堆叠、分屏滚动）、动效升级（惯性平滑滚动、交错入场、弹簧物理、滚动驱动揭示）、表面升级（真实玻璃拟态、聚光边框、噪点叠加、着色阴影）。
使用方式
技能按以下顺序工作：
- 扫描：读取代码库，识别框架、样式方法（Tailwind、原生CSS、styled-components等）和当前设计模式。
- 诊断：运行审计清单，列出所有通用模式、弱点和缺失状态。
- 修复：在现有技术栈上应用针对性升级，不从头重写。
修复优先级从高到低为：字体替换、色彩清理、悬停/激活状态、布局与间距、替换通用组件、添加加载/空/错误状态、打磨排版比例与间距。
适用场景
适用于已有网站或应用需要提升设计品质、去除“AI生成感”、增强专业感和完成度的场景。
限制
技能要求不迁移框架或样式库，不破坏现有功能，每次更改后测试。若项目使用Tailwind，需先检查版本（v3 vs v4）。若项目无框架，使用原生CSS。更改应保持可审查和聚焦。