发布时间：2022-4-24 分类： 电商动态
文章从四个方面进行了介绍，并对图表设计进行了总结，希望能为您带来灵感。
在使用产品期间，用户将暴露于大量数据。实际上，数据是用户的单词和数字的组合，并且大脑以较慢的速度处理纯文本。例如，让我们看一下球队的技术统计数据，场均得到116.7分，28.3次助攻，45.0个篮板和平均值;这些数字对我们来说很冷淡，很难快速理解它的含义。
图表的外观可以帮助我们可视化数据并提高数据的可读性。因为用户处理图形信息的速度比纯文本快得多。
这里我们使用雷达图表，团队的主要统计数据一目了然。
常见图表类型
那么我们如何设计一个令用户满意的图表呢？要回答这个问题，我们首先需要知道今天常见的图表类型。
折线图，图表，饼图，环形图，条形图，雷达图，地图等可以说是我们目前最常见的图表样式。具体到每种类型的数据适用于图表的表现，我在这里不多说，数学老师应该说今天主要是图表设计。
我们可以从以下四个维度剖析图表设计：可读性，一致性，视觉层次和美学。
可读性
图表设计的初衷是释放用户的海量数据，图表需要帮助用户更好地读取数据，所以在这里我把可读性放在图表设计的顶部。
图表的可读性主要关注以下三点。颜色，文字和群组。
颜色匹配
图表的颜色方案主要是背景颜色。一般来说，图表的背景颜色可分为深色和浅色。具有浅色背景的图表更有利于用户阅读并且可以有效地提高数据的可读性。
有人可能会问，既然浅色背景更有利于阅读，那么我们可以直接得出“图表背景总是使用浅色”的结论，我们为什么要考虑暗色呢？
那是因为某些界面内容太小，为了使界面看起来不那么单调，我们将使用深色背景。由于界面本身的内容很小，用户可以一目了然地阅读它，因此深色背景对可读性几乎没有影响。但我们必须记住，当数据太多时，必须使用浅色背景。
文本
对于信息的读取，图表可以快速但不准确，这是具有文本描述的图表的含义。
文本的可读性主要体现在字体（衬线字体和非衬线字体），字体大小，颜色匹配和排版上。以排版为例，用户的阅读习惯是从左到右，从上到下，这也是我们常说的Z型阅读模式。在此模式下，左对齐文本布局非常有用，用户可以无意识地返回段落的左端开始读取新行。居中和左对齐使得段落的每一行的左端的位置不同。用户每次都应该有意识地寻找起始位置，阅读会很累。
上面提到了用户的浏览习惯，然后与你分享另一个容易忽视的用户浏览习惯。在设计饼图时，最大份额应放在12点位置，因为用户习惯于从12点位置浏览。其余部件按顺序从大到小顺时针顺时针方向排列。
组
该组的设计概念类似于卡片设计，即将信息分开以使用户更容易消化。以传递函数为例。对于收款人信息，我们可以使用左侧的列表样式逐一显示。事实上，这不是一个大问题，而且也没有问题。然而，这种显示意味着所有信息都没有任何优先级地发布，并且用户不能清楚地区分优先级。在该界面中，用户最关心收款者信息，并且用户对收款人信息的关注又是收款人姓名>付款帐户>开户银行。如果使用左侧的列表样式，则无法反映优先级维度。
然后我们可以对信息集成进行分组，整合收款人姓名，帐号和银行账户，并使用该图标帮助用户快速找到关键信息并提高阅读速度。
稠度
产品中肯定有多个图表。为了消除不同类型图表的认知负担，我们可以通过在图表中添加相同的设计元素来建立图表的一致性原则。这些相同的设计元素可以是背景颜色，排版，标题样式等。
以咕咚为例，这里出现的几种图表样式相对统一。
视觉水平
不同的数据具有不同程度的重要性。我们可以通过颜色匹配，分组，字体，间距等来分离图表的视觉层次结构，这有助于用户直观地判断数据的优先级。
与浅色相比，深色背景对用户更具吸引力。
美学
事实上，如果图表能够满足上述三个条件，可以说它是相当不错的，但我们必须进一步从美学的角度升级图表。一张好的图表应该是美观的，最好是有趣的，独特的元素。这将吸引用户的注意力，让他们想看看他们是什么。当您看到特殊的图表样式时，用户甚至会分享它。 “跟随NBA”是一个非常好的例子。
现在我们可以看到一些图表会引入一些效果，效果可以美化界面。有趣的效果也可以作为娱乐用户，但效果会降低加载速度。例如，下面的电子收据动画，这个动画看起来很酷，但它的存在使得用户需要4秒才能看到交易细节。这段等待时间显然超出了用户的期望。所以在动态效果的使用中，我们必须找到一个平衡点。
总结
这是我从可读性，一致性，视觉水平和美学四个方面对图表设计的总结。我希望它可以帮助每个人。每个人都有任何问题和想法，欢迎留言。
