一、 明确设计场景与目标

人们对于可视化数据的浏览目的是有很大差异的，从用户与设计师的关系来看，可以将设计场景分为三类：

1、静态的故事

2、可交互的统计概览

3、可探索的数据空间

而从数据本身出发，可视化的目标也是十分丰富的。

二、理解业务维度及数据类型

为了缩小线上效果与设计稿的差距，我们可以尝试在设计阶段就将真实数据纳入考虑范围。一些值得考虑的问题包括：

1、数据有几个维度？分别是什么类型？

2、数据量有多少？

3、数据分布情况、极值情况如何？是否有正有负？

4、数据更新的时效和质量如何？

也许我们无法消除设计稿与线上环境的差距，但拥有这种意识会让设计产出的质量更高，避免在上线后仓促修改设计方案的情况。

三、探索合理的视觉映射方案

这可能是我们最熟悉也最喜欢的一步，不过在凭着经验挑选图表类型之前，让我们来了解 “可视化” 的基础：编码方式。

1、可视化的基础：编码方式（Encoding）

2、我们如何将数据对应到某种视觉结构？有很多种方式，比如长度、角度、色相、饱和度、阴影……

3、我们以什么规则来选择某种编码方式？

这里有不同的影响因素，包括：

• 感知精确度（perception accuracy）

• 喻体&文化含义（metaphors & cultural significance）

• 情绪&可记忆性（emotion & memorability）

Munzner在书中提出“标记”和“通道”的概念，用以辅助设计师选择编码方式。（Tamara Munzner, Visualisation Analysis & Design, p.102）

• 标记（mark）：图片中的基本视觉元素

• 通道（channel）：控制标记的外观的一种方法

• 区分强度（magnitude）和身份（identity）通道

在设计中，我们应当尽可能选择排名高的编码方式。实际上，柱状图、条形图就能够满足很多场景；如果一味追求视觉效果的丰富、“酷炫”，复杂花哨的可视化方案可能会降低信息传达的有效性。作为设计师，我们要结合可视化目的和数据特征来选择映射方案。

四、考虑交互方案

在非静态的可视化界面中，设计师需要提供由表及里的交互方案。

五、协调优化

经过前四步，一份数据可视化方案已经成形，这一步是从全局视角来协调页面中的元素。值得注意的方面有：

1、凸显最重要的指标（信息量与对应的着墨量相匹配）

2、选择合适的配色

3、体现跨图表的关联性

六、评估检验

完成可视化方案的设计时，别忘了邀请他人参与到评估的过程中，尤其是复杂的交互式可视化方案。我们可以考察他人对可视化的第一印象如何，对可视化信息的理解是否与预期一致，以及人们是否能快速搜索到目标数据。

这里提供信息可视化的七个场景，可作为评估的参考视角：

1、关注过程：

• 理解环境和工作的实操 understanding environments and work practices

• 评估视觉数据分析和推理 evaluating visual data analysis and reasoning

• 评估通过可视化传达的信息 evaluating communication through visualisation

• 评估合作式的数据分析 evaluating collaborative data analysis

2、关注可视化：

• 评估用户表现 evaluating user performance

• 评估用户体验 evaluating user experience

• 评估可视化算法 evaluating visualisation algorithms (no users!)