淘宝网赚项目,5个步骤,教你完成优异的Dashboard设计

数据可视化一直是设计师的一项要害技术。我们将一些简朴的事情可视化,好比本周我们在咖啡上花了多少钱,或者这个月我们离减肥目的有多近。像这样的简朴可视化可以作为图表插入到其他屏幕中,然则当数据加倍庞大时,显示内容通常会酿成Dashboard。(但也许更主要的是)事实什么是Dashboard?

我听过一些有趣的谜底……从“任何带有图表的页面”到“用户构建自己的UI的方式”的所有内容。这些都有些极端,然则互联网上有一些好的界说(以及一些糟糕的界说)。

我小我私家最喜欢的是斯蒂芬·福(Stephen Few)的说法:

“Dashboard是实现一个或多个目的所需的最主要信息的可视化显示;整合并排列在统一屏幕上,这样信息就可以一目了然。”

为什么要这么界说?由于,它不仅抓住了Dashboard具有数据的可视化显示的特点,而且该视觉显示还具有明确的目的或价值。

我看到的最常见的错误是,设计者们确立Dashboard的愿望是从做一个看起来不错并铺满页面的器械最先,然后再实验将功效放上去。从Dribbble上漂亮的Dashboard最先,希望你能获得一个有用的界面,这是灾难的窍门(一个优美的灾难,但仍然是一个灾难)。

为什么Dashboard很主要?

我们使用Dashboard辅助用户快速评估状态,并确定在响应时需要做什么。Dashboard的可用性实际上可以说是服务可用性的小幅度下降影响营业底线的周全中止之间的区别。

在已往的四年中,我一直是VMware操作软件的设计负责人,在那里我为多个产物设定了设计偏向,包罗vRealize操作治理器, vRealize Log Insight和Wavefront by VMware 。每一个都包罗某种自界说Dashboard功效。我团队中的设计职员建立了Dashboard,辅助用户战胜大规模且经常是无序的数据的庞大性。

这些产物被软件开发职员和IT专业职员用来治理和操作世界上一些最主要的应用程序,对这些用户来说,剖析数据所需的时间不仅主要,而且至关主要。

优异Dashboard设计的5个步骤

虽然我确信有许多差别的方式,但以下步骤反映了我通常若何处置已确定需要Dashboard的项目。当我在VMware设计Dashboard时,我发现这些步骤很有辅助,我希望其他人也以为它们有用。

1. 明确用户及其目的

作为设计师,我们知道我们不是为自己设计软件,而是为用户设计软件。就像应用程序的其他任何部门一样,Dashboard应专注于知足用户需求。这意味着我们首先需要确定Dashboard是给谁用的。

打个譬喻,汽车的仪表盘是围绕驾驶员所需的器械构建的。若是你是为搭客而构建的话,则发动机RPM之类的器械可能并不主要,然则无线广播在放哪个电台就变得至关主要。这是对特定用户来说主要的事情。

其次,我们需要领会他们在这种情况下的目的是什么。他们是驾驶员试图把车从A点开到B点,照样搭客试图为公路旅行选择合适的歌曲?每个设计决议都是一个选择,因此领会主要目的用户的意图将有助于你做出选择。

2. 选择准确的Dashboard类型

到目前为止,我一直在平常地提到Dashboard,但实际上Dashboard有许多形状和巨细。凭据我的履历,我发现将它们分为三种主要类型是有用的:

  1. 监控仪表板
  2. 交互式剖析仪表板
  3. 导航仪表板

(1)监控仪表板

监控仪表板是最传统的Dashboard气概。当第一次被要求界说一辆汽车的仪表盘时,它们很可能是大多数人所想的。这是监视仪表板的一个很好的例子,由于它显示了用户应该经常看到的信息,而且一目了然。

它还假定由信息引起的潜在行动是在别处接纳的。例如,若是显示已超速,你可能想要松开油门,若是超速太快,则可能需要踩刹车。

我们在VMware软件中看到的一个常见示例是在操作中央的大型共享监视器上显示的Dashboard。许多人可能会看到Dashboard,但没有人直接与之交互。它显示的是在其他地方执行的操作。

5个步骤,教你完成优异的Dashboard设计

VMware的Wavefront——单值统计仪表板

