Xklzw1-7.indd 48 2021.4.19 3:04:54 PM 

第3课
3.1 信息可视化的黄金规则
信息可视化设计过程并非凭空发生。它是基于设计、研究、用户观察、认知心理以及
人机交互的一门科学。这些原理和方法结合了个人的知识和经验才能成为创新的动力。国
际知名的数据可视化和信息图表设计公司InfoNewt(www.infonewt.com )和酷信息图表博客

(www.coolinfographics.com )的创始人、畅销图书《酷信息图表:数据可视化设计指南》的
作者兰迪·克鲁姆在书中总结了信息可视化设计的10 条黄金规则:①信息的准确性;②用户
导向设计;③主题的研究与选择;④关键信息的提取;⑤吸引力规则(5 秒规则);⑥好的故
事与逻辑;⑦摒弃文字以图释义;⑧数据透明化;⑨图表信息的完整性;⑩表现手段与技术
的选择。

这些黄金规则中最重要的就是信息的准确性。不准确的信息就像一幅错误的地图或手机
导航,不仅会使人误入歧途,而且使得设计师的水平和专业能力的信誉大打折扣。可视化必
须与统计数字相互匹配,而且所有的数据来源都要反复核实,精益求精。例如,地图信息不
正确,不规范;图表的比例与数字不符;数据意义不明确;图标设计信息传达有误是学生经
常会犯的错误(图3-1)。图表中常见的错误还有:数据无来源标注;无作者版权信息以及数
据图表无单位等。因此,对读者负责的态度和踏实、认真、细致的工作习惯是信息准确性的
保证。


图3-1 信息图表设计中常见的错误
其次,用户导向设计是设计思维的基础,也是所有信息可视化设计的出发点。用户的年
龄、性别、家庭、知识层次、民族和地域等背景,决定了不同的用户对信息可视化的接受程度。
同样,信息可视化的媒体呈现也是图表设计的重要考量之一。科普杂志、新媒体、学术期刊
和专业论坛对可视化设计的要求差别很大。因此,信息的易读性、可用性、美观性和可记忆
49 

Xklzw1-7.indd 49 


2021.4.19 3:04:55 PM 


信息可视化设计概论

性同等重要。例如,波士顿儿童医院为了帮助病患儿童能够在医院里有更好的体验,就聘请
了当地大学的设计团队为医院大厅设计供儿童娱乐的交互墙面(图3-2)。团队在设计过程中,
也随时与小朋友们进行访谈与演示。通过符合儿童心理的设计表现内容以及相关的导航图标,
该产品为病患儿童提供了一个温馨舒适的就医环境。


图3-2 波士顿儿童医院为病患儿童设计的交互式体验墙

主题的研究与资料的选择非常重要。选择一个好的主题听起来似乎容易,但真正的难

处在于对“好”的理解不同。无论表达什么内容,一个好的信息图表首先应该有意义和话题

性,各种无聊或无关紧要的内容无疑是在浪费读者时间。随着信息爆炸和大数据时代的来临,

人们不得不选择哪些信息值得阅读。理想情况下,一个好的信息图表的主题应该将重点放在
一些新颖的或前沿的信息上。只有这些信息与目标受众感兴趣的主题有关,才能达到预期的
效果。如果这些信息或话题能够使听众感到惊奇和意外,则可能会收获更大。因为人们普遍
“喜新厌旧”,对新鲜的、惊奇的、有趣的或者令人惊讶的话题或者信息会趋之若鹜,并愿意

与朋友分享这些新知识。

通常来说,有两个共同的主题领域值得我们进一步关注和讨论:趋势主题和有争议的主
题。虽然热门话题非常流行,而且几乎所有的相关话题都会产生相当可观的访问量,但是热
门话题往往随时间而变化。当事过境迁,人们就会把注意力放在下一个热点上。因此,对于
某些普遍性和持续性的主题,如全球变暖或生态危机问题,还有涉及医疗、公共卫生、两性
关系、家庭、就业率等与人们生活关系特别密切的领域,往往会有更持续的主题和相对稳定
的目标受众群体。例如,2020 年2 月16 日,上海报业集团旗下的澎湃新闻“美数课”团队
在社交媒体上推出了《回溯45 个重点疫区的数据,我们该如何看待当前疫情?》的文章和
插图(图3-3)。该数据图表简洁清晰、生动而有创意,通过可视化的数据对比,展示了湖北、
武汉、全国其他城市的确诊病例、死亡率、治愈率、重点疫区每10 万人能享受的医疗资源
以及病例数量等大数据,为读者掌握当前疫情和防控提供了非常好的参考。这个数据新闻已

