内部教程！超详细的支付宝设计规范之线下字体篇

在线下场景物料、具尺寸是依据体工程学为参考，不位、不距离、不度下，物料类型 、版结构、文层级、号、距等，都影响着使用者信息传递。

一、原则

1. 动态与静态

人线下环境对信息内阅读分静态与动态。当处于不同的阅读距离时，观看料的角度也会所不同。

根据「人工程学」及「行为模型」的数据：当人从动态视距进到静态视距的红点位置，即人眼看清一个目标并获得视印象，平均时间是170毫秒，单个字是250毫秒。

行进速度增加，视角随增加幅度减小。因此，运动状态下的快速阅读要避免让用户产生「回视」或「眼跳」。

回视：们在阅读过程，碰到不理解内容时，迅速意识地回顾前内容。

眼跳：在阅读过程中，眼睛的斑中心凹在从一个字移到另一个字时，眼帘发生的0.1秒突然震颤。

在「动静」则下，需要物料人收息的状和间，如「远距离＋高视角＋且多在运动状下观的」 大型横幅竖幅就禁止呈现多息。

2. 视角与视距

静止状态，人的水平视觉焦点约介于 3°－10°之间。眼睛最佳转在水平线上25°，35°左右位置。

在此视圆锥之外的像（灰色部）是由周边视觉搜寻，靠余光受的域，其范围介于水视角以上 60°、以下 70°。

以均身高16的性用户为例，在其最佳视角下不同视距的三种物料（卡、海报、易拉）传递的息范围是不一。当视距为0.5的情况下，结前面的「视野布图」，大约可得出其视觉盲：地线以上0.35。

这三种「代表物料」是依据目前支付宝线各行线物分类筛得，总体两大类：固定类与移类，中固定类中又可细分为5类：地面类、桌面类、墙面类、落地类、悬挂类。

把所这些料入十字象限中，从 「面」往到 「桌面 墙面 顶面 」，再看目聚焦：桌面类、墙面类、落类三类料，这三类中具表的分别：台卡、海报、易拉宝。所以，后面的「原则&规范 」将重点以这三类案例分析。

3. 顺序节奏

从结论－功能－详细说「倒金字塔型」结构，在线下景中能短间内快速、有效的将资讯传达给用户。将资讯群组化，且依重要性程度排序，资讯更易传递。

以海报别的物料为例，其版面应备三种讯息别：「最高别的大标题——中等别的流程图、功能图——低别的使用说 」 按序有节奏的递减；各别间的差异可能异常显，主要取决于物料种类（版面大），某个别可能非常巨大，而另一个别可能极其。

4. 可辨与易读

中英字体分是等宽型和比例型（文宽度不）。比例型文有各自不宽度，输入时会自动调距。此在编排数（英文）体时：

• 不允许用中文字输；
• 在相号下，数会比文小，根据「易读」原则，需调至高度致视觉平衡。

5. 平衡与对

方正兰亭系列的字体族至供了10种同字重的字体。我们使字体族既可维持平衡，又可通过同字重的强弱系 ，产生对强调（对）的分与协调（平衡）的分共存在相同版面中，可使粗细例具有共通性「字体族」。

如图所示，越往上越有亮、轻快、都会、摩登的觉，越往下越呈现出稳定说服力、厚重。

设定同的字大小时，若困惑于该呈现多差距时，可从「等」、「等差」或「斐波那契」思考。

这三种对比可以帮助去思考该呈现哪种差距的关系，当需要使正标题有确大差异 ，可以采用差距最大的「等比数列」。

6. 对齐与留白

本可同的对齐方式来设置：

• 左齐：以各首齐
• 右对齐：各行的行末对齐
• 居中对齐：使轴线位于段落宽度的中间位置

中对齐后留的负空间若处当，易形成连续且中断的灰值外观。因此将本设置成「两端对齐」产生整洁、几何形的版式效果。遵循规范二的「字距」或规范七的「图示法」均有助于可规避。

依据前述线下体应用「六大原则」，我们分细化成：号、距、距、标等七条规范。

二、规范

1. 字号

根据「原则一」中提及的人工程学及行为模型的数据，设定参考数据下图。

以最常用几物料举例：

• 大标题：字号依照文字个数不定，一行标题不超5个字获取信息最佳；禁止超9字。
• 内文：手册、单页、DM 常用级不小于7.5-9pt；海报常用级不小于17-23pt；易宝常用级不小于24-28pt。

2. 字距

• 文：把单宽度设为个 a 时，议距最大极限不要过1／2a。
• 数字：有些数字的前后会现「空洞」或「拥挤」的状况，必须目测方式作适调整。
• 标点：如「引号」间会有极大空，破坏整体间隙，亦需按实际情况以目测方式缩至
  视觉协调。

3. 行距

• 内文最佳距为号1.5-2倍左右。
• 如果物版面紧张、信息量特别大（如规则、说明等），可适当缩小至字号的1.2-1.5倍。

4. 禁则文字符

• 行头禁则中包括的要字与符号：句号、逗号、顿号、连字符、分号、冒号、感叹号、问号、（各种）反括号。
• 离禁则中包括的主要文字符号：（各种）正括号。
• 行末禁则中包括的主文字与符：两倍破折、两倍省略。

5. 跃动比

从体家族分选取大适合阅读正兰亭大黑与刊黑、细黑、黑做比，其跃动比值分为：

• 黑 vs 大黑：1.83
• 刊黑 vs 大黑：2.95
• 细黑 vs 大黑：2.04

相号下正副标题，采用最佳跃动率为1：2正兰亭细黑&正兰亭大黑；不号时（副标题号小于正标题），亦可选用正兰亭准黑（黑）&正兰亭大黑。

6. 两端对齐

在遵循字号、字间距的基础上，大标题宽为基准进行正。

依照物料种类，海报、易拉上大标题（一行）中文字数5字以内最佳；禁止超过9字。

标题两端对齐校时，如已达到「字距」极限（规范二），还可加入「图示化」手法（规范七）。

7. 图示化

三种最常用的方式：

• 方式一：把须传达的字框起来
• 方式二：数字使用英文字体放大表示；整成一个体来配置
• 方式三：增加图形符

呼应 「则」中「居中对齐」后的负空间理，除了「字距调整， 增加图形装饰」等方法调整至「端对齐」。