To B 端 Dashboard 设计方法

怎样用最精确的媒体来清楚、立即地传递数据信息和其所表明的信息?Dashboard能够帮上你。

To B 端 Dashboard 设计方法

一、Dashboard的含意

初期dashboard就是指轿车等商品上的信息控制面板,汉语英译名即车内仪表盘。

To B 端 Dashboard 设计方法

在Mac的OS系统软件内,dashboard就是指包括各种小widget的控制面板。

To B 端 Dashboard 设计方法

现阶段大家说的dashboard沿袭了汽车仪表板的关键定义——根据数据图表、列表等形式,立即、高效率、精确地为用户传送关键信息。

在dribble等网址上能够搜到许多 著作(如下图)。但是除非是是用以对外开放展现,不然dashboard的形式无须尤其绮丽。

由于针对To B用户来讲,它的关键自始至终是传送信息。页面上的內容都需有存有的原因,一些附加的装饰设计很有可能会导致影响。

我们要做的事儿是:少做没意义的事儿,多把有效的信息展现并显出出去。

To B 端 Dashboard 设计方法

二、设计方案流程

设计方案dashboard时,能够依照下列四项持续推进:

To B 端 Dashboard 设计方法

2.1 用户情景

开展用户情景剖析时,必须确立“用户”和“每日任务”“数据信息內容”这三个因素。

用户必须根据(检测、剖析、评定)內容去进行(一些特殊的)目地。

To B 端 Dashboard 设计方法

针对用户:必须掌握其真实身份、在企业内的岗位、工作职责等。

针对目地:必须搞清是啥开启了用户应用dashboard的个人行为?用户浏览dashboard的原因是什么?为了更好地做到目地必须以哪些頻率浏览dashboard?

针对內容:必须搞清楚用户应用dashboard后必须作出什么决策?什么重要信息輔助自身作出决策?有什么状况必须提示用户等。

2.2 展现形式

依据数据信息內容挑选不一样形式或形式组成,比如dashboard内常见的数据图表、报表或列表等。在其中,数据图表的特性是能够便捷看得出发展趋势可是无法数据库索引 ,报表与列表相反。

另外,并并不一定內容必须以数据可视化的形式呈现,只数据可视化必需并且能快速看得出眉目的物品。

有关数据图表形式,印像中初中的数学课就早已详细介绍过,在这里也不过多阐释了。必须尤其表明几个方面关键点难题,信息设计方案大神Stephen Few在他的《information Dashboard Design》一书里有提及:

  • 人针对总面积和视角的敏感性比不上对长短的觉得。饼状图一般并不是一个好的挑选,除非是很注重个人在总体中的占比,这时还可以用沉积条形图;
  • 人针对横着长短的敏感性又高过竖向;
  • 三维的数据图又提升了深度的层面会危害阅读文章和记忆力;
  • 要保证数据图表上每一个清晰度全是有效不不必要的,一般曲线或柱形图早已充足用了。

2.3 数据信息排列

要根据对业务流程的掌握、对用户的采访等对页面内各类內容的必要性开展区别。用户务必见到或是务必去做的事儿要放到显眼的部位,或是要给予明显的视觉效果暗示着,防止用户由于数据信息的不值一提而错过了关键信息。

ToB商品内涉及到的数据信息信息一般也许多 ,要对各一部分內容开展有逻辑性地排序。在排版设计上给予用户排序的暗示着,让用户能更迅速精准定位到必须的信息。在《Information Dashboard Design》这本书里,创作者也在一直注重,设计方案dashboard即要让关键的信息一目了然。(有关数据信息排列的一部分,还会继续再写一篇格式塔社会心理学的运用~以后相赠)

10.31升级:

数据信息排列关键牵涉到三个社会心理学小常识:格式塔标准、短时记忆和奇妙的X

2.3.1 格式塔标准

设计方法上,运用视觉效果认知的格式塔标准能够更有效地开展排列,便于用户高效率获得信息。实际能够应用到以下几个方面:

贴近性

一般大家觉得相互挨近的物件是归属于同一组的。这个是非常简单常见的排序的方法。

To B 端 Dashboard 设计方法

另外,能够灵便运用空格符来正确引导用户访问 数据信息的方位。下面的图是创作者在书里的事例,能够感受到由于间隔的不一样,会全自动产生不一样的访问 次序。
To B 端 Dashboard 设计方法

相似度

