数据可视化一直是设计师的一项关键技术。我们想象一些简单的事情，比如这周我们在咖啡上花了多少钱，或者这个月我们离减肥还有多远。像这样简单的可视化可以作为图表插入到其他屏幕中，但是当数据翻倍时，显示的内容通常会变成Dashboard。(但也许更重要的是)什么是仪表板？

我听到了一些有趣的回答…从“任何带有图表的页面”到“用户构建自己的UI的方式”。这些都是极端的，但是互联网上有一些好的定义(也有一些不好的定义)。

我个人最喜欢的是斯蒂芬·菲勒的说法:

“仪表板是实现一个或多个目的所需的最重要信息的可视化显示；整合排列在统一的屏幕上，让信息一目了然。”

为什么要这样定义？因为，它不仅抓住了仪表板的数据直观显示的特点，而且直观显示具有明确的目的或价值。

我看到的最常见的错误是，设计者建立Dashboard的愿望是先做一个好看的、铺开页面的设备，然后实验把效果放到上面。从Dribbble上漂亮的仪表盘开始，希望你能得到一个有用的界面，这是灾难(一个漂亮的灾难，但仍然是灾难)的招数。

为什么Dashboard很主要？

我们使用Dashboard来帮助用户快速评估状态，并确定需要做哪些响应。Dashboard的可用性实际上可以说是服务可用性小幅下降和影响业务底线的全面暂停之间的差异。

在过去的四年里，我一直是VMware操作软件的设计负责人，为多个产品设置了设计偏好，包括vRealize operating manager、vRealize Log Insight和Wavefront by VMware。每一个都包含某种自定义的仪表板效果。我的团队中的设计人员建立了Dashboard，以帮助用户克服大规模且通常无序的数据的浩瀚。

软件开发人员和IT专业人员使用这些产品来管理和操作世界上一些最重要的应用程序。对于这些用户来说，分析数据所需的时间不仅重要，而且至关重要。

优异Dashboard设计的5个步骤

虽然我确信有许多不同的方法，但以下步骤反映了我通常是如何处理被确定为需要Dashboard的项目的。当我在VMware中设计Dashboard时，我发现这些步骤非常有用，我希望其他人也会发现它们有用。

1. 明确用户及其目的

作为设计师，我们知道我们不是为自己设计软件，而是为用户设计软件。像应用程序的任何其他部门一样，Dashboard应该专注于满足用户的需求。这意味着我们需要首先确定Dashboard是给谁的。

例如，汽车的仪表板是围绕驾驶员所需的仪表而构建的。如果是为乘客打造的话，发动机转速等设备可能不是主要的，但是电台在哪个电台播出就变得很重要了。这是针对特定用户的主要内容。

其次，我们需要了解他们在这种情况下的目的是什么。他们是想把车从A点开到B点，却还在为公路旅行选歌的司机吗？每一个设计决策都是一个选择，所以了解主要目标用户的意图有助于你做出选择。

2. 选择准确的Dashboard类型

到目前为止，我总是提到Dashboard，但实际上Dashboard有许多形状和大小。根据我的简历，我发现把他们分成三种主要类型很有用:

监控仪表板
交互式剖析仪表板
导航仪表板

(1)监控仪表板

监控仪表板是最传统的仪表板精神。当第一次被要求定义汽车的仪表板时，它们可能是大多数人的想法。这是一个很好的监控仪表盘的例子，因为它显示的是用户应该经常看到的信息，一目了然。

它还假设由信息引起的潜在行为在别处被接受。例如，如果显示速度限制，您可能希望松开油门，如果速度限制过快，您可能需要刹车。

我们在VMware软件中看到的一个常见示例是在运营中心的大型共享监视器上显示的控制面板。很多人可能会看到Dashboard，但没有人直接与之交互。它显示在其他地方执行的操作。

VMware的wave front-单值统计仪表板

(2)仪表板的交互分析

近年来，交互式分析仪表板变得越来越流行。它们的目的不是一次显示大量的信息，而是以数据可视化的形式为用户提供工具，使他们能够显示所需的信息。这通常是通过流行的过滤器和选择器将图表连接在一起实现的。

验证操作管理器-在虚拟机分析仪表板上执行故障清除。

(3)导航仪表板

在中心径向导航模型中，导航仪表板充当一种“目录”，其中中心页面指向详细信息页面。不同之处在于，每个统计数据代表一个更一般的元素。这个值区分了项目，让用户清楚的明白哪些交互可以获得更多的信息。

wave front——VMware的控制面板到控制面板导航

这些定义不是单一的仪表板类型。一般来说，仪表板有几个特点。我看到的一个常见模式是在监视器上和团队之间共享一个监视仪表板。

受监控的项目是可导航的，并且允许团队成员深入到包含关于项目的更详细信息的单独的仪表板。在这种情况下，它既是一个监控仪表板，也是一个导航仪表板。

3. 以准确的方式显示准确的数据

(1)数据粒度

一旦您了解了用户、他们的目的和仪表板类型，您就可以将这些信息转化为一个或多个简单的问题。用户可以在其中找到Dashboard的真正价值。如果这个问题太宽泛，你可能回答不出来，或者需要大量数据才能准确回答。

另一方面，如果问题太窄，不太可能解决用户更大的目的。找到准确的问题，来回回答，这就是仪表盘设计的艺术。像大多数设计一样，它实际上是从研究开始的。

找到准确的问题可能只是观察一些有代表性的用户那么简单，也可能需要一些深入的对话和语境的探究。只有知道了用户心中的问题，才会知道自己是否真的有数据来准确回答。

8朋友圈言论模板，学会做交易。

