报告叙事 (Report Storytelling Narrative)
更像研究专题、年度报告、影响力报告和结论驱动长文的页面家族,用章节、图表、证据模块和滚动节奏把故事讲清楚。
年度报告研究专题影响力报告
真实网站参考 / Real References
先看这些真实网站 / Open these real sites first
长这样 / Looks Like
- 结论先行
- 图表与章节并进
- 滚动叙事
- 证据模块化
适合做 / Good For
- 年度报告
- 研究专题
- 影响力报告
不适合做 / Not For
- 模板市场
- 轻量个人站
- 沉浸发布页
Skill 包含什么 / What The Skill Controls
截图、排版和规则来自同一套风格包 / The screenshots, layout, and rules come from the same skill packet
配色系统 / Color System
- 中性底色优先
- 颜色用于章节和数据强调
- 不要用情绪色覆盖证据本身
排版系统 / Typography
- 标题像章节而不是广告口号
- 正文、注释和图表说明必须同时清楚
- 数据标签要单独设计层级
版式规则 / Layout Rules
- 先结论再证据
- 章节滚动要有叙事推进
- 图表、引文和案例要作为证据块穿插出现
图片处理 / Image Treatment
- 图表和截图都要承担说明责任
- 少用无关氛围图
- 每张图都要服务论点或转场
交互节奏 / Motion
- 动效可以帮助章节进入
- 但不能抢走阅读注意力
- 滚动节奏比 hover 更重要
AI Prompt / AI Prompt
复制后直接粘贴给 Cursor / Claude / Paste directly into Cursor / Claude
请参考报告叙事(Report Storytelling Narrative)风格建站:
视觉特征:结论先行 / 图表与章节并进 / 滚动叙事 / 证据模块化
适合场景:年度报告 / 研究专题 / 影响力报告
不适合:模板市场 / 轻量个人站 / 沉浸发布页
推荐页面组织:专题长文型 / Dossier / Feature / 档案堆栈型 / Archive Stack
历史来源:新字体排印 / New Typography / 瑞士风格 / Swiss Style / 包豪斯 / Bauhaus
参考网站:People + AI Guidebook: https://pair.withgoogle.com/guidebook-v2/ / Our World in Data: https://ourworldindata.org/ / Carbon for AI: https://carbondesignsystem.com/guidelines/carbon-for-ai/
配色系统:中性底色优先 / 颜色用于章节和数据强调 / 不要用情绪色覆盖证据本身
排版系统:标题像章节而不是广告口号 / 正文、注释和图表说明必须同时清楚 / 数据标签要单独设计层级
版式规则:先结论再证据 / 章节滚动要有叙事推进 / 图表、引文和案例要作为证据块穿插出现
图片处理:图表和截图都要承担说明责任 / 少用无关氛围图 / 每张图都要服务论点或转场
风格要求:Use a report storytelling family: lead with the conclusion, pace the page in chapters, integrate charts or screenshots as evidence, and keep the reading flow strong enough for a long-form report rather than a reference index.
历史来源 / Historical Roots
这部分放在最后看,用来补背景,而不是先决定风格。 / Use this section to add background after the direction is already clear.
1920s-1930s
新字体排印 (New Typography)
以非对称排版、空白场和摄影/版面组织信息清晰度。
1950s-1970s
瑞士风格 (Swiss Style)
网格、对齐、无衬线、秩序感。它是今天大量知识型、设计型、档案型网页的基础语法之一。
1919-1933
包豪斯 (Bauhaus)
功能、工业和几何秩序优先。它把形式服从用途这件事系统化。