(2)交互式剖析仪表板

近年来,交互式剖析仪表板变得越来越普遍,它们的目的不是立刻显示大量信息,而是以数据可视化的形式向用户提供工具,以便它们可以显示所需的信息。这通常是通过通俗过滤器和选择器将图表毗邻在一起来实现的。

5个步骤,教你完成优异的Dashboard设计

VReficationOperationManager——对VM剖析仪表板举行故障清扫

(3)导航仪表板

中央辐射型导航模子中,导航仪表板充当一种“目录”,其中,中央页面指向详细信息页面。差别之处在于,每个统计数据都代表了一个更普遍的元素。该值区分了项目,这使用户清楚地领会与哪些交互可获得更多信息。

5个步骤,教你完成优异的Dashboard设计

VMware的Wavefront——仪表板到仪表板导航

这些界说不是牢固的或伶仃的Dashboard类型。通常,Dashboard具有多个特征。我看到的一种常见模式是,在监视器上和团队之间共享一个监视仪表板。

监视的项目具有导航性,并允许团队成员向下钻取到单独的Dashboard,其中包罗有关该项目的更多详细信息。在这种情况下,它既是监视仪表板又是导航仪表板。

3. 以准确的方式显示准确的数据

(1)数据粒度

一旦你领会了用户、他们的目的和Dashboard类型,就可以将该信息转换为一个或多个简朴问题。用户可以在其中找到Dashboard的真实价值。若是这个问题太宽泛,你可能无法回覆,或者你需要大量的数据来准确地回覆它。

另一方面,若是问题太窄,不太可能解决用户较大的目的。找到准确的问题来回覆是Dashboard设计的艺术,和大多数设计事情一样,它实际上是从研究最先的。

找到准确的问题可能就像观察一些有代表性的用户一样简朴,或者可能需要一些更深入的对话和语境询问。只有当你知道用户头脑中的问题时,你才会知道你是否确实有数据可以准确回覆它。

8个朋友圈话术模板,学会就成交

为了更好地明白用户目的,我们激励设计师讲述用户的故事并想象这个故事是若何在软件中流转的。故事的一部门可能会看到用户需要回覆问题。若是产物能够辅助回覆问题,Dashboard可能是最好的机制,然则产物必须有准确的数据才能使谜底有用。

若是你发现确实有数据,那就太好了!若是没有,那么你需要查看是否可以获取数据(有时通过合并已有数据),或者是否可以仔细地将问题更改为可用数据可以回覆的问题。

这一阶段的典型缺陷是,让你所掌握的数据决议你正在建立的Dashboard的内容。一个API公然20个唯一指标,并不意味着你应该显示20个图表。重在用户,而不是数据!

(2)时间与对照

数据随时间转变,这就是为什么它很有趣。它发生转变的事实提供了第一类对照,即可视化随时间而转变。

假设时间转变很有趣,我们需要思量准确的显示机制:它与时间有何关系?当前状态是唯一主要的吗?那么,也许单一指标或量表是显示它的准确方式。

已往的趋势主要吗?你可以思量将该单一统计信息与一条简朴的火花线配对以显示趋势。火花线是否足够保真,照样需要在准确的时间查看准确的值?若是是这样,则最好使用带有清晰轴标签的细线图。

5个步骤,教你完成优异的Dashboard设计

从单一指标到火花线到线图的希望

然则时间不是唯一的对照类型。有时,将多个泉源举行相互对照同样主要。若是是这样,那么准确的谜底可能就像两个并排的单一统计数据一样简朴。

然则,若是有两个以上的泉源怎么办?使用条形图或柱状图将值相互对照是否主要,或更主要的是使用饼图将值与整个值举行对照。而且,若是与其他泉源举行对照并随时间举行对照两者都很主要怎么办?

在这种情况下,你可能会发现自己转向聚积面积图。

5个步骤,教你完成优异的Dashboard设计

从条形图到饼图到聚积面积图的希望

4. 按部就班地组织起来

通常,你会使用多个显示来回覆多个问题,那么若何将它们部署在Dashboard上?回到你确定的问题,它们通常可以形成一个条理结构。

