30 分钟用 Cursor 交付一个动画 SaaS 落地页
从选模板、改写 AI Prompt，到 Cursor 生成可上线的动画落地页的完整流程——不需要懂任何动画库，照做就能出成品。
约 8 分钟
为什么 AI 写出来的网站总显得“平”
让任何编程助手写一个落地页，结果都差不多：布局干净、系统字体、没有任何动效——像一张线框图穿了件外衣。缺的不是设计能力，而是一段把动效描述到模型能直接实现的程度的文字。
这正是每条资源附带 Prompt 的价值：它已经经历过“描述—生成—与原版对比—修正细节”的完整循环。
第一步：先选结构，不选颜色
在模板库里按结构筛选：有哪些板块、Hero 怎么动、滚动行为是什么。颜色和文案随时可换，结构返工才是最贵的。
✦Aurora — 漂浮光斑 SaaS 落地页完整的 Hero/定价/页脚叙事 + 漂浮渐变光斑——从空仓库到动画落地页的最短路径。第二步：把 Prompt 改成你的产品
打开详情页复制 AI Prompt，粘贴进 Cursor 前只改三处：产品一句话介绍（替换占位文案）、希望访客执行的主动作、品牌主色。动效描述部分一个字都别动——那是调过的。
Prompt 是关于行为的契约，不是设计稿。改名词，保留动词。
第三步：生成，再换入真组件
Cursor 很快会产出一个单文件页面。别在生成结果上反复磨——直接从组件库拿成品交互件，替换掉占位的地方。
✦Spotlight Glow Card（光标追光卡片）全站被复制最多的组件——定价/特性卡片，带跟随光标的聚光效果。✦Circular 3D Gallery Ring（环形 3D 画廊）截图或 Logo 在 3D 环上公转——替代无聊的静态 Logo 墙。第四步：10 分钟检查清单
- 尊重 reduced-motion：所有动画包在 prefers-reduced-motion 媒体查询里（资源库的素材已经这么做了）。
- 检查移动端：视差和 3D 环是小屏幕上最先崩的。
- 跑一次 Lighthouse——动画站点常因主线程占用丢分；资源库素材只用 transform/opacity，一般能过。
- 分享链接前先接好统计，别等上线后才想起。
整个流程就是这样：三十分钟、一条模板 Prompt、两个组件，成品看起来像设计师花了一周的产物。