50 


Xklzw1-7.indd 50 


2021.4.19 3:04:55 PM 


第3课
成为热点话题和数据可视化设计的经典范例。


图3-3 澎湃新闻“美数课”团队在疫情期间推出的大数据图表

能够设计出精彩的数据图表,与澎湃新闻“美数课”团队的努力是分不开的。在过去的
纸媒环境中,数字记者、图表设计师等通常扮演的是一种支援角色,多数主流媒体中没有专
门的数据新闻团队。而澎湃新闻在转型过程中,早早地瞄准了数据新闻这一新鲜领域,2014 
年就成立了专门的数据新闻团队,让那些传统意义上的“辅助”人员共同生产内容和创作产
品。目前“美数课”团队共有21 人,在主要负责人的带领下,分为编辑组和设计组。编辑
占总人数的1/3 ,这些“一专多能”的编辑除了需要处理日常稿件、挖掘选题外,还要负责
收集数据、分析数据,同时也需要掌握一些简单的前端开发和设计技术;设计师团队占总人
数的2/3 ,分别负责手绘、3D 和信息图表的制作。正是因为有了这支专门的团队,澎湃数据
新闻生产才能保证一定的独立性。此外,编辑的多才多艺和触类旁通更是节约了生产流程中
的很多沟通成本,也减少了作品“走样”的可能。因此,该团队能够敏锐地发现新闻热点问题,
并通过有效的技术手段打造视觉效果,增强了用户的新闻体验感和关注度。

有争议的话题往往会吸引很多读者的目光。对于需要网络流量的自媒体来说,各种争议

性的话题都是可能提高流量的手段,如一些与环保、教育、家庭伦理、技术伦理相关的主题,

还有诸如吃肉的危害、减肥的方法或涉及两性的话题,无论正反两方面都会有各自的拥趸。

如果信息可视化设计作品能够在情感层面打动观众,适度引起争议,使观众对该话题充满热

情,那么受众将很可能评论和共享该信息图表。无论他们喜欢还是讨厌这个话题,但读者的

帖子可以产生更多的搜索链接,从而覆盖了更广泛的受众。例如,交互媒体作品《肉的危害》
(图3-4 )就是这种虽然富有创意,但主题与观点仍然具有争议的例子。

51 


Xklzw1-7.indd 51 


2021.4.19 3:04:57 PM 


信息可视化设计概论


图3-4 交互媒体作品《肉的危害》

3.2 信息资源的整理与优化
信息资源的整理与优化是可视化作品能否成功的关键之一。其中的核心就是:当读者看
完你的作品以后,是否能够留下印象呢?或者说观众是否能够记住主要的信息呢?如果想要
使信息图表更易于理解,设计师面临的挑战就是如何选择和确定该图表要传达的重点内容?
正如一篇优秀的小说,理想情况下,信息图表需要一条清晰的主线,所有的数据可视化和相
关的图标、插图或文字都要围绕这条主线展开。去粗取精、去伪存真、抓住重点、简化内容
是这个阶段的中心任务。许多人错误地认为,如果将多个不同的数据放在一个图表中,则会
提高其可信度,因为它可以显示其拥有的数据量。但事实上,如果设计包含太多信息或者没
有清晰的故事主线,则会使读者或观众感到困惑。发生这种情况时,读者通常会放弃并且不
再花费时间弄清楚这些信息。因此,如果数据图表包含了太多的信息,该作品实际上是无法
与读者进行交流的。信息可视化设计的另一个常见的问题就是对信息的可用性、功能性关注
不够。例如,某大学同学们设计的一幅校园游览图(图3-5 )就出现了这种问题。该作品采
用了扁平化设计方法,颜色清新亮丽,装饰感很强。但比较遗憾的是,该信息可视化作品的
主题并未很好地提炼与优化。地图缺乏路线导游,方向或目标不清楚,虽然有校园建筑的功
能说明,但整体上看设计重点不够突出,信息主次不分,缺乏层次感;特别是未能标注出主
要的校园路线和核心功能建筑群,如教学区、就餐区、体育馆、宿舍区等,所以影响了该游
览地图的可用性和功能性。

