SuperAPI AI 工具集

redesign-existing-projects

设计与创作

查看项目

更新于 10-16 02:34

技能介绍

用途:把已有网站或应用升级到更高设计水准。流程为扫描代码库(识别框架、样式方案与现有设计模式)、诊断(列出通用 AI 风格、薄弱点与缺失状态)、修复(在现有技术栈上做针对性改进,不从头重写)。

主要能力:覆盖排版(替换默认字体、调整标题字重与字距、限制正文宽度、使用等宽数字)、色彩与表面(避免纯黑背景与过饱和强调色、统一灰色系、避免紫蓝 AI 渐变、给阴影着色、加入噪点纹理)、布局(打破对称、避免三等分卡片、用 min-height: 100dvh、CSS Grid、max-width 容器、变化圆角、对齐卡片按钮与特性列表)、交互状态(悬停、按下、过渡、焦点环、骨架屏、空状态、错误状态、当前页导航、scroll-behavior: smooth、用 transform/opacity 做动画)、内容(真实姓名与数据、避免 AI 文案套话)、组件模式、图标与代码质量(语义化 HTML、相对单位、alt 文本、z-index 规范、meta 标签),以及法律链接、返回导航、404 页、表单校验、跳转内容链接等常被遗漏项。

升级技巧:可变字体动画、描边填充、文字遮罩、破格网格、视差卡片堆叠、分屏滚动、惯性平滑滚动、错峰入场、弹簧物理、滚动驱动揭示、真实玻璃拟态、光标聚光边框、噪点叠加、着色阴影。

修复优先级:换字体、清理配色、补悬停与按下状态、布局与间距、替换通用组件、补加载/空/错误状态、最后打磨排版与间距。

限制与规则:必须沿用现有技术栈,不迁移框架或样式库;不破坏现有功能,每次改动后测试;引入新库前先查依赖文件;使用 Tailwind 时先确认 v3 或 v4;无框架则用原生 CSS;改动保持小而聚焦、便于审查。资料未提供具体收费、平台与效果数据。