← 设计系统总览
CASE 08 / DESIGN ANATOMY PDF P.14

FOREVER · 紫色引力

以同构人物卡构建组合识别

4 个作品 / 画面单元9 个解析章节SSR 视觉创作
01

原作与阅读方式

基于所提供 PDF 的视觉解析。原作画面为事实依据;风格关联属于分析,不代表创作者自述。色值为参考或量化近似;网格、字号、间距与图层顺序是便于复用的建议,非原稿参数。未提供源文件,不能恢复独立素材图层或确认字体名称。

02

逐张拆到基础元素

同一套视觉,也保留每张作品自己的结构与取舍。

PDF P.14 · 画面 01

ELEMENT STUDY / 01

LINA 成员卡

柔焦数字编辑
排版与视线
人物正面姿态稳定,长发形成纵向轮廓。圆角底板、姓名、简介位置与其他成员统一。
颜色关系
浅紫底、深紫或白色姓名,黑色服装保持主体对比。
字体层级
成员名使用相近尺度衬线,短介绍为规整小字。
基本图形与材质
圆角板、透明泡状轮廓、柔光渐变。
#E3E5FE
#9F93D2
#625495

局部图像量化取色,包含人物、背景与压缩误差。

复用要点

保持照片变量,固定卡片宽度、姓名位置与上下留白。

PDF P.14 · 画面 02

ELEMENT STUDY / 02

SUMI 成员卡

柔焦数字编辑
排版与视线
短发和抬手姿态扩大横向轮廓,右侧需要留白。圆角底板、姓名、简介位置与其他成员统一。
颜色关系
浅紫底、深紫或白色姓名,黑色服装保持主体对比。
字体层级
成员名使用相近尺度衬线,短介绍为规整小字。
基本图形与材质
圆角板、透明泡状轮廓、柔光渐变。
#E3E5FE
#2A2145
#A48BC6
#BDB5EC

局部图像量化取色,包含人物、背景与压缩误差。

复用要点

保持照片变量,固定卡片宽度、姓名位置与上下留白。

PDF P.14 · 画面 03

ELEMENT STUDY / 03

SOY 成员卡

柔焦数字编辑
排版与视线
低头姿态使注意力转向手部,标题仍保持底部位置。圆角底板、姓名、简介位置与其他成员统一。
颜色关系
浅紫底、深紫或白色姓名,黑色服装保持主体对比。
字体层级
成员名使用相近尺度衬线,短介绍为规整小字。
基本图形与材质
圆角板、透明泡状轮廓、柔光渐变。
#E3E5FE
#1E1B29
#806BAB
#AEA5E0

局部图像量化取色,包含人物、背景与压缩误差。

复用要点

保持照片变量,固定卡片宽度、姓名位置与上下留白。

PDF P.14 · 画面 04

ELEMENT STUDY / 04

YAYA 成员卡

柔焦数字编辑
排版与视线
双臂交叉构成横向线条,卡片两侧保留平衡边距。圆角底板、姓名、简介位置与其他成员统一。
颜色关系
浅紫底、深紫或白色姓名,黑色服装保持主体对比。
字体层级
成员名使用相近尺度衬线,短介绍为规整小字。
基本图形与材质
圆角板、透明泡状轮廓、柔光渐变。
#E3E5FE
#BAAFD0
#34315B
#9A8BBB

局部图像量化取色,包含人物、背景与压缩误差。

复用要点

保持照片变量,固定卡片宽度、姓名位置与上下留白。

03

排版系统

把视觉顺序写成可以重复使用的结构。示意比例为建议,不是原稿测量。

01

组合标题与四人阵容

02

组合介绍与序号段落

03

四张等权人物卡

04

日期与结束语

从焦点到信息落点

  • 统一四张卡的头部高度与姓名基线。
  • 同色系可以变化明暗,但四人的视觉权重应平衡。
  • 柔焦渐变不落在小字区域,正文使用较深紫。
安全边距4u模块间距6u章节留白10u

建议 u = 画布宽度的 1%。以 1000px 宽画布为例,4u = 40px;多列与长图按内容调整。

04

配色与色彩角色

以下为本组视觉提炼的参考色;逐张量化色见上方。混合风格组不应把全部参考色同时放进一张海报。

#E5E2FCRGB 229, 226, 252
#B7A5FARGB 183, 165, 250
#6845F3RGB 104, 69, 243
#292335RGB 41, 35, 53
#FFFFFFRGB 255, 255, 255

环境色

先从对应画面的背景选择环境色,统一照片与素材的整体色温。背景主色不等于文字主色。

强调色

从本张作品的对照色中选择一个强调,用于姓名、日期或主题,避免多个色块同时争夺注意。

信息色

正文落在稳定明暗区。浅色装饰、透明效果和照片高光不作为小字底色。

05

字体与信息层级

原始字体名称无法由平面图可靠确认。下面用系统字体示意角色,不冒充原作字体。

DISPLAY / 8–12u

VISUAL
EXPRESSION

NAME / 6–9u

SSR / 主题姓名

BODY / 2–2.6u

活动说明负责讲清楚内容,日期和地点负责帮助读者行动。

META / 1.8–2.2u

DATE / LOCATION / INFORMATION

  • FOREVER 使用高对比衬线并扩大字距。
  • 手写 Forever 是情绪层,不替代正式组合名。
  • 成员名字与介绍位置固定,建立系列节奏。

以上字号是以画布宽度为基础的复用建议,导出后必须在实际显示尺寸检查可读性;不能把海报参数直接当作网页字号。

06

图像处理与合成层次

从后向前的重建建议;所示原图为扁平化图像,不包含可编辑原始图层。

  1. L01浅紫底背景
  2. L02深紫柔焦渐变叠加
  3. L03圆角面板与透明有机形叠加
  4. L04人物剪影叠加
  5. L05成员姓名与短句叠加

合成顺序

先建立背景与透视,确定主光方向;再放入主体并匹配明暗、色温与接触阴影。最后叠加姓名与必要装饰,在小尺寸下确认人物轮廓、标题与日期仍然清晰。这里描述可复用流程,不推断原作者实际使用的工具。

07

从元素到组件

COMPONENT / 01

四人竖条封面

由本页人物、标题、边框与色彩角色组合;保持对齐和留白关系,允许内容更换。

COMPONENT / 02

统一人物卡

由本页人物、标题、边框与色彩角色组合;保持对齐和留白关系,允许内容更换。

COMPONENT / 03

数字章节

由本页人物、标题、边框与色彩角色组合;保持对齐和留白关系,允许内容更换。

COMPONENT / 04

胶囊日期标签

由本页人物、标题、边框与色彩角色组合;保持对齐和留白关系,允许内容更换。

08

风格背景与关联

历史资料与本作品的视觉观察分开阅读。

这一组把编辑式人物矩阵与数字柔焦材质结合。重复卡片形成秩序,渐变与透明形体提供情绪;“紫色引力”是作品解析标题,而非历史风格名称。

09

一套可以继续生长的规则

保留什么

  • 统一四张卡的头部高度与姓名基线。
  • 同色系可以变化明暗,但四人的视觉权重应平衡。
  • 柔焦渐变不落在小字区域,正文使用较深紫。

如何扩展

  1. 保留原画面的焦点与阅读顺序。
  2. 换人物或内容时先适配比例,再替换色彩与装饰。
  3. 横幅保留主题、主体与日期;长图增加简介和分章。
  4. 在真实尺寸检查文字、边距、素材清晰度与导出结果。
下载本章参考色与规则 JSON ↓

滚动查看细节 · 按 Esc 关闭