BI设计上篇 - 像设计师一样思考

news2024/12/22 23:11:33

形式服从功能。这句产品设计的箴言也适用于数据可视化。就数据可视化的形式和功能而言,我们首先考虑的是我们希望受众能用数据做什么(功能),然后才是用可视化(形式)来简化这个过程。在本文中,我们会讨论传统的设计概念如何应用于用数据沟通,我们会从可供性、无障碍、美观以及接受度来进行探讨。

1、可供性

在设计领域,专家会谈到物体的“可供性”。它们是设计的固有属性,使得产品的使用方式显而易见。让我们考虑如何将可供性的概念应用到数据沟通上。我们可以利用设计上的可供性引导受众更好地利用图表以及与之交互。为此我们将讨论三个具体的方面:(1)突出重要的内容,(2)消除干扰,(3)建立清晰的信息层次

1.1、突出重要的内容

为了更好的表达出我们的数据故事,我们需要将受众的注意力吸引到我们所期望的地方,这里的关键在于只应突出整体图表中的一部分,因为突出的效果会随着突出的百分比增加而减弱。《通用设计法则》一书中建议最多突出图表中10%的内容

让我们看一个有效突出的数据可视化示例:

【图1:突出重点-调整前后】

修改图表中的颜色使用能够完全重定向我们的注意力,如图中使用橙色突出拥有本科及以上学历的数据。通过把其他内容都标灰,清楚地突出了我们应该集中注意的地方

1.2、消除干扰

在突出重要内容的同时,我们还需要消除干扰。一个完美的设计,不是因为它没有多余的东西可以添加,而是因为没有多余的部分可以删减。Saint-Exupery,1943。对于数据可视化的设计完美性,决定删减或者弱化什么,可能比决定添加或者突出什么更重要

以下是一些具体的、有助于识别潜在干扰的注意事项。

(1)不是所有的数据都同样重要。合理使用页面空间以及受众的注意力,消除不重要的数据或者元素。

(2)当不需要细节时,请总结。你应该熟悉细节,但这不代表受众也同样需要。思考是否应该进行总结。

(3)扪心自问:去掉这个会有什么变化?不会?那就去掉吧!抵制住因为某些内容可爱或者花费了心血而保留它们的诱惑。如果不能论证内容,那它们就与沟通的目的不符。

(4)将必要但不直接影响内容的元素融入背景。使用关于前注意属性的知识进行弱化。浅灰色的效果就不错。

每一步消除和弱化都使得留下来的内容更为突出。如果你不确定是否保留正在考虑删减的细节,想想可否在不稀释主要内容的前提下保留这些细节。例如在幻灯片中,你可以将内容移到附录中供需要时使用,而且不会干扰你的主要观点。

【图2:消除干扰-调整前后】

我们用一些调整来消除干扰。最大的改变在于从条形图变为折线图。折线图通常更容易表现随时间变化的趋势。这一改变还有着视觉上减少离散元素的作用,因为之前5个条形图的数据被减少到端点高亮的单独一条折线

1.3 建立清晰的信息层次

在图表中,有时可以用超类组织数据并为受众提供帮助解读的结构。例如,如果你正在看关于20个不同的人口统计细目的数据,可以组织并清晰地将人口统计细目标记为年龄、种族、收入层次和教育背景等群体或者超类。这些超类提供了层次结构,可以简化信息处理的过程

让我们看一个建立了清晰视觉信息层次的示例,并讨论建立层次时具体的设计选择。想象你是一家汽车制造商,评价某一品牌车型的两个重要维度是(1)消费者满意度和(2)汽车故障率。散点图可用于可视化当年车型与往年均值在这两个维度上的比较。

【图3:清晰的视觉层次】

图中可以我们快速地看到在消费者满意度和故障率两方面,今年各种车型与去年平均水平的比较

2、无障碍

无障碍的概念在于,设计应该对不同能力的人都可用。我们会讨论与无障碍相关的两条具体策略:(1)不要过于复杂,(2)文字是你的朋友

2.1、不要过于复杂

如果难以阅读,那就难以实施。Song & Schwarz

对于数据可视化而言,图表看起来越复杂,受众感觉需要越多的时间进行理解,他们也越不可能花费时间去理解

以下是一些建议,可以避免图表过于复杂。

(1)保持图表易读:使用一致而易于阅读的字体(字体和字号都要考虑)。

(2)保持图表简洁:利用视觉可供性使数据可视化易于理解。

(3)使用直观的语言:选用简单而非复杂的语言,使用精炼而非冗长的语句,对任何受众可能不熟悉的专业词汇做出定义,以及拼写出缩略词(至少在第一次使用时,或者在脚注中)。

(4)去除不必要的复杂:在简单和复杂之间做决定时,选择简单。

这不是过于简化,而是避免让事情超出必要的复杂

2.2、文字是你的朋友

深思熟虑的文本使用让设计无障碍。受众很清楚他们在看什么,他们应该注意什么以及为什么。文字在数据沟通中能起到以下作用:标签、简介、解释、强调、突出、推荐和讲故事

3、美观

