SuperAPI AI 工具集

coollanding

设计与创作

查看项目

更新于 10-16 09:13

技能介绍

CoolLanding 是一个面向品牌落地页的 AI 技能,覆盖创作、重设计、打磨、审计与优化等任务。它的核心前提是:不定义单一固定外观,而是防止目录顺序或过往演示成为默认风格。

用途 该技能用于为特定品牌构建具有辨识度的落地页。它要求代理先诊断品牌、受众与情感目标,再选择风格世界并组合机制,最终输出“只有该品牌才能发布”的页面,而非千篇一律的模板。当请求针对已有页面时,进入重设计模式:先检查当前路由与用户可见契约,除非被要求更改,否则保留实质内容与品牌事实,并把每个报告的缺陷(如对比度冲突、无法解释的几何形状、卡顿滚动、资产轮廓薄弱)转化为验收检查。

主要能力

  • 风格世界选择:从 references/style-worlds.md 的 9 个风格世界中,依据诊断简报通过 scripts/select_world.py 选择一个主导风格。
  • 技法包:可选从 references/motion-lab.md §13 附加一个技法包(living archive、elastic media、physical playground、data monument、visual instrument、rule decomposition 或 retro signal)。
  • 机制组合:从 references/mechanics-library.md 选择 2–4 个契合该世界的机制,其中一个必须是承载首屏的主机制。
  • 标志性机制:发明一个其他参考都没有的独有机制,用一句话描述后再实现。
  • 参考站点证据采集:使用 scripts/site_motion_probe.py 记录响应哈希、技术签名、着色器 uniform 名称、运行时库/画布事实、DOM/CSS 信号及截图,不存储源码正文。
  • 资产生成与隔离:通过 $imagegen 技能生成 1–3 个有明确用途的资产;使用色度键背景生成透明资产,并用 scripts/preview_cutouts.py 在深色/奶油色/牛皮纸背景上审查。
  • WebGL/3D/粒子首屏:参考 references/webgl-animation.md 的 GPU 粒子 + bloom + 平滑滚动配方。
  • 动效一致性:当用户要求参考级对等或“尽可能接近”的动画时,参考 references/kinetic-parity.md 的入场 + 指针 + 滚动 + 本地状态 + 渲染器证明阶梯。

使用方式 工作流包括:1) 扎根简报,阅读本地仓库说明、AGENTS.md、README.md 等,检查当前技术栈与 UI 模式;1.5) 在设计前采集参考网站证据;2) 诊断品牌,回答产品类别、品牌原型、受众温度、情感目标、一句话承诺、性能上限、参考氛围、技法包等问题;2.5) 从证据中选择风格世界,运行 select_world.py 并保留 JSON 排名;3) 每个范围只选一个风格世界;4) 组合 2–4 个机制;5) 发明一个标志性机制;6) 生成或创建资产;7) 将首屏构建为体验本身;8) 实现动效系统。

适用场景 适用于需要高辨识度、参考级动效的品牌落地页项目,包括实体产品、SaaS、活动、作品集、房地产、代理机构、服务、宣言等类别。也适用于已有页面的重设计与审计。

限制 该技能不定义单一固定风格;不得因某风格列在首位、演示中使用过或渲染最简单而选择它。空白或无信号简报必须停止并请求澄清。不得将参考站点源码引入目标项目或本技能。实现目标是 90% 感知效果对等,而非代码对等。若图像生成端点或技能不可用,应明确说明,不得静默切换模型或调用 CLI。避免使用外部图库,除非用户明确允许。优先 1–3 个强资产而非大量弱装饰。