52 


Xklzw1-7.indd 52 


2021.4.19 3:04:58 PM 


第3课
图3-5 某大学大学生创作的校园游览图作品

3.3 视觉吸引力的5秒法则
在《酷信息图表:数据可视化设计指南》中,作者克鲁姆曾经指出:为什么信息图表的
关键信息如此重要?他根据过去几年来对自己的coolinfographics.com 网站上数百万页面浏览
量的网络分析,发现大多数读者对信息图表只阅读5 秒时间,然后再决定是否要继续还是离

53 

Xklzw1-7.indd 53 


2021.4.19 3:05:00 PM 


信息可视化设计概论

开。在信息爆炸时代,人们浏览手机或报刊,往往类似于在拥挤的货架上寻找消费品,如
果产品设计不能够脱颖而出,就会淹没在琳琅满目的同类商品之中。无论是信息图表、演
讲PPT ,还是个人求职简历,简约而清晰,美观而富有特色是成功的不二法则。研究指出:
大多数页面浏览持续时间为5~10 秒,因此好的信息图表设计需要尽快将其关键信息传达给
读者。经验法则是,设计图表需要在不到5 秒的时间内将关键信息清晰地传达给读者,即使
他们没有时间仔细阅读整个信息图表。资深的设计师还可以通过更有冲击力的设计风格影响
读者。

意大利信息设计专家瓦莱里奥·佩莱格里尼就是这样一位能够吃透观众心理,把握读者
习惯的设计师。他是一位资深的数据可视化和图形设计师,其商业插图的技术可谓炉火纯青。
他为《国际船舶》杂志设计的插图和图表(图3-6 )广受好评。其作品颜色醒目,造型生
动,图表清晰,是“5 秒法则”的范例。他曾经获得2013 年和2016 年“美丽的信息”国际
数据可视化和信息设计卓越奖,同时在2015 年和2016 年连续获得“美国最美信息图表”设
计奖。


图3-6 设计师佩莱格里尼为《国际船舶》杂志设计的插图和图表

3.4 图表信息构架设计
信息图表设计就是通过数据+ 图形讲述故事。许多好的信息图表遵循一个简单的故事结
构:简介、关键信息和结论。其中,简介部分需要向读者介绍信息图表的主题。包括该信息
图表是讲什么的?读者为什么要关心它?这通常是标题信息和简短介绍文本的组合。设计师
通过标题和简介将主题传达给目标受众,并暗示该图表所包含的前沿信息和有趣的内容。标
题和介绍文字的另一个功能就是提供检索和导引,让读者能够迅速了解该信息图表的大意。

54 

Xklzw1-7.indd 54 


2021.4.19 3:05:00 PM 


第3课
简介内容应该包括一些相关背景的资料,这有利于读者将自身的经验带入图表所涉及的知识
中,有助于使读者准备好学习和掌握新的知识。例如,美国狗舍协会网站推出的信息图表《狗
展大数据:终极养狗参考指南》(图3-7 )就是优秀图表的范例。该图表结构清晰,版式重点
突出。标题右侧的图标说明了狗的尺寸、品系、智力(朝向)和种类(颜色)等信息,为读
者弄懂全图数据提供了依据。该信息挂图通过四象限坐标轴,结合综合数据(寿命、花费、
食欲、营养等),对常见的几十款宠物犬、工作犬或牧羊犬等进行了分类。其热门品种包括
常见的金毛、猎犬、博美、德牧和吉娃娃等。