对于数据沟通,是否有必要“让它美观”呢?答案显然是肯定的。人们认为,更美观的设计更容易使用——不管实际上是否如此。研究表明,设计越美观,令人感觉越容易使用,而且随着时间的推移也更能被接受和使用,还能够促进创造性思维和解决问题,培养积极的关系,让人们更能容忍设计中存在的问题

以下是一些建议,可以帮助提升报表的美观度

  1. 明智地使用颜色。颜色的使用应该总是有意为之的,谨慎而有策略地使用颜色突出图表中的重要部分。
  2. 注意对齐。组织页面上的元素,形成明显的水平和竖直界线,建立起一致而凝聚的感觉。
  3. 利用留白。保留页边距,不要拉伸图表以填充整个空间,也不要因为有多余的空间就随意地添加内容

4、接受度

一个设计必须被目标受众所接受才算有效。无论设计的是物体还是数据可视化,这句格言都适用。但当受众不接受你的设计时,你该怎么办?

大多数人对于改变都有一定程度的不悦,这是人性的一部分。《通用设计法则》一书中提到,因为大众习惯于旧观念,从而趋向于抵制新观念。因此,要对“现有方式”做出重大改变,除了用新方式替代旧方式之外,还需要花费更多精力让新方式获得认同。

你可以在数据可视化设计中采用以下几种策略来获得认同

  1. 阐述新方法的益处
  2. 将新旧版本并排展示,向受众展示前后的对比
  3. 提供多种选择并寻求反馈
  4. 争取有影响力受众的支持

小结

通过理解和运用一些传统的设计理念,我们为成功的数据分析设计做好了准备。

为受众提供视觉可供性,以此作为如何与图表交互的提示:突出重要内容、消除干扰并建立信息的视觉层次。避免设计过度复杂,用文字对图表进行标记和解释,这样会使设计理解起来无障碍。让图表美观,从而提高受众对设计问题的容忍度。利用所讨论的策略为设计寻求受众的认同。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1295.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

总结flutter玩转之-安卓view 承载flutter 的页面

1.假设你已经熟悉flutter 开发熟悉dart 语言 android 原生开发技能 一、在安卓原生项目添加代码 1.创建示例布局 <?xml version"1.0" encoding"utf-8"?> <LinearLayout xmlns:android"http://schemas.android.com/apk/res/android"…

【Linux修炼】6.gcc/g++及Makefile【工具篇】

每一个不曾起舞的日子&#xff0c;都是对生命的辜负。 Linux-gcc/g及Makefile本节目标程序的翻译过程1.程序的翻译过程2. 理解选项的含义3. 动态链接和静态链接Linux项目自动化构建工具-make/Makefile1. 背景2. “见见猪跑”3. makefile原理及语法3.1 Makefile原理3.2 Makefile…

pytorch初学笔记(二):TensorBoard之add_scale()的使用

目录 一、SummaryWriter类的介绍 1. 定义 2. SummaryWriter初始化 2.1 初始化 2.2 帮助文档给出的使用范例 2.3 常用方法 二、add_scale()方法介绍 1. 常用参数介绍 2. 绘制图形 2.1 安装tensorboard 2.2 对应代码 2.3 打开tensorboard窗口 2.3 注意事项 三、a…

kubernetes学习笔记

参考 Cloudman 老师的《每天5分钟玩转Kubernetes》&#xff0c;记录如何使用 Kubernetes &#xff0c;由于版本变化&#xff0c;一些命令也有相应的变化&#xff0c;本文对应 Kubernetes 1.25.3 5. 运行应用 010.123 用 Deployment 运行应用 原文使用kubectl run命令&#x…

JS(Dom对象的属性和方法)第十六课

Dom对象的属性和方法自定义的熟悉操作上面是今天博客要讲述的内容 一个案例回顾上次课讲的内容 下面是Html中的元素布局结构 <div>我是div审查元素<p>我是p标记的元素</p><span>我是span的元素信息</span></div><div class"one&…

搭建ftp服务器注意事项

很早之前写过一篇关于FTP服务器相关博客&#xff1a;FTP服务器主动被动模式详解。直到最近生产环境需要搭建一个FTP服务&#xff0c;才发现一些细节还需注意。 生产环境搭建ftp服务器&#xff0c;如果有外部用户需要连接ftp服务器下载文件&#xff0c;一般用的是Passive (PASV&…

[深度学习] 名词解释--正则化

正则化 花书的定义&#xff1a;凡是可以减少泛化误差&#xff08;过拟合&#xff09;而不是减少训练误差的方法&#xff0c;都叫正则化方法。 目的&#xff1a;拟合训练数据&#xff0c;防止模型过拟合&#xff0c;通常使用L2正则化.用各种方法规范模型参数的方法. 什么是神经网…

408 | 【2012年】计算机统考真题 自用回顾知识点整理

选择题 T2&#xff1a;后缀表达式&#xff08;逆波兰表达式&#xff09;—— 注意 操作数的顺序&#xff01; 中缀转后缀 运算顺序不唯一&#xff0c;因此对应的后缀表达式也不唯一“左优先”原则&#xff1a;只要左边的运算符能先计算&#xff0c;就优先算左边的用栈实现中缀…

