B4.6-Surface 表现层

恰当的视觉设计，用户眼动轨迹应该【遵循一条流畅的路径】、【不过度干扰的前提下为用户提供有效的引导】

想要精细的视线路径用眼动仪 Eyetracking 如果只需要粗略的结果可以直接问用户，或者自己走到远处看界面，模糊细节 

对比 Contrast

把用户的注意力吸引到界面中的关键部分

帮助用户理解页面导航元素之间的关系

传达信息设计概念组群的主要手段

【引导用户在页面上的视线】/【将注意力吸引到几个关键元素上】

完全没有对比，导致没有一个元素突出，会很单调。

但是过度地对比（突出元素太多）会导致视觉上的混乱。

大概突出3/10以内的内容是恰当的。

一致性 Uniformity

一致性让你能更有效地传达信息，而不会导致用户迷惑或焦虑。

将视觉元素的大小保持一致的尺寸，可以使你在需要的时候把它们更容易地重新组合成一个新的设计。

Grid-based layout 通过母版确保一致性，每一个元素在母版网格上的位置应该是一致的

内部一致性：同一款产品内部的设计风格和规范应当尽量保持一致。

即使大多数的设计元素被相对独立地设计出来，它们最终还是要放到一起的。

外部一致性：同一企业的不同产品之间设计风格与规范应当尽量一致、有连续性。

统一的品牌识别系统Visual Identity

配色方案 Color Palette

色彩能够最有效地向外界传递品牌识别。

核心的品牌色彩通常是一个更广泛的配色方案 

通常，更亮或更醒目的色彩可以用于设计你的前景色，用于你希望得到更多注意的元素中。

更暗淡的色彩用于哪些不需要跳出页面的背景元素中。

非常相近的颜色会增加用户的认知负载。

排版 Typography

恰当使用字体和字型对品牌识别有裨益。

苹果电脑和大众汽车发明了特殊字型专供自己使用。

但面对华丽字体组成的大段文本，我们的眼睛很快就会疲倦。

对于标题或标签使用稍具个性的字体是恰当的。

但需要控制字体、字型的数量，避免造成混乱。

最后，不要使用非常相似又不完全一样的风格，风格之间要有足够的对比。

视觉模型 Visual Mock-up /Design Comp

从已选定的组件中建立起来的、一个最终的可视化产品。

设计模型应该能够显示出线框图的核心概念（信息设计），即使它没有精确地按照线框图实现。

Style Guide  视觉设计指南

全局标准通常放在第一部分（架构母版 配色方案 字体标准 Logo应用等）

确定了视觉的每一个方面，所有元素。

包括某一个模块/功能的具体标准

作用：提供决策信息+确保设计一致性