该图表不仅信息丰富,而且生动幽默。例如,西伯利亚哈士奇(俗名“二哈”)就是属
于这里面的傻狗(dumb )品系,其朝向和其他狗相反。哈士奇、泰迪犬和斗牛犬等以难训
和“拆家”而闻名。虽然它们智力不高,但却呆萌可爱,受到了很多养狗人士的喜爱。该图
表的其他信息也特别丰富,如被莫名高估的品种(左上象限)和被忽略的珍品(右下象限)
中都蕴含了许多有趣的故事。对于喜爱养狗的人士,这个信息图表无疑提供了一个可视化
指南。


图3-7 美国狗舍协会网站的《狗展大数据:终极养狗参考指南》

为了让观众对信息图表更感兴趣,设计师需要在信息图表中加入一些新的信息或前沿的
知识。信息图的重点内容通常是视觉设计的核心。无论是使用插图还是数据可视化,能够触
发读者兴趣的往往是精彩的图片设计。例如,韩国203 X 设计工作室首席执行官、著名信息
插图设计师张圣焕先生绘制的信息插画《健康美味韩国泡菜》就突出了标题、泡菜火锅以及
泡菜的形象和视觉冲击力(图3-8 ,右侧为重点)。该信息图表风格统一,信息排列有序。张
圣焕非常善于利用网格化布局,将所有的内容安排得主次分明、井然有序,充分体现了设计
的可用性与美观性的融合。

55 

Xklzw1-7.indd 55 


2021.4.19 3:05:01 PM 


信息可视化设计概论


图3-8 插图设计师张圣焕的海报《健康美味韩国泡菜》

信息图表的底部空间也很重要,设计师通常会在这里为读者提供更多的信息。对读者来
说,从上到下,从左到右就是视线浏览的方向。因此,该空间正好就为读者提供了“结论”。
与此同时,信息图表底部还可以加上读者感兴趣的其他信息:例如,商品购买或相关服务信
息,如网站链接、二维码或地址等;其他的内容,包括设计师的版权标注、公司信息以及签
名等。当然,商业或公益信息图表很少包含设计师或工作室的信息,底部空间可以用于放置
与商品相关的促销活动等信息。此外,图表的数据源备注文字也可以放在该区域。添加数据
源备注可以使该图表更具有说服力。

3.5 故事板与说明书设计
讲故事可以说是从古至今深深植根于人类的一种社会行为。讲故事的目的可以是社会
教化,也可以是讨论伦理和价值,或者是满足人们的好奇心。故事可以戏剧化地表现社会关
系和生活问题,传播思想或者演绎幻想世界。人们可以通过代代相传的故事传承知识。古希
腊哲学大师亚里士多德撰写了《诗学》,他认为故事是生活的比喻,是人类智慧本性所追求
的目标。故事这个功能一直延续到了现代社会。从心理学角度看,人类大脑都有追求逻辑和
意义的本能,这种因果关系就是故事的核心,也是可视化设计产品吸引读者或观众的目标。

56 

Xklzw1-7.indd 56 


2021.4.19 3:05:02 PM 


第3课
人类是情感动物,因此,故事和比喻是最能够打动人的沟通技巧。无论是广告、演讲,甚
至是PPT ,如果没有讲故事的技巧(如悬念设置、起承转合、层层推进),就很难吸引大家
的关注。例如,2019 年支付宝便结合中国古代著名神话故事《山海经》,推出了中国十大神
兽,而象征支付宝的小女孩还为了寻找爱心,与这些神兽们进行了幽默风趣的对话(图3-9, 
局部)。


图3-9 阿里集团结合中国古代神话传说推出的支付宝广告

在这几幅广告海报中,每只神兽代表的都是支付宝的一种功能,如刷码乘车的功能与青
狮形象结合起来,颇具有寓意。玄龟在中国古代历史中是高寿、稳当的象征。支付宝的刷脸
领社保的功能,巧妙地将关爱老人的思想和传统文化中的玄龟形象结合起来,让用户相信,
这就是一个非常安全稳当又方便老年人使用的产品。如今用户在使用支付宝的证件拍照功能
的时候,特别需要支付宝的一键美颜修复功能,海报中将这个功能与自带美艳和仙气的九尾
狐结合在一起,也算是非常贴合了。这个故事里一共出现了10 个支付宝的功能介绍,包括
刷码乘车、自拍证件照、刷脸领社保、器官捐献登记等,每一只神兽分别寓意着一种功能。
支付宝和古代神兽,看似相悖的两种实物,就这样巧妙地融合到一起。支付宝通过这样的方
式,为传统故事和产品增加了一层新的解读。

