SuperAPI AI 工具集

high-end-visual-design

设计与创作

查看项目

更新于 10-16 09:28

技能介绍

用途:让 AI 以高端设计机构的水准生成 UI,强调触感深度、空间节奏与流畅动效,输出被定位为 Agency 级数字体验。

主要能力:

  1. 反模式约束:禁用 Inter、Roboto、Arial 等常见字体,禁用粗线条图标(如 Lucide、FontAwesome、Material),禁用普通 1px 灰边框与生硬深色阴影,禁用贴顶粘性导航、对称三栏网格、线性或 ease-in-out 过渡等。
  2. 随机组合引擎:从质感模板(Ethereal Glass、Editorial Luxury、Soft Structuralism)与布局模板(非对称 Bento、Z 轴层叠、编辑式分栏)中各选一种,保证每次输出不同但统一高级。
  3. 组件规范:卡片采用 Double-Bezel 嵌套结构(外层壳 + 内层芯);按钮为全圆角胶囊,箭头嵌入独立圆形包裹实现 button-in-button;区块间距放大(py-24 至 py-40),标题前加极小 pill 标签。
  4. 动效编排:使用自定义 cubic-bezier 曲线,汉堡菜单形变为 X,菜单全屏玻璃遮罩展开,链接交错上滑;按钮有按压缩放与内部图标位移;滚动进入用背景模糊 + 上移淡入。
  5. 性能护栏:只动画 transform 与 opacity,backdrop-blur 仅用于固定/粘性元素,噪点遮罩只挂 fixed 伪元素,限定 z-index 用途。

使用方式:作为 Agent Skill 加载后,在提示中要求生成 React/Tailwind/HTML 界面;技能会按内部协议先静默选择模板,再搭建背景、排版、双层卡片与动效,最后按检查清单自检。

适用与限制:适用追求高端视觉的营销页、作品集、SaaS 落地页;移动端强制在 768px 以下坍缩为单列布局,全高区域用 min-h-[100dvh]。技能假定可用 Geist、Clash Display 等高级字体与前卫图标库,具体依赖、收费与平台支持暂未提供。