图表设计的文章汇总

和大数据相关的产品经常会和图表打交道,当有些问题反复出现的时候,我会想找一些guideline类型的文章来做一个简单的指导。

虽然我们设计小哥说这个不适合做guideline,但我觉得能有一篇文章介绍一些基本方法和原则,总胜过反反复复琐琐碎碎(但我知道依然不可避免)。

关于图表的选用和表现,我依稀记得这本书讲得比较清楚:谁说菜鸟不会数据分析,我做过纸质读书笔记,有空会整理一下。那么既然还没有整理笔记,也没有找到一篇集大全的文章,因此就试整理几篇我觉得比较不错的。

以下以引用为主,链接即原文。在正文开始前我想说(哦好像前面太啰嗦了),设计完图表后,不妨想象,如果一个注意力并不集中、并不耐心的用户(比如你日理万机的老板?)读到你的几篇图表,Ta能get你珍贵的数据、独特的思路吗?你要通过图表,引导ta做什么?

在实际项目中我还遇到过四五张图表非常接近,很容易让人走神,这个部分我还没整理到,会继续思考的:)

一、选用合适的图表


数据可视化的方法有很多种,可视化专家Andrew Abela 认为可视化方法大致可分为6大类数十种方法,譬如数据可视化、信息可视化、概念可视化、战略可视化、象征可视化、复合可视化。


图表设计的文章汇总_第1张图片
可视化专家Andrew Abela的图表建议


关于数据图表的那些知识


图表设计的文章汇总_第2张图片
不同图表用于表达不同维度的信息



图表设计的文章汇总_第3张图片
气泡图是散点图的一种变体,通过每个点的面积大小,反映第三维。

气泡图是散点图的一种变体,通过每个点的面积大小,反映第三维。

卡特里娜飓风的路径,三个维度分别为经度、纬度、强度。点的面积越大,就代表强度越大。因为用户不善于判断面积大小,所以气泡图只适用不要求精确辨识第三维的场合。

如果为气泡加上不同颜色(或文字标签),气泡图就可用来表达四维数据。比如下图就是通过颜色,表示每个点的风力等级。

二、关于图表的细节


可视化图表表达的10个错误

经典,完整原文:Data_Visualization_101_How_to_Design_Charts_and_Graphs.pdf

让数据变有趣!如何设计实用易读的图表(上)

三、关于表格的细节


数据可视化:提高表单可读性的一些技巧

1. 根据表格的用途,设计表格的布局


图表设计的文章汇总_第4张图片
按照一定逻辑设计图表布局


2. 减少读者计算

3.精简指标,创造信息层级

4.不留空白单元格

5.斑马条的运用

横向或纵向的斑马线以及悬停高亮底色能够很好的引导用户的视线,避免在阅读时出现错行、迷失的情况:斑马线会使得行与行的界限更为分明,尤其对数据列较多时的横向引导得到加强,这样看行内的内容时不容易错行,而悬停变色行主要是配合操作交互,明确区分出光标所在的行。


图表设计的文章汇总_第5张图片
表格、较多数据的柱状图可以考虑斑马条的运用

6.高亮重点信息,提高阅读速度

7.对齐,便于用户快速浏览

8.设计视觉层级,引导读者视线


图表设计的文章汇总_第6张图片
设计视觉层级,引导读者视线

9. 坚持使用简单的矩阵布局,尽量减少视觉噪音



图表设计的文章汇总_第7张图片
每一格的外框构成了不必要的视觉噪音

你可能感兴趣的:(图表设计的文章汇总)