为了更好地理解用户的目的，我们鼓励设计师讲述用户的故事，并想象这个故事在软件中是如何流动的。故事的一部分可能看到用户需要回答问题。如果产品可以辅助回答问题，Dashboard可能是最好的机制，但产品必须有准确的数据才能让答案有用。

如果发现确实有数据，那就太好了！如果没有，那么你就需要看看你是否能得到数据(有时是通过合并现有数据)，或者你是否能小心翼翼地把问题变成一个可以用可用数据回答的问题。

这个阶段的典型缺陷是让您拥有的数据决定您正在构建的仪表板的内容。仅仅因为一个API公开了20个独特的指标并不意味着你应该显示20个图表。关注用户，而不是数据！

(2)时间和比较

数据会随着时间而变化，这也是它有趣的原因。它变化的事实提供了第一种对比，即可视化随着时间而变化。

假设时间跃迁是有趣的，我们需要考虑精确的显示机制:它和时间有什么关系？当前状态是唯一重要的吗？那么，也许一个单一的指标或规模是准确的方式来显示它。

过去的趋势是主要的吗？您可以考虑将这个统计数据与一个简单的火花线配对来显示趋势。火花线保真度够不够，还需要在确切时间查确切数值吗？如果是这样，最好使用带有清晰轴标签的细线图。

从单一指标到火花线再到希望线图

但是，时间不是唯一的比较类型。有时，对多个弹簧进行相互比较也同样重要。如果是这样的话，确切的答案可能只是两个单独的统计数据并排在一起。

然而，如果有两个以上的弹簧呢？使用条形图或直方图相互比较值是否重要，或者更重要的是，使用饼图比较值与整体值。而且，如果重要的是和其他的弹簧比较，和一段时间的比较呢？

在这种情况下，你可能会发现自己转向累积面积图。

希望从条形图到饼图再到累计面积图

4. 按部就班地组织起来

通常，您会使用多个显示器来回答多个问题，那么如何在Dashboard上部署它们呢？回到你已经确定的问题，它们通常可以形成一个连贯的结构。

想象一下，你正在为一个私人教练设计一个仪表板来跟踪他的客户的进度。第一个问题可能是了解客户是否实现了月度目标。如果答案是“否”，那么培训师会想知道这是朝着错误偏见的稳定增长，仍然反映了客户“欺骗日”趋势的“快速进步”。

通过组织问题，您可以对小部件进行逻辑分组，以最好地回答问题。

排列图表时，请考虑:

目的用户的自然阅读偏向（从左到右照样从右到左？）
显示尺寸（4K显示器照样细小的iPhone6SE？若是两者兼而有之，请准备好响应性的谜底。）
时间对齐（显示相同时间局限的多个图表，若是它们是垂直叠加的，则更容易关联。）

因此，现在您有了一个仪表板，它充满了按逻辑顺序排列的图表和小部件。它们回答了你对用户期望的所有问题，但很难将它们放在一个屏幕上，旋转会一眼损坏仪表盘。我该怎么办？

这也是问题结构发挥作用的地方。如果你已经确定了主要问题，那么首先确定你需要回复什么。这是您的仪表板默认显示的内容。前端开发人员一开始并不需要渲染尽可能多的图表，但他们会愿意这么做。

对于这些小问题和其他问题，您可以通过在默认情况下将它们折叠在仪表板上或者将它们移动到它们自己单独的可导航仪表板来逐渐暴露它们。如果您使用辅助仪表板模式，请确保导航清晰易懂。

开发人员通常决定这是否是一个选项，但是他们应该知道每个选项的权衡:

导航似乎很容易，然则维持上下文往往很难题。
折叠看起来也很容易，然则页面超载可能会给用户和出现Dashboard的系统带来压力。

在极少数情况下，你可能会发现你倡导的用户只有一个问题，你只需要出示答案。如果是这样的话，这个部门其实并不需要，但是我可以数一数我见过的例子。

5. 增强造型设计

现在，您有一个或多个仪表板，其中充满了图表，用户可以注释这些图表来回答主要问题。

可能有人会觉得这样就够了，可行，但是作为设计师，我们不仅要尽力让用户理解数据，而且他们也可以轻松甚至愉快地做这些事情。颜色和字体的使用可以将Dashboard从功效扩展到真正的可用性。

(1)颜色

之前，我想过举行一次比较。跨图表进行比较的最常见的东西之一是数据源。最主要的是，多个图表(甚至不同图表类型)上的数据应该以相同的方式指示相同的弹簧来源，尤其是在颜色方面。

另外，请注意颜色是如何解读的。例如，许多用户会将红色图表理解为错误，将绿色图表理解为正常和健康。红绿还提出了另一个考虑:感受性。红绿色盲(色盲和全色弱)影响了高达7%的男性人口，因此使用模拟工具来验证您的图表是否可以区分是非常重要的。

在使用了上图中的色觉模拟器之后…哦，拜托。

(2)字体

为界面选择合适的字体已经够困难的了，但是图表也提出了自己的特殊挑战。图表中显示的文本比大多数文本小得多，因此找到一种小的可读字体是关键。

另外，图表的字体在界面中用于数值的频率要比其他部门高得多，所以请仔细思考数字是如何出现的。例如，许多字体在0上添加斜线或圆点，以与字母“O”分开，但如果字体较小，它们可能看起来像数字“8”。

数据可视化对设计者来说是一个关键的挑战，设计优秀仪表板的能力是一个有价值的工具。像任何手艺一样，重要的是不仅要有精确的工具，还要知道如何有效地使用它们。虽然制作一个漂亮的图表需要特殊的技巧，但制作一个解决用户问题并让用户以快乐的方式持有它的仪表盘需要思考和设计。