JS(DOM)第十五课

Dom的全称是Document Object Model DOM 定义了访问 HTML 和 XML 文档的标准 Dom的定义 DOM 文档对象模型 DOM是针对XML的基于树的API。描述了处理网页内容的方法和接口&#xff0c;是HTML和XML的API&#xff0c;DOM把整个页面规划成由节点层级构成的文档。 DOM本身是与语言无…

基于simulink的超级电容,电池及DC motor充放电系统仿真

目录 一、理论基础 二、核心程序 三、测试结果 作者ID &#xff1a;fpga和matlab CSDN主页&#xff1a;https://blog.csdn.net/ccsss22?typeblog 擅长技术&#xff1a; 1.无线基带,无线图传,编解码 2.机器视觉,图像处理,三维重建 3.人工智能,深度学习 4.智能控制,智能优…

【C ++基础】迭代器(iterator)在string里面的简单使用

【C 基础】迭代器(iterator)在string里面的简单使用 前言 本文是为了扫清后面学习的难点&#xff0c;而特意写的文章&#xff0c;只是介绍迭代器如何在string中使用。 迭代器的详细解释请看这里&#xff1a; [点击跳转&#xff08;这里还没有写哦&#xff09;] C专栏主页&am…

【Node.JS】事件的绑定与触发

往期文章 【Node.JS】写入文件内容 【Node.JS】读取文件内容 目录 简介 绑定事件 on&#xff08;&#xff09; addListener&#xff08;&#xff09; once&#xff08;&#xff09; 监听事件emit&#xff08;&#xff09; 传参 删除事件 removeListener&#xff08;&am…

【无人机】基于蚁群算法的无人机航路规划研究附matlab代码

✅作者简介&#xff1a;热爱科研的Matlab仿真开发者&#xff0c;修心和技术同步精进&#xff0c;matlab项目合作可私信。 &#x1f34e;个人主页&#xff1a;Matlab科研工作室 &#x1f34a;个人信条&#xff1a;格物致知。 更多Matlab仿真内容点击&#x1f447; 智能优化算法 …

【笔试题】【day14】

目录 第一题&#xff08;哪些成员变量需要在初始化列表初始化&#xff09; 第二题&#xff08;多态的条件&#xff09; 第三题&#xff08;多态的条件&#xff08;通过父类对象调用的全部都是父类的方法&#xff09;&#xff09; 第四题&#xff08;菱形继承&#xff0c;虚…

猴子也能学会的jQuery第一期——什么是jQuery

#1024程序员节&#xff5c;用代码&#xff0c;改变世界 &#x1f4da;系列文章—目录&#x1f525; 猴子也能学会的jQuery第一期——什么是jQuery 猴子也能学会的jQuery第二期——引入jQuery 未完待续 目录 &#x1f4da;系列文章—目录&#x1f525; &#x1f4c4;需要具备的…

【最佳实践】瀚高数据库 Windows企业版v6.0.4 的安装

Windows7、Windows10 一、安装 解压缩文件“hgdb6.0.4-enterprise-windows10-x86-64-20220127.zip”&#xff0c;以【管理员】身份运行 setup.exe。 安装过程基本上是下一步下一步即可&#xff0c;注意步骤如下。 1.1 安装主目录 注意安装路径&#xff0c;不要包含中文&am…

【创作中心】自定义模板的使用

个人主页&#xff1a;天寒雨落的博客_CSDN博客-初学者入门C语言,数据库,python领域博主 &#x1f4ac; 刷题网站&#xff1a;一款立志于C语言的题库网站蓝桥杯ACM训练系统 - C语言网 (dotcpp.com) 特别标注&#xff1a;该博主将长期更新c语言内容&#xff0c;初学c语言的友友们…

2022年12月1日起,OCS将停止接受GOTS的原料投入

【2022年12月1日起&#xff0c;OCS将停止接受GOTS的原料投入】 GOTS介绍&#xff1b; 全球有机纺织品标准&#xff0c;Global Organic Textile Standard, 简称GOTS。该标准由国际天然纺织品协会&#xff08;IVN&#xff09;、日本有机棉协会&#xff08;JOCA&#xff09;&#…

数字化智慧梁场管理系统解决方案

系统介绍 数字化智慧梁场管理系统实现对预制构件生产的全周期智慧化管理。系统以BIM为基础&#xff0c;搭建完整数字孪生模型&#xff0c;依据生产工序智能排程&#xff1b;围绕生产工序&#xff0c;生产任务智能传递&#xff0c;协同工作&#xff1b;依据生产工序&#xff0c;…

Python实战:获取bing必应壁纸首页的每日一图(仅做学习用)

目录需求网站分析代码实现进一步接口获取其他资源需求 老板&#xff1a;微软必应https://cn.bing.com/ 首页的每日一图看着不错&#xff0c;能不能自动获取 我&#xff1a;我试试 网站分析 我们查看网页元素&#xff0c;不难发现背景图就在类名为.img_cont 的标签下 可是搜…