相似度 – 大家趋向于将尺寸、样子、色调、方位等一致的原素归到一组。能够根据这种特点来区别这种数据信息的结合,或是提升某一数据信息的结合。在我们要想主要表现的原素在dashboard中迫不得已分散化的情况下,可以用相似度来提升相互的联络。

To B 端 Dashboard 设计方法

封闭型

视觉效果界限使大家将物件归到一组。根据应用界限,不论是色调添充還是外框,能够选定出一个地区,它是最立即合理的对信息开展排序的方法。

To B 端 Dashboard 设计方法

创伤性

许多 情况下大家会将对外开放的/不详细/不普遍的构造视作合闭的/详细的/基本的。这一标准有利于降低dashboard内视觉效果原素的总数。

持续性

假如数据信息是持续出現的,那非常容易觉得他们是做为一个总体的一部分,邻近的数据信息是相互的持续。用这一基本原理来展现数据信息中间的关联,也可降低类似网格线那样的视觉效果原素。

2.3.2 短时记忆

短时记忆(STM)存储的是当今全新的工作经验或思考內容,是不久造成的记忆力。信息进到短时记忆,大家能够不费力气地追忆起來,但这类记忆力的容积十分比较有限。

在开展信息设计方案时,为了更好地提高短时记忆,能够从视觉效果上对数据信息开展生产加工。比如应用色调( 融合色度与对比度)、室内空间部位、外观设计(方位、长短、尺寸、样子、标识等)、也有健身运动等。这种都可以用以dashboard来加强排序或注重某信息。这种特点不仅能让用户注意到该信息,还能够让用户对该信息的印像更加深入。

除此之外,影响信息很有可能会切断当前任务,并危害短时记忆。能够根据减弱影响的方法来缓解其危害,比如将弹出窗口情况改成非多形式;或是变换影响的形式,用不一样的感观方式展现不一样的信息,比如免费下载结束的语音提示,对视觉效果信息也不会有过少影响。

2.3.3 奇妙的X

奇妙的7(Magic 7)就是指人的短时记忆是有局限的,可以记牢的控制模块限制一般为7±两个。

这一基础理论由G.Miller在1959年明确提出,文化教育和设计方案行业都是有许多 运用。比如在教育行业中,我们在背单词时,能够将长单词区划为好多个小控制模块开展记忆力。在设计方案行业中普遍的事例是手机号码。假如立即显示信息十一位数据,既不利鉴别,也不利记忆力。iPhone就选用了xxx xxxx xxxx的形式开展展现,易读性提高,记忆力难度系数减少。自然,344的区划构造我想很有可能和营运商与号码归属也是有关联,应该是综合性考虑后的結果。

Magic 7是广为流传较为普遍的一种叫法。搜索了一些材料后发觉,实际上学术界有些人明确提出了更进一步的见解,将短时记忆的容积精准定位在4个控制模块上下。实际到个案得话,每一个组块所包括內容的复杂性、间接性影响等对记忆力的难度系数都是会有影响。但总体来说,在开展信息设计方案时,能够尝试将关键的控制模块操纵在4个上下,以得到 更强的信息传递实际效果。

2.4 交互技术

在进行之上两步后,必须依据內容优化交互技术。

比如信息关联是不是有等级?如果有,那麼是用哪种形式去呈现这一等级,往下拉列表還是弹出窗口?依然会在数据图表内有进一步的互动姿势(如下图)?

To B 端 Dashboard 设计方法

有什么內容必须开展表明或是提示?选用hover還是toast?

类似控制的交互技术是不是保持一致?

……

三、总结

总得来说,dashboard是与用户开展信息展现与沟通交流的媒体,得用最精确的媒体来清楚、立即地传递数据信息和其所表明的信息。

Steven Few在书里明确提出,点评dashboard的优劣需看其机构是不是有效、內容是不是简约、对相对用户人群或行业是不是有目的性的订制化內容。我们在设计方案时还可以参照下这种规范。

Reference:

Stephen Few. (2006). Information Dashboard Design.

George Miller. (1956). The Magical Number Seven, Plus or Minus Tow: Some Limits on our Capacity for Processing Information

Nelson Cowan. (2001). The magical number 4 in short-term memory: A reconsideration of mental storage capacity

Mike Hughes. Dashboard Design 10.

原创文章,作者:纳点网,如若转载,请注明出处:https://na.wang/zx/yytg/id/6478.html