美文网首页
从丁香园疫情地图,想到的一些图表设计经验

从丁香园疫情地图,想到的一些图表设计经验

作者: 小曹同学 | 来源:发表于2020-03-03 22:23 被阅读0次

    春节期间和家人、朋友交流时,截了一些新冠肺炎疫情地图的图片。现在回看这些截图,有了一些有趣的想法。

    现在把关于图表的想法记录下来。

    文中所有图片,都来自丁香园新冠肺炎实时疫情地图的截图。

    简单

    图表越简单越好。

    复杂与酷炫的设计,除了增加理解负担,对于数据的分析与理解往往并无助益,有时还会造成误解。

    比如疫情数据的累积趋势,在丁香园疫情地图的早期版本中,采用的是堆积图:

    最初是堆积柱形图 大概柱形图不够炫,或者趋势表达不明显,换成了堆积面积图

    当有多个数据需要对比,并且希望展示总数的变化时,堆积图是不错的选择。

    就如以上两图,在一个图表中就能展示疑似、确诊、总数之间的比例关系和变化趋势。

    对于能够理解堆积图的人来说,十分直观。

    但是,并不是所有人都能理解堆积图,特别是这个疫情地图的读者,是数千万的普通民众,除了这次,可能一辈子都不会再和图表有任何关系。

    如果无法理解,那么这张图表就是多余的,对读者没有任何价值。

    好在,丁香园后来意识到了这个问题,将堆积图换成了更容易理解的折线图。

    3根折线似乎有点繁琐,但这种方式更加亲民,数据趋势一目了然。

    变化

    日常作图,往往是依据现有的、静态的数据。

    数据是不变的,图也是不变的。

    但是,如果数据会随时间变化,那么图表也会随时间变化。

    这几乎是废话,但很多人想象不了今天以后的事情,设计出的图表在当时十分完美,数据变化一段时间后,就变得难以理解。

    比如,全国疫情死亡/治愈的累积趋势图,在2月2日之前,就有了两次交叉:

    或者,全国疫情新增趋势图,确诊与疑似数据多次重合,确诊数据还有异常变化:

    如果上面的图表不是用的折线图,而是其它图表形式,比如堆积图来做,在数据发生交叉、重合、异常时,理解起来会更加困难。

    当然,死亡和治愈、确诊和疑似并不是可以堆积的数据,但我确实见过很多实时图表用堆积图、面积图、箱型图甚至多种样式叠加,有的还要加上七彩的颜色。

    除了色彩丰富,毫无用处。

    如果是会变化的图表,样式也是越简单越好。

    成熟的推广、分析工具的后台,数据图表往往是简单的折线图。并非不能酷炫,而是这样效率最高。

    因为谁也不知道明天的数据是怎样的,图表又会变成什么样。

    迭代

    最初的疫情数据维度很少,只有疑似/确诊、死亡/治愈的累计趋势图。

    随着疫情发展,能够统计到的数据越来越多,需要展示的数据维度也越来越多。

    这时,图表也需要跟随需求进行迭代。

    比如丁香园的疫情地图,从最初的2张图表,变成了国内(5张图表)、湖北/非湖北(5张图表)、国外(4张图表)、重点国家(8张图表)。

    为了配合图表数量的增加,页面的布局也在一直变化。

    之前,是上下并列的两张图表:

    现在,是上下并列的两组图表,通过滑动或tab切换:

    迭代的目的,是为了更好的展示和分析数据。

    很多人喜欢沿用前人的图表、表格,而不是根据当前的实际业务需求对图表进行迭代,这是很懒惰的行为。

    每张图表,都有其适用的数据和时段,反之亦然。

    适用条件变化了,图表也要变化。

    分解

    数据的权重,往往是不同的。

    如果部分数据对整体变化影响很大,那么只看整体的数据,就无法做出正确的判断和分析。

    这时,需要将不同维度的数据分解开,才能更好的看清数据。

    比如全国疫情病死率趋势图:

    如果单看全国的数据,似乎维持在2%以上,且增速很快。

    但分开湖北、非湖北,就会发现全国数据受湖北数据影响非常大。毕竟湖北的病患数量远超其他地区。

    平常工作中也会按产品、用户、地域等维度对数据进行分解,找出影响最大的维度,才能事半功倍的解决问题。

    颜色

    图表颜色似乎不是很重要,但用的不好很影响阅读。

    比如最初的疫情地图,划分了7个层级的数据,用红色渐变色填充:

    由于颜色十分接近,字体也都是灰色,导致除了最深和最浅的区域,其他区域很难识别。

    现在的版本对填充颜色、字体颜色都做了调整,地图看起来更加清晰,更易识别:

    平常做图表,Excel或者PPT默认的颜色足够用了,比较少考虑颜色的事情。

    但是像疫情地图这样,确实是同色渐变色更适合,这样也更考验设计师的能力了。

    如果区分不开,就要减少数据的层级了。

    丁香园的疫情地图更新了蛮多版本,可惜截图太少,不然分析下历次调整,也是有意思的事情。

    相关文章

      网友评论

          本文标题:从丁香园疫情地图,想到的一些图表设计经验

          本文链接:https://www.haomeiwen.com/subject/dijllhtx.html