用系统的角度体察一个设计,最好的办法就是将其放入一个具体情境中,而不是对各种
要素进行分解。故事板原型(storyboard prototypes,SP)就是将用户(角色)需求还原到情境中,
通过角色、产品、环境的互动,说明产品或服务的概念和应用。设计师通过这个舞台上的元
素(人和物件)进行交流互动来说明设计所关注的问题。“角色”就是产品的消费者与使用者,
在设计过程中代表着真实用户的原型。在信息图表设计中,构建出设计的“情境与角色”有

57 

Xklzw1-7.indd 57 


2021.4.19 3:05:03 PM 


信息可视化设计概论

助于我们找到设计的落脚点,而不至于随着设计流程推进,最后迷失了方向。例如,基于车
载GPS 定位的导航App,就离不开场景(汽车)、人物(司机)和特定行为(查询)的功能设计。
图3-10 就是一款针对旅游导航的手机定位(GPS)、购物、景点推荐、导游等一系列服务
的App 设计的故事板,这个涉及角色、场景、产品、服务的漫画能够清晰地传达设计者的
意图。

图3-10 一款针对旅游导航App 设计的场景故事板
故事板设计也是技术插图、说明书和操作指南的表现形式之一。例如,欧美医院发给孕
妇的《婴儿护理安全手册》(图3-11 )就含有大量的说明插图。该说明书简洁清晰,美观幽默,
实用性强。不仅可以粘贴、悬挂,还可以折叠成三折页,方便读者随时查阅和阅读。在设计
风格上,这个说明书有着很强的叙事性、体验感和代入感,能够激发读者的求知欲和探索精神,
可以说是信息插图设计的一个标准的范本。
58 

Xklzw1-7.indd 58 


2021.4.19 3:05:05 PM 


第3课
图3-11 欧美医院的插画说明书《婴儿护理安全手册》(部分)

59 

Xklzw1-7.indd 59 


2021.4.19 3:05:06 PM 


信息可视化设计概论

3.6 数据图表可视化设计
虽然数据统计表是信息图表中至关重要的元素,但设计师并不需要从徒手绘制开始,而应
该尽可能使用专业图表软件,如微软Excel 等来创建。虽然软件所生成的数据图表往往是模板
化的,但设计师仍然可以从用户的角度审视这些图表,然后对其进行“清洗”或加工,使之更
符合读者的阅读习惯。一般来说,作为清理信息图表的原则,设计人员应尽量保持原始数据的
准确性,同时尽量减少读者的视线移动,让图表更易于理解和交流。设计师可以“再设计”软
件默认的图表颜色、间距和图例说明框等。例如,图3-12 显示的是2012 年美国人口普查的数
据,该图表是PowerPoint 默认模板的柱形图(左侧)。图例的颜色和文字说明了不同年龄组的
情况。多数图表软件都会自动生成图表图例,但往往不够简洁直观,读者不得不反复阅读才能
搞清楚,这就加重了读者的视觉负担。为了让这个图表变得更人性化,设计师去除了侧面的图
表图例,并将说明文字直接放置在柱形图下面,与相应的颜色对应。这样图表结构就大大简化了。
为了让图表的内容更加通俗,设计师还设计了5 组代表不同年龄段的人物图标,放置在原柱形
底部的位置上。经过设计后的数据图表不仅简约清晰,而且更加通俗易懂(图3-12 ,右)。


图3-12 美国居民构成数据图表(原始图表,左;修饰后的图表,右)

