关于这个模板

把 Scene AI 当作首屏规格书来读:这些数值在页面动手之前就先写下来了。“Create awesome 3D scenes with AI” 就是整套版式要承载的那一行。配色是黑色 #000000 打底、白色 #EBEAD0 给文字,字体用 Inter。实现用的是 Tailwind CSS;里面的每个尺寸都写了下来,这正是它可复用的原因。动作被收进一段循环视频打底里。借结构,不借题材:这个首屏和它那组数字可以原样搬到你的品牌上。收录的提示词记录于 2056x1476,所以这一页引用的每个数值都能追回到它。下面引用的每一项都是那份简报里的数值,从 2056x1476 的画幅一直到最小的间距档。

适合谁

  • 这一版首屏服务的是需要一屏证据、证明SaaS的文案能扛住 8s 的循环视频的创始人。
  • 给要改写一版首屏、标题长度又得和Scene AI一样的内容负责人用。
  • 用提示词给首屏提需求的人,会把这份 2,425 字符的提示词当作起点。

包含哪些内容

  • 链接在前,操作在后. 字标占住左边缘,链接从它右边排开,全部用 Inter 排,所以这条导航条属于下面的页面,而不是另一套系统。导航条悬在 2056x1476 的构图上,自己没有底色,素材因此从它下面通到两边。
  • 链接只在一个断点收起. 字标占住左边缘,链接从它右边排开,全部用 Inter 排,所以这条导航条属于下面的页面,而不是另一套系统。导航条悬在 2056x1476 的构图上,自己没有底色,素材因此从它下面通到两边。加底色之前,先把自己的素材垫在导航条下面测一遍。
  • 封面帧也算数. 一个 8s 的素材撑起整个首屏,页面上没有第二个素材元素要对齐。循环短到 8s,眼睛会把它读成肌理,而不是一条时间轴。按 2056x1476 或更宽的尺寸导出,裁切才不失真。
  • 字阶就是样式系统. 由 Inter 一个字体挑大梁:从标题到支撑句字号断得很干脆,字号越大字距收得越紧,层级因此由字体承担,而不是靠颜色。字体和固定字号配对使用,展示行和界面文字因此始终是一家人。

动效与交互

悬停只给该有反馈的地方

只有控件响应指针(悬停态只给按钮和链接,而不是每张卡片),页面因此有反馈感,又没把每个元素都变成点击目标。交互状态不会推动版式,指针底下不会有东西跳。这份参考在 2056x1476 下收录。

是循环,不是时间轴

环境动感来自 2056x1476 的 8s 循环,而不是滚动特效,页面因此保持平静,文字也更好读。片段短到能循环而不露接缝,这比它的分辨率更重要。

在 Scene AI 里先改什么

需求简报写明了 Inter 和它旁边的字阶。换成比例相同的字体,构图就能活下来。你的强调色要过和参考强调色同样的对比度测试。

把 Scene AI 当规格书读

情绪板会把尺度留开,这份需求简报把它收死:2056x1476 画幅,周围的值都由这个决定推出来。这个首屏里没有任何一处依赖默认值。

对AI 与 SaaS来说成立的地方

Scene AI 成立,是因为它的层级是被决定出来的,而不是装饰出来的。需求简报定下了2056x1476 画幅,所以新文案是落进画幅里,而不是把画幅重新打开。 Scene AI 只把主张说一次,然后让构图去重复它,而不是再加第二个主张。

常见问题

Scene AI 背后的提示词到底有多长?

简报是从页面上收录下来的,共 2,425 个字符,覆盖画幅、字阶、色板和过渡。复制拿到的就是这段文本,发给 Studio 则会用同一份描述把请求预先填好。

能用别的技术栈重建 Scene AI 的首屏吗?

这份参考恰好是用 Tailwind CSS 构建的,但版式里没有一处依赖这个选择:间距、字体和动效数值换到你正在用的工具里照样成立。

用 Scene AI 重建的页面,可以不署名就上线吗?

简报是描述,不是转授权别人素材的许可。结构和数值可以留下,素材和品牌标识要换成你自己的;客户问起版式出处时,说明来源即可。这份参考在 2056x1476 下收录。

在 Studio 里复刻

先拿参考,再到 Studio 里替换内容与视觉细节。