86 lines
4.4 KiB
Markdown
86 lines
4.4 KiB
Markdown
|
# DESIGN.md · 长沙市紧缺急需人才申报答辩
|
|||
|
|
|
|||
|
|
> 风格分支：红金政务风（完全命中：政务/人才考察评审场景）。画布 1280×720。
|
|||
|
|
|
|||
|
|
## 1. 风格 DNA
|
|||
|
|
|
|||
|
|
- 庄重红金：主红 + 金色点缀 + 白底内页；美术层（封面/章节扉页/结束页）红金热烈，内容页稳定白底。
|
|||
|
|
- 中文优先：正文、图说、标签、致谢全中文；仅允许 PART / 序号等结构性英文。
|
|||
|
|
- 密度优先：内容页信息充足，卡片填充率高；留白 ≤ 35%。
|
|||
|
|
- 零旋转：所有卡片、文字、装饰 0°，仅 SVG 图表内部几何线例外。
|
|||
|
|
- 禁廉价符号：禁印章/钤印、红绸铺满、整屏暗蒙版、局部矩形色块压图。
|
|||
|
|
|
|||
|
|
## 2. 母版骨架（内容页通用）
|
|||
|
|
|
|||
|
|
| 区域 | 垂直位置 | 规则 |
|
|||
|
|
|---|---|---|
|
|||
|
|
| A 留白区 | y 0–48 | 完全留白 |
|
|||
|
|
| B 标题块 | y 48–110 | 中文主标 34–36px 宋体 Heavy 黑字；左侧红短竖条装饰 |
|
|||
|
|
| C 内容区 | y 110–660 | 正文/图表/卡片 |
|
|||
|
|
| D 页脚装饰条 | y 660–700 | 底部红橙三段条（#C42819 53% + #EE5530 26% + #F26B40 21%），右叠页码 |
|
|||
|
|
|
|||
|
|
左右 padding 70。封面/目录/章节扉页/结束页可省略 A/D 区自定版式。
|
|||
|
|
|
|||
|
|
## 3. 色彩系统
|
|||
|
|
|
|||
|
|
| 角色 | hex | 用途 |
|
|||
|
|
|---|---|---|
|
|||
|
|
| 主红 | #C42819 | 内容页强调、卡头、装饰条 |
|
|||
|
|
| 高光红 | #EE5530 | 渐变中段、强调 |
|
|||
|
|
| 粉红橙 | #F26B40 | D 区渐变末端 |
|
|||
|
|
| 主金 | #E19825 | 飘带、编号、重点 |
|
|||
|
|
| 浅金 | #FFE79B | 高光、粒子 |
|
|||
|
|
| 文本 | #171616 | 正文主字 |
|
|||
|
|
| 中性灰 | #9CA3AF / #E5E7EB | 分隔线、脚注 |
|
|||
|
|
| 白底 | #FFFFFF | 内页背景 |
|
|||
|
|
|
|||
|
|
- 美术层（封面/扉页/结束）：主红 ≥50%，金 15–30%。
|
|||
|
|
- 内页：白底 ≥60%，红 8–20%，金 ≤5%。
|
|||
|
|
- 强调色只落在焦点元素（巨型数字、核心卡头）上。
|
|||
|
|
|
|||
|
|
## 4. 字体系统
|
|||
|
|
|
|||
|
|
| 用途 | 字体 | 字号 |
|
|||
|
|
|---|---|---|
|
|||
|
|
| 封面主标 | 宋体（SimSun）Bold | 150–200 交错 |
|
|||
|
|
| 章节 PART 巨字 | 宋体 Bold | 180–240 |
|
|||
|
|
| 章节中文标题 | 宋体 Bold | 52 |
|
|||
|
|
| 内页 B 区主标 | 宋体 Bold | 34 |
|
|||
|
|
| 卡片小标 | 微软雅黑 Bold | 24 |
|
|||
|
|
| 正文 | 微软雅黑 Regular | 20–22 |
|
|||
|
|
| 巨型 KPI 数字 | 微软雅黑 Bold | 64–96 |
|
|||
|
|
| 页码/注释 | 微软雅黑 | 14 |
|
|||
|
|
|
|||
|
|
- 内页字体 ≤2 套（宋体标题 + 微软雅黑正文）；正文禁宋体大段；主标禁黑体。
|
|||
|
|
|
|||
|
|
## 5. 页面映射表（契约）
|
|||
|
|
|
|||
|
|
| # | 类型 | 角色 | 版式 | L1 视觉 | 色彩分配 | 关键约束 |
|
|||
|
|
|---|---|---|---|---|---|---|
|
|||
|
|
| 01 | cover | hero | 全屏红金+居中大字 | 红金渐变+金色粒子 | 主红60%+金25% | 金字主标+飘带副标+胶囊 |
|
|||
|
|
| 02 | catalog | supporting | 左标题+右内容 | 红胶囊编号 | 白底70%+红20% | 圆球编号单列3条 |
|
|||
|
|
| 03 | section | transition | 白底左右分屏PART | sec_personal.png 右50% | 白底55%+红30% | 左PART巨字右摄影 |
|
|||
|
|
| 04 | content | supporting | 左标题+右内容 | 时间轴SVG | 白底70%+红15% | 左窄色块栏 |
|
|||
|
|
| 05 | section | transition | 白底左右分屏PART | sec_achieve.png 右50% | 白底55%+红30% | 同03 |
|
|||
|
|
| 06 | content | hero | 非对称双栏 | 项目名称+指标数据卡 | 白底60%+红25% | 重大项目一·激光增材 |
|
|||
|
|
| 07 | content | supporting | 上项目名+下三卡 | 三列意义卡 | 白底70%+红15% | 重大项目二·PCB除阻焊 |
|
|||
|
|
| 08 | content | supporting | 上专利+下成果清单 | 专利卡+成果列表 | 白底70%+红15% | 发明专利·核心成果 |
|
|||
|
|
| 09 | content | supporting | 三卡横排 | 红头白卡 | 白底70%+红15% | 成果转化·团队·平台 |
|
|||
|
|
| 10 | section | transition | 白底左右分屏PART | sec_future.png 右50% | 白底55%+红30% | 同03 |
|
|||
|
|
| 11 | content | supporting | 左标题+右内容 | 时间轴SVG | 白底70%+红15% | 三年阶段轴 |
|
|||
|
|
| 12 | ending | hero | 全屏红金+居中金句 | 红金渐变+金色粒子 | 主红60%+金25% | 收束金句+落款 |
|
|||
|
|
|
|||
|
|
## 6. 配图清单
|
|||
|
|
|
|||
|
|
| 文件 | 生成方式 | 内容 | 使用页 |
|
|||
|
|
|---|---|---|---|
|
|||
|
|
| sec_personal.png | ImageGen | 激光控制电路板/芯片特写，科技红金氛围 | 03 |
|
|||
|
|
| sec_achieve.png | ImageGen | 激光精密打标/金属加工场景 | 05 |
|
|||
|
|
| sec_future.png | ImageGen | 智能制造自动化生产线场景 | 10 |
|
|||
|
|
|
|||
|
|
其余视觉（时间轴、卡片、大数字、粒子）均用 SVG / Box+Text 实现。
|
|||
|
|
|
|||
|
|
## 7. 配图风格词（全篇统一）
|
|||
|
|
|
|||
|
|
industrial photography, laser manufacturing, professional, warm red-gold tone, shallow depth of field, no text, no watermark, 16:9 landscape
|