目前市场上所有的数据可视化工具中,最为用户熟知的就是微软的Excel 软件。与其他
定量分析工具相比,Excel 的最大优点就是其大众性和普遍性。目前市场上绝大多数业务图
表都是用Excel 制作的。几乎所有单位的财务部门或者管理部门都依赖Excel 制定各种定性
或者定量数据的电子表格。可以说Excel 就像处理数据的“万能瑞士军刀”。Excel 界面清晰

(图3-13)、上手容易,在表格制作、金融管理、自动处理与计算、数据管理等方面都有独到
之处。作为微软Office 办公套装软件的成员,Excel 与PowerPoint 、Word 兼容性使各类用户,
包括人力资源(培训)文员、IT 工程师以及普通用户都爱不释手。因此,Excel 是学习数据
可视化最基础也是最方便的软件工具。但Excel 仅仅是电子表格工具,主要面向销售和管理
人员而非设计人员。Excel 数据图表不仅模板匮乏,而且风格千篇一律,很难进行风格化或
个性化的设计。因此设计师需要对Excel 图表进行进一步视觉过滤和风格处理。更专业的数
据可视化工具,如Tableau 、ECharts 或R 编程语言,在模板类型、动态数据可视化、交互性
和风格定制等方面往往会更胜一筹。例如,ECharts 是一款由百度开发的基于JavaScript 的数
据可视化图表库,可以提供直观、生动、可交互、可个性化定制的数据可视化图表(图3-14)。
本书第12 课对此有更深入的介绍。

60 

Xklzw1-7.indd 60 


2021.4.19 3:05:07 PM 


第3课
图3-13 微软Excel 的界面和数据图表


图3-14 百度ECharts 数据可视化图表库

61 

Xklzw1-7.indd 61 


2021.4.19 3:05:07 PM 


信息可视化设计概论

3.7 设计思维与信息可视化
设计思维是一整套关于设计与创意的工作流程与方法。早在20 世纪80 年代,斯坦福
大学教授、著名设计师、设计教育家拉夫·费斯特就创办了斯坦福设计联合项目(Stanford 
Joint Program in Design )并鼓励通过“产教融合”和“学科交叉”来克服传统设计教育“闭
门造车”,理论不联系实际的弊端。1991 年,IDEO 设计公司创始人戴维·凯利开始在斯坦
福大学任教并逐步推广该公司所探索出的一套基于市场与实践的设计方法,也就是通常人们
说的“设计思维”(design thinking)。随后,在斯坦福大学的支持下,戴维·凯利和其他几位
斯坦福大学教授一起,在2005 年共同发起成立了哈素·普拉特纳设计学院(Hasso Plattner 
Institute of Design)。几乎同时,美国著名的卡耐基·梅隆大学商学院也把设计思维引入课程。
由此,设计思维开始在设计界、学术界引起广泛关注。在美国奥巴马政府时代,由于政府的
肯定和推广,该模式成为各大知名企业所普遍采用的创新方法。

1. 
设计思维的起源与特征
设计思维最初是源于传统的设计方法论,即需求与发现(need-finding)、头脑风暴

(brainstorming)、原型设计(prototyping )和产品检验(testing )这样一整套产品创意与开发
的流程。1991 年,IDEO 公司设计师比尔·莫格里奇等人在担任斯坦福大学设计学院教授时,
将这套设计方法整理创新成为交互设计的基础(图3-15)。莫格里奇等人将该方法归纳为五
类:同理心(理解、观察、提问、访谈),需求定位(头脑风暴、焦点小组、竞品分析、用
户行为地图等),创意,尝试或者观点(POV),可视化(原型设计、视觉化思维),检验(产
品推进、迭代、用户反馈、螺旋式创新)。其中,同理心(empathy )或者是与用户共鸣是问
题研究的开始,也是这个设计思维的关键。观察、访谈、角色模拟、情景化用户和故事板设
计是这一步骤所采用的主要方法。与此同时,VB 之父、Cooper 交互设计公司总裁艾伦·库
珀也将该方法总结为“目标导向设计”(goal-directed design)。


图3-15 斯坦福大学设计学院提出的“设计思维”流程