想象一下,你正在为私人教练设计一个Dashboard,以跟踪其客户的进度。第一个问题可能是领会客户是否达到了每月目的。若是谜底为“否”,那么培训师将想知道这是朝错误偏向的平稳生长,照样反映客户“作弊日”趋势的“突飞猛进”。

通过组织问题,你可以在逻辑上对小部件举行分组,以最好地回覆问题。

在排列图表时,请思量:

  1. 目的用户的自然阅读偏向(从左到右照样从右到左?)
  2. 显示尺寸(4K显示器照样细小的iPhone6SE?若是两者兼而有之,请准备好响应性的谜底。)
  3. 时间对齐(显示相同时间局限的多个图表,若是它们是垂直叠加的,则更容易关联。)

因此,现在你有了一个Dashboard,其中充满了按逻辑顺序排列的图表和小部件,它们回覆了所有你预见到的用户提出的问题,然则将他们适配在单个屏幕上很难,而且转动会损坏仪表板的一目了然。该怎么办?

同样,这也是问题结构起作用之处。若是你已经确定了主要问题,那么首先确定回覆它所需的内容。这就是你的Dashboard默认显示的内容。前端开发职员不被要求在最初就渲染尽可能多的图表,他们也会很愿意。

对于这些次要问题和其他问题,你可以通过默认情况下将它们折叠在Dashboard上,或者将它们移到它们自己单独的可导航仪表板上,从而逐步公然它们。若是使用辅助Dashboard方式,请确保导航清晰并可接见。

开发职员通常会决议这是否是一种选择,但要认识到每一种选择的权衡:

  • 导航似乎很容易,然则维持上下文往往很难题。
  • 折叠看起来也很容易,然则页面超载可能会给用户和出现Dashboard的系统带来压力。

在极少数情况下,你可能会发现你所提倡的用户只有一个问题,而你只需要显示该谜底即可。若是是这样,则此部门并不是真正需要的,然则我可以算一下我曾经看到过的实例的数目。

5. 增强造型设计

现在,你有了一个或多个Dashboard,其中充满了图表显示,用户可以注释这些图表来回覆主要的问题。

有些人可能会以为这样做就够了,也是可行的,但作为设计师,我们不仅要起劲让用户能够解读数据,而且他们还可以轻松甚至愉快地完成这些事情。颜色和字体的使用可以将Dashboard从功效扩展到真正可用。

(1)颜色

以前,曾思量过举行对照,跨图表举行对照最常见的事情之一就是数据源。主要的是,多个图表(甚至差别图表类型)上的数据应以相同的方式示意相同的泉源,尤其是在颜色方面。

此外,请注意颜色是若何被解读的。例如,许多用户会将红色图表明白为错误,或将绿色图表明白为正常和康健。红色和绿色也提出了另一个思量因素:可接见性。红绿色盲(全色盲和全色弱)影响多达7%的男性人口,因此使用模拟工具来验证你的图表是否可区分非常主要。

5个步骤,教你完成优异的Dashboard设计

以上相同的图表使用色觉模拟器后…哦豁。

(2)字体

为界面选择合适的字体自己就够难题的了,但图表却提出了自己的特定挑战。图表显示的文字比大多数正文要小得多,因此找到一个小尺寸的可读字体是要害。

此外,图表的字体用于数字值的频率远高于界面的其他部门,因此请仔细思量若何出现数字。例如,许多字体给0加上斜杠或点,以与字母“ O”区离开,然则若是字体较小,它们可能看起来会像数字“ 8”。

数据可视化对于设计职员来说是一个要害挑战,设计优异Dashboard的能力是一个有价值的工具。与任何工艺一样,主要的是不仅要有准确的工具,而且要知道若何有用地使用它。虽然制作一个漂亮的图表需要特殊的技术,但要想制作一个解决用户问题的Dashboard,并能让用户以愉快的方式举行,则需要思索和设计。

本文来源于自互联网,不代表n5网立场,侵删。发布者:N5网,转载请注明出处:https://www.n5w.com/15758.html

(0)
打赏 微信扫一扫 微信扫一扫
N5网N5网管理员
上一篇 2020年6月14日 01:55
下一篇 2020年6月14日 01:55

相关推荐

联系我们

电话:

在线咨询:点击这里给我发消息

邮件:@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息

公众号