关于这个模板
AI Designer Portfolio 留住了自己的决策链：生成这个首屏的需求简报有 11,458 个字符。配色控制在白色 #F6FCFF 打底、深青绿色 #051A24 给文字之内，字体用 Neue Montreal。交付形式是 React 和 Tailwind CSS，收录于 604x476，所以画幅在任何一行代码写下去之前就已经定好。动效预算就是0.1s 的过渡、cubic-bezier(0.4, 0, 0.2, 1)、一段循环视频打底。写作时让它开着：能迁移到你页面上的，是那份 11,458 字符的简报。下面引用的每一项都是那份简报里的数值，从 604x476 的画幅一直到最小的间距档。收录的提示词记录于 604x476，所以这一页引用的每个数值都能追回到它。
适合谁
- 给按轮次结算、想在第一次修改前就谈定字号从 22px 到 80px、40px 间距的代理公司用。
- 产品市场的人需要首屏在背后有17.2s 的循环视频时依然好读。
- 给要改写一版首屏、标题长度又得和AI Designer Portfolio一样的内容负责人用。
包含哪些内容
- 顶栏只放一个操作. 字标占住左边缘，链接从它右边排开，全部用 Neue Montreal 排，所以这条导航条属于下面的页面，而不是另一套系统。导航条悬在 604x476 的构图上，自己没有底色，素材因此从它下面通到两边。
- 数值一路带进构建. 需求简报里的每个尺寸都是能反测量回去的数值：字号从 22px 到 80px、40px 间距、0.1s 的过渡、cubic-bezier(0.4, 0, 0.2, 1) 缓动曲线。清单短到审核的人能一个元素一个元素地核。
- 导航是刻意做细的. 字标占住左边缘，链接从它右边排开，全部用 Neue Montreal 排，所以这条导航条属于下面的页面，而不是另一套系统。导航条悬在 604x476 的构图上，自己没有底色，素材因此从它下面通到两边。字标占的位置不超过它那行字需要的宽度。
- 一个素材元素承担整体情绪. 片段在 604x476 下循环 17.2s，接缝看不出来，所以它读起来是肌理，而不是一条片子。循环短到 17.2s，眼睛会把它读成肌理，而不是一条时间轴。按 604x476 或更宽的尺寸导出，裁切才不失真。
动效与交互
悬停只给该有反馈的地方
指针上的处理很少，而且写明了：悬停态只给按钮和链接，而不是每张卡片、按需翻页浏览内容的滑块组件，只加在那些看起来就能点的元素上。状态在需求简报里就写明了，页面不依赖任何悬停特效库。在触屏设备上把这些状态过一遍。这份参考在 604x476 下收录。
标题自己拼装完成
整套动作就是滚动触发揭示：页面上没有别的元素跟着一起表演。结束时的状态就是一张静帧该有的构图，所以没有东西依赖动画跑完。这份参考在 604x476 下收录。
这个首屏背后的时序
这里的动效是一组决定，而不是一个库：0.1s 的过渡、17.2s 的循环视频、滚动揭示，而且没有任何东西跟着滚动播放。结果是一个像被设计过的页面：时长短、只有一次入场，状态变化用来确认操作，而不是装饰。这个首屏里没有为动而动的动画。
这套构图为什么适合创意机构
当你给一个创意机构首屏写需求时，最难的是决定首屏拒绝说什么。 AI Designer Portfolio 提前回答了这件事：一行展示字，后面跟着导航、标题、公告徽标、数据行、卡片栅格。 AI Designer Portfolio 只把主张说一次，然后让构图去重复它，而不是再加第二个主张。这份参考在 604x476 下收录。
这个首屏背后的数字
情绪板会把尺度留开，这份需求简报把它收死：字号从 22px 到 80px、40px 间距，周围的值都由这个决定推出来。这个首屏里没有任何一处依赖默认值。
常见问题
复制 AI Designer Portfolio 的需求简报，我能拿到什么？
它是构建简报，不是感觉描述：写明 604x476 的构图、间距和动效数值。全文没有一处把渲染画面当作事实依据。
为什么这条条目还要标注 React 和 Tailwind CSS？
AI Designer Portfolio 是用 React 和 Tailwind CSS 构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
AI Designer Portfolio 的设计是从哪来的？
简报是描述，不是转授权别人素材的许可。结构和数值可以留下，素材和品牌标识要换成你自己的；客户问起版式出处时，说明来源即可。这份参考在 604x476 下收录。