斯坦福大学的“设计思维”,其核心是以人类学、人种学和社会学所构建的“田野调
查”的研究实践为基础,通过观察、访谈、记录和分析推理得出有价值结论的过程。田野调
查(fieldwork )就是研究者亲自进入某一社区,通过直接观察、访谈、居住体验等参与方式
获取第一手研究资料的过程。该方法在19 世纪早期西方探险家或殖民者对非洲、亚洲和太
平洋岛屿国家土著居民的研究中被广泛采用,并成为一整套行之有效的科学研究方法。2004 
年,英国设计委员会(Design Council )提出了双钻石设计流程模型(double diamond design 

62 

Xklzw1-7.indd 62 


2021.4.19 3:05:07 PM 


第3课
process,4Ds ,图3-16)。它反映了在设计过程中思维发散与收敛的过程。该流程强调前期研
究的重要性,并在此基础之上得出最终的解决方案。因为这样的方案是经过了精挑细选、反
复对比和仔细验证,因此能确保产品投入市场后不会有太高的风险。英国设计协会将该设计
过程分为四个阶段:“探索”“定义”“发展”和“执行”。该流程可以归纳为:发散思维,创
造情景;聚集问题,甄选方案;创意思考,视觉设计;迭代模型,深入设计。前面是确认问
题的发散和收敛阶段,后面则是制定与执行方案的发散和收敛阶段。该流程并非是以线性思
维的方式展开,而是一个将发散思维进行不断收敛的过程。


图3-16 英国设计委员会提出的“双钻石设计流程图”

双钻石模型强调4 个基本宗旨:从用户出发,分析思维与直觉思维相结合,发散—收敛
的创意方法以及团队协作模式。该过程是左脑(聚拢)与右脑(发散)不断碰撞、迭代和激
荡的循环过程,符合大脑创意的规律。由于是发散思维与聚合思维的结合,所以就形成了一
个波浪状的“菱形”设计流程。

设计思维还鼓励用户自己探索,而不是仅仅依赖二手资料或者书本知识。如费城自然历
史博物馆的工作人员在为小学生讲解古代埃及木乃伊的来源及宗教文化时,借助一具麻布人
偶的“木乃伊尸体”,让小学生仿造古人,自己动手尝试把各个人体器官(如舌头)放到不
同的储存罐中(图3-17)。这种有意识的主动探索,不仅使得学生们印象深刻,而且通过这
个操作过程,使学生理解了古埃及的神秘文化,如保存尸体不腐的方法和技术,以及死而复
生的循环宇宙观。

2. 
设计思维与信息可视化设计
对于信息可视化来说,设计思维最大的价值在于提供了一套方法论。认知心理学研究表
明,人的学习或知识构建不是一次完成的。而是不断由浅入深、由表及里、层层深入的一个
迭代建构过程。从整体到细节,从规划到设计,信息可视化的全部过程都需要设计团队对主
题进行深入挖掘。设计思维指明了设计师与潜在用户(读者)沟通和交流的重要性。通过换
位思考与共情意识,设计师可以更深入地把握人性,从而让可视化产品更易于理解,更容易

63 

Xklzw1-7.indd 63 


2021.4.19 3:05:08 PM 


信息可视化设计概论

图3-17 博物馆员工为小学生示范和辅导的“木乃伊制作课”
Xklzw1-7.indd 64 

被观众所接受。因此,在信息图表的设计进程中,设计师需要用设计思维的观点,时刻提醒
自己注意以下问题:

① 
该信息可视化设计的主题是什么? 
② 
该信息图表中需要展示的数据参数有哪些? 
③ 
该信息图表需要重点强调哪些部分,舍弃哪些部分? 
④ 
该产品是否具有美感和吸引力,是否符合5 秒规则?
⑤ 
该图表展示的内容是否太复杂或太抽象?
⑥ 
可视化产品表达的信息是客观的,还是作者主观的? 
⑦ 
信息图表是否做到了简洁清晰、完整生动?
⑧ 
图表的数据对比是否阐明了趋势或意义?
2010 年,由德国“愉快杂志”编著的《众妙之门:网站UI 设计之道》(贾云龙和王士强译,
人民邮电出版社)指出:所有伟大的可视化设计和用户界面大都具有简洁化和清晰化的特征。
简洁化的关键在设计师对信息“度”的把握。例如,由中央美院学生创作的一幅20 世纪90 
年代照片拼贴画(图3-18,小图1~4)就生动说明了细节与整体这种“远观近赏”的辩证关系:
细节(小图1)是可视化作品“耐看”的核心,而“远观”(小图4)是读者第一眼判断该作
品是否具有“可读性”的关键。由此,这幅图像通过视错觉设计,使观众在貌似杂乱的照片
中解读出了时代的群像。

