从丁香园疫情地图,想到的一些图表设计经验
春节期间和家人、朋友交流时,截了一些新冠肺炎疫情地图的图片。现在回看这些截图,有了一些有趣的想法。
现在把关于图表的想法记录下来。
文中所有图片,都来自丁香园新冠肺炎实时疫情地图的截图。
简单
图表越简单越好。
复杂与酷炫的设计,除了增加理解负担,对于数据的分析与理解往往并无助益,有时还会造成误解。
比如疫情数据的累积趋势,在丁香园疫情地图的早期版本中,采用的是堆积图:
最初是堆积柱形图 大概柱形图不够炫,或者趋势表达不明显,换成了堆积面积图当有多个数据需要对比,并且希望展示总数的变化时,堆积图是不错的选择。
就如以上两图,在一个图表中就能展示疑似、确诊、总数之间的比例关系和变化趋势。
对于能够理解堆积图的人来说,十分直观。
但是,并不是所有人都能理解堆积图,特别是这个疫情地图的读者,是数千万的普通民众,除了这次,可能一辈子都不会再和图表有任何关系。
如果无法理解,那么这张图表就是多余的,对读者没有任何价值。
好在,丁香园后来意识到了这个问题,将堆积图换成了更容易理解的折线图。
3根折线似乎有点繁琐,但这种方式更加亲民,数据趋势一目了然。
变化
日常作图,往往是依据现有的、静态的数据。
数据是不变的,图也是不变的。
但是,如果数据会随时间变化,那么图表也会随时间变化。
这几乎是废话,但很多人想象不了今天以后的事情,设计出的图表在当时十分完美,数据变化一段时间后,就变得难以理解。
比如,全国疫情死亡/治愈的累积趋势图,在2月2日之前,就有了两次交叉:
或者,全国疫情新增趋势图,确诊与疑似数据多次重合,确诊数据还有异常变化:
如果上面的图表不是用的折线图,而是其它图表形式,比如堆积图来做,在数据发生交叉、重合、异常时,理解起来会更加困难。
当然,死亡和治愈、确诊和疑似并不是可以堆积的数据,但我确实见过很多实时图表用堆积图、面积图、箱型图甚至多种样式叠加,有的还要加上七彩的颜色。
除了色彩丰富,毫无用处。
如果是会变化的图表,样式也是越简单越好。
成熟的推广、分析工具的后台,数据图表往往是简单的折线图。并非不能酷炫,而是这样效率最高。
因为谁也不知道明天的数据是怎样的,图表又会变成什么样。
迭代
最初的疫情数据维度很少,只有疑似/确诊、死亡/治愈的累计趋势图。
随着疫情发展,能够统计到的数据越来越多,需要展示的数据维度也越来越多。
这时,图表也需要跟随需求进行迭代。
比如丁香园的疫情地图,从最初的2张图表,变成了国内(5张图表)、湖北/非湖北(5张图表)、国外(4张图表)、重点国家(8张图表)。
为了配合图表数量的增加,页面的布局也在一直变化。
之前,是上下并列的两张图表:
现在,是上下并列的两组图表,通过滑动或tab切换:
迭代的目的,是为了更好的展示和分析数据。
很多人喜欢沿用前人的图表、表格,而不是根据当前的实际业务需求对图表进行迭代,这是很懒惰的行为。
每张图表,都有其适用的数据和时段,反之亦然。
适用条件变化了,图表也要变化。
分解
数据的权重,往往是不同的。
如果部分数据对整体变化影响很大,那么只看整体的数据,就无法做出正确的判断和分析。
这时,需要将不同维度的数据分解开,才能更好的看清数据。
比如全国疫情病死率趋势图:
如果单看全国的数据,似乎维持在2%以上,且增速很快。
但分开湖北、非湖北,就会发现全国数据受湖北数据影响非常大。毕竟湖北的病患数量远超其他地区。
平常工作中也会按产品、用户、地域等维度对数据进行分解,找出影响最大的维度,才能事半功倍的解决问题。
颜色
图表颜色似乎不是很重要,但用的不好很影响阅读。
比如最初的疫情地图,划分了7个层级的数据,用红色渐变色填充:
由于颜色十分接近,字体也都是灰色,导致除了最深和最浅的区域,其他区域很难识别。
现在的版本对填充颜色、字体颜色都做了调整,地图看起来更加清晰,更易识别:
平常做图表,Excel或者PPT默认的颜色足够用了,比较少考虑颜色的事情。
但是像疫情地图这样,确实是同色渐变色更适合,这样也更考验设计师的能力了。
如果区分不开,就要减少数据的层级了。
丁香园的疫情地图更新了蛮多版本,可惜截图太少,不然分析下历次调整,也是有意思的事情。