关于这个模板
Innovation 收录于 447x800，保留的是一份规格书，而不是一张画廊图片。配色控制在深蓝色 #020D14 打底之内，字体用 Instrument Serif。交付形式是 React 和 Tailwind CSS，收录于 447x800，所以画幅在任何一行代码写下去之前就已经定好。动效归结起来就是500ms 的过渡。把它当作面向创意机构或工作室做落地页的需求简报：它要经得起复刻，而不只是第一眼好看。下面引用的每一项都是那份简报里的数值，从 447x800 的画幅一直到最小的间距档。收录的提示词记录于 447x800，所以这一页引用的每个数值都能追回到它。
适合谁
- 用提示词给落地页提需求的人，会把这份 8,996 字符的提示词当作起点。
- 给要改写一版落地页、标题长度又得和Innovation一样的内容负责人用。
- 如果你要用自己的字体重画Innovation的落地页，就保住 Instrument Serif 的比例，否则字号档位会对不上。
包含哪些内容
- 导航收在一行. 一短行链接加一个操作压在落地页上，尺寸按 20px 间距、500ms 的过渡控住，导航条因此永远不会跟它背后的构图抢。导航条悬在 447x800 的构图上，自己没有底色，素材因此从它下面通到两边。
- 样式交给字体. 这里字体就是那套样式系统：Instrument Serif 撑展示字号，整个界面共用同一套字，不需要第二个强调色来帮忙。只要字号和字重留在需求简报放的位置，换字体就是安全的。
- 间距档位是写明的. 尺寸是对着 447x800 的渲染量出来的：20px 间距、500ms 的过渡。数值是从收录的提示词里抄下来的，不是反推的，重渲染也不会丢。
- 公告胶囊. 一枚徽标只说一件事：胶囊用 Instrument Serif 的最小字阶待在标题上方，没有别的元素来争这个位置。它的位置让标题继续占住构图的正中。
动效与交互
状态变化也有时长
控件里的动效短且可重复：每次状态变化都是 500ms。写明的时长只覆盖状态变化，反馈正是这套动效里被规格管住的部分。状态变化要快，不要滚动时间轴。
悬停只给该有反馈的地方
反馈只落在悬停态只给按钮和链接，而不是每张卡片上，这才让信息密集的首屏不显得拥挤。页面不会弹出模态框，也不劫持滚动；交互始终限制在元素本身。在触屏设备上把这些状态过一遍。这份参考在 447x800 下收录。
Innovation 怎么安排第一次阅读的顺序
认定一条阅读路径，就意味着别的路径被关掉了。需求简报接受这一点，把导航、标题、公告徽标、数据行、卡片栅格固定在原处，并把20px 间距、500ms 的过渡花在让这条路径显眼上。创意机构读者先看到主张，再看到选项。
这套构图为什么适合创意机构
克制让你在折叠线以上失去了放证据的空间。这份简报接受这个代价，把首屏全部花在主张上，并固定住20px 间距、500ms 的过渡，这样以后在下面加一个证据板块也不用返工。它给创意机构读者的是一条通向主张的最短诚实路径。
这个落地页背后的时序
模板会让每个板块入场都动一遍，这一版只动500ms 的过渡、悬停态与按下态，然后收住。这个落地页里没有为动而动的动画。
常见问题
Innovation 背后那份需求简报里到底有什么？
简报是从页面上收录下来的，共 8,996 个字符，覆盖画幅、字阶、色板和过渡。复制拿到的就是这段文本，发给 Studio 则会用同一份描述把请求预先填好。
为什么这条条目还要标注 React 和 Tailwind CSS？
Innovation 是用 React 和 Tailwind CSS 构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
在客户项目里该怎么处理 Innovation 的素材？
简报是描述，不是转授权别人素材的许可。结构和数值可以留下，素材和品牌标识要换成你自己的；客户问起版式出处时，说明来源即可。这份参考在 447x800 下收录。