64 


2021.4.19 3:05:09 PM 



第3课
图3-18 中央美院学生创作的一幅20 世纪90 年代照片的拼贴画(整体和局部)

设计思维的另一个价值在于鼓励设计师去了解一个问题的产生根源,而不是马上拿出解
决方案。例如,文盲和青少年失学表面上看是教育的问题,而底层的原因则是与社会不公、
愚昧、贫穷等问题联系在一起。因此,设计思维鼓励团队从社会学的角度看待问题。来自不
同背景的团队成员彼此包容,相互欣赏,借助一系列团队集体智慧的方法迎接问题的挑战。
例如,斯坦福大学在2015 年暑期组织了“设计思维:提高文盲的日常生活经验”的国际工作营。
一些来自美国、瑞典、尼日利亚、博茨瓦纳、南非、瑞士、希腊和埃及的40 名学生、教练
以及合作机构的成员参加了这个活动。他们在随后的2 周聚集在一起并组成了几个研究团队。
为了通过新技术实现创意,这些小组分别通过不同的角度思考,大家一起共同寻找创新的解
决方案。其中,思维导图和可视化原型设计是其中最为重要的环节之一(图3-19)。

65 

Xklzw1-7.indd 65 


2021.4.19 3:05:09 PM 


信息可视化设计概论


图3-19 斯坦福大学暑期组织的设计思维工作营现场

3.8 信息可视化的呈现方式
美国纽约大学教授、新媒体理论权威列夫·曼诺维奇曾经指出:“19 世纪的‘文化’是
由小说定义。20 世纪的‘文化’是由电影定义。而21 世纪的‘文化’将会由交互界面定义。
” 
曼诺维奇以敏锐的视角,准确把握了当代文化与艺术的核心。当代文化在今天最突出的特征
就是互联网和数字媒体的无孔不入——从艺术实践、社会理论到日常语言。例如,10 年前当
你看不清一张信息图表的时候,你会本能地将杂志或报纸凑近你的脸,而今天当你看不清一
张手机图像的时候,第一个收到神经信号的恐怕是你的拇指和食指。因此,信息可视化作品
的展示、传播与推广,同样需要与时俱进,采用更贴近时代的呈现方式。例如,美国克利夫
兰艺术博物馆就将数字媒体技术与该馆丰富的馆藏结合起来,让观众通过的“指尖”来搜索
和浏览各种藏品,并借助手机对藏品进行深度解读。2017 年,该博物馆为观众开放了一座
长达12 米的大型多点触控墙(ArtLens)。这个4K 的屏幕每隔40 秒就刷新一次所显示的内容,

66 

Xklzw1-7.indd 66 


2021.4.19 3:05:10 PM 


第3课
并通过类型、主题、形状和颜色等方式分类显示馆藏艺术品。观众可以自己探索和选择各类
馆藏艺术作品,并了解这些不同文化和不同时期的艺术品之间的联系(图3-20)。这种交互
式体验设计已经成为信息可视化的新舞台。


图3-20 克利夫兰艺术博物馆的大型高精度触摸屏(ArtLens)
ArtLens 触摸屏共有4000 余件馆藏艺术品的缩略图,总像素超过2300 万。观众可以轻
触图标放大艺术品,或按照主题搜索相关的艺术品。此外,观众还可以下载ArtLens App,
将博物馆的收藏、自己互动体验的照片和拍摄的画面记录下来。该App 甚至可以自动生成“游
67 

Xklzw1-7.indd 67 


2021.4.19 3:05:10 PM