设计可视化:应用以用户为中心的指南





0/5 (0投票)
设计可视化:
引言
可视化是通过将任何形式的数据转化为图片而创建的,这在网站和应用程序界面设计中变得越来越普遍。信息轰炸和对信息孤岛的访问促使许多人将海量信息转化为可视化,以帮助我们理解这些信息。
创建有效可视化
我们经常在杂志、网站、电视和其他媒体上看到花哨的可视化,但为什么有些可视化有意义,而有些则没有呢?答案很简单……设计一个好的可视化与设计一个有用的产品是一样的。一个看起来花哨的产品并不意味着它有用且易于使用。这个理论适用于我们今天看到的可视化。
请浏览并尝试以下示例,并问自己您看到的内容是否有意义。
我们中的大多数人通常会被可视化的美学所吸引,因为它们往往会通过色彩鲜艳的图像和复杂的信息连接产生“哇”效应。一些动画和/或交互式版本会进一步惊艳人们,因为它们允许人们在短短几秒钟内就能处理复杂的信息。
然而,并非所有可视化都可用且易于使用。一些可视化是本·弗莱(Ben Fry,《可视化数据》一书的作者)所称的YAHSVPOQUFOTI(Yet Another Highly-Stylized Visualization Piece Of Questionable Utility Found On The Internet,即互联网上另一种高度风格化且实用性可疑的可视化作品)。
可视化可用性指南
总的来说,好的可视化应该
直观
对于交互式可视化工具来说,直观尤为重要。没有什么比拥有一个很棒的可视化但其功能隐藏起来更糟糕的了。如果人们不理解您的可视化,因为它不明显地表明拖动滑块可以查看 X 如何随时间变化,那么所有用于构建其美感的努力都将白费。
帮助观众理解复杂信息
可视化的力量在于它们能够在一个视觉画布上显示复杂信息。如果一个屏幕上显示的内容太多,这有时会很困难。一些可视化通过允许用户操作信息来克服这个问题,从而减少屏幕上同时显示的信息量。
例如,在Facebook的交互式好友圈中,将鼠标悬停在特定好友的名字上会显示该特定好友与您好友列表中其他所有人之间的联系。这可以让您一目了然地看到 X 与您的朋友的关系(尤其当您有 399 个好友时)。另一种选择可能是在好友圈的静态版本中出现一个巨大的纠缠的网,五颜六色的线条在这里曲折缠绕,只会产生“哇”效应。
使用恰当的心智模型
人们在理解世界时会形成特定的心智模型,因此这在可视化设计中非常重要。一个好的可视化需要匹配用户对特定主题的构想方式。
例如,标签云使用了一个好的心智模型:大等于多,其中字体较大的单词表示其在特定文本中出现的次数很高。更复杂的主题可能需要理解目标受众是如何构想特定主题的。例如,空中交通管制员理解空中交通的方式可能会影响到描绘空中交通流量的可视化设计。
遵循通用可用性指南
由于大多数可视化都是在电脑屏幕上查看的,因此标准的网站可用性指南自然适用于可视化。一些对可视化尤其重要的指南包括拥有
- 良好的色彩对比度
- 清晰易读的字体大小
- 清晰的标题
- 说明(切勿让用户猜测您想说什么或展示什么)
- 良好的缩放和平移选项
- 清晰的反馈
允许观众从可视化中获得见解
可视化是否显示了超出普通人认知能力的东西?它是否能产生罗伯特·斯宾塞(Robert Spence)所说的“啊哈!”反应(观众可能会惊叹“啊哈——我现在明白了”)?更好的是,它是否能帮助观众根据他们看到的内容得出新的结论?这个结果可以看作是以上标准的组合。
结论
可视化的设计不仅仅在于其美学特质。好的可视化应该是可用且有用的,以帮助观众理解信息或通过操作信息获得见解。上述指南对于以用户为中心的设计以及信息在交互式网站和产品中的呈现方式至关重要。
VisualComplexity和FlowingData是展示更多可视化的优秀网站。
本文作者是Yeevon Ooi,一家用户体验咨询公司Webcredible的顾问。Yeevon热衷于改善网站的用户体验,并负责实施各种用户体验项目,包括眼动追踪和用户界面设计。
历史
- 2010年8月12日:初次发布