关于这个模板
Signal ID 留住了自己的决策链:生成这个落地页的需求简报有 11,588 个字符。“YOUR VOICE ID TO THE E NETWORK” 就是整套版式要承载的那一行。整套配色是深蓝色 #000003 打底、#FFFFFF 给文字,页面字体是 Sora。交付形式是 React 和 Tailwind CSS,收录于 1686x1080,所以画幅在任何一行代码写下去之前就已经定好。动效归结起来就是70ms 的过渡、cubic-bezier(0.16, 1, 0.3, 1)、一段循环视频打底。写作时让它开着:能迁移到你页面上的,是那份 11,588 字符的简报。收录的提示词记录于 1686x1080,所以这一页引用的每个数值都能追回到它。下面引用的每一项都是那份简报里的数值,从 1686x1080 的画幅一直到最小的间距档。
适合谁
- 在这版落地页上继续加块的内部小组,需要把 100vh 高的板块、20px 间距原样带进新块里。
- 这一版落地页服务的是需要一屏证据、证明SaaS的文案能扛住 7s 的循环视频的创始人。
- 给要改写一版落地页、标题长度又得和Signal ID一样的内容负责人用。
包含哪些内容
- 一条会主动让开的导航. 导航只有一行,下面没有二级。到了平板断点以下,改由移动端浮层接管。导航条悬在 1686x1080 的构图上,自己没有底色,素材因此从它下面通到两边。
- 尺寸钉在需求简报里. 版式走的是绝对值,不是比例:100vh 高的板块、20px 间距、70ms 的过渡、cubic-bezier(0.16, 1, 0.3, 1) 缓动曲线。清单短到审核的人能一个元素一个元素地核。
- 样式交给字体. 由 Sora 一个字体挑大梁:从标题到支撑句字号断得很干脆,字号越大字距收得越紧,层级因此由字体承担,而不是靠颜色。展示字体只用一个字号,不会自己跟自己抢。
- 导航条上不留多余. 导航只有一行,下面没有二级。到了平板断点以下,改由移动端浮层接管。导航条悬在 1686x1080 的构图上,自己没有底色,素材因此从它下面通到两边。这条导航只有几个元素,不用组件库也能重建。
动效与交互
文字分片到达
遮罩式逐行揭示是页面上唯一的入场,需要维护的动态只有这一套。它只是几个过渡,而不是一整个动画库,所以迁移成本很低。这份参考在 1686x1080 下收录。
悬停只给该有反馈的地方
反馈只落在悬停态只给按钮和链接,而不是每张卡片上,这才让信息密集的首屏不显得拥挤。每个状态只改一个属性,反馈因此保持清楚。状态宁少,但要写全。这份参考在 1686x1080 下收录。
在 Signal ID 里先改什么
可复用的是构图,题材归你。保住100vh 高的板块、20px 间距,把文字、素材和品牌标识换掉。别动的是画幅和字阶。
把 Signal ID 当规格书读
把它和一个把间距称作“偏好”的模板比:这里同样的值是写明的(100vh 高的板块、20px 间距、70ms 的过渡、cubic-bezier(0.16, 1, 0.3, 1) 缓动曲线),所以一次修改要么保住它们,要么明显破坏构图。这个落地页里没有任何一处依赖默认值。
Signal ID 里什么在动
抄的是模式,不是数值:保住70ms 的过渡、7s 的循环视频、遮罩式逐行揭示,时长交给你自己的品牌定。这个落地页里没有为动而动的动画。
常见问题
Signal ID 的提示词是定稿规格,还是只是一个起点?
它是构建简报,不是感觉描述:写明 1686x1080 的构图、间距和动效数值。全文没有一处把渲染画面当作事实依据。
Signal ID 有多少地方依赖 React 和 Tailwind CSS?
Signal ID 是用 React 和 Tailwind CSS 构建的,条目标注只是说明出处。简报写的是位置、尺寸和时长,所以任何能设字体、能摆元素的前端框架都能重建。
Signal ID 能用在客户项目里吗?
简报是描述,不是转授权别人素材的许可。结构和数值可以留下,素材和品牌标识要换成你自己的;客户问起版式出处时,说明来源即可。这份参考在 1686x1080 下收录。





