可视化设计不等于天马行空

269 阅读5分钟

1.jpg

设计最重要的目的不是为了体现创意,也不是越复杂、越天马行空越好,设计的本质是——沟通。

——《设计心理学》

认知科学家唐纳德·诺曼

什么是.png

设计到底是什么?怎么才算是好的设计?
有人说搞艺术的肯定可以做好设计,有人说设计就是好看呗,还有人说设计就是P个图,还有人说设计就是个美工···

2.gif

打住,不是搞艺术的就可以做好设计,也别总把搞艺术挂在嘴上,说什么天马行空不切实际的艺术表现,所有伟大的设计都是在艺术的美、可靠性、安全性、易用性、成本和功能之间寻求平衡与和谐。当延伸到可视化设计中,这种平衡与和谐的重要性更为凸显出来,而并不是盲目的只做图。

动画 (1).gif

那么什么是优秀的可视化设计?

优秀的数据可视化应该通过使用图形,清晰有效地传达数据信息,轻松地一目了然地理解数据,直观的信息数据能引起受众讨论和决策、进行数据分析检测;能调动人的情绪、引发人的共鸣,传递企业文化和价值。

创新产品新高地工程看板.png

设计图.jpg

如何做到这点?接下来将从《设计心理学》中提到“沟通”的四个方面进行分享!

第一条.png

用最直白的话说,就是事物通过自己的外在形态,向人们直白的展示自己具有的功能,别人一看到你的设计,就能马上反应过来——它是啥?

图标1.png

图标2.png

知道自己该如何表达和展示设计效果,找出核心,分清主次。

简单易懂,不要让用户“解读”信息,要通过聚焦所呈现的数据来传达一个强有力的信息,以确保一个中心主题的出现。基于背景信息内容,减少过度设计导致的数据误读;同时考虑数据的不确定性和可变性,设计变化服务于数据变化。

图表.png

根据数据选择有故事有意义的图表,直接对数据进行展示,让用户容易理解,有时可能有不止一种方法可以对数据进行展示,在这种情况下,需要考虑数据展示的直观性,正在传达的信息。

第二条.png

约束的四种因素:物理、文化、语义和逻辑。

简单来说也就是设计要贴切实际,要考虑到实际的开发呈现。

在生活中,比如高达模型,有上百个零部件组成,假如随便组装的话,就是上百万甚至上千万的组装方式,显然这样是不切合实际的;其实每个零部件都有自己的属性,只能按照相对应的顺序组成。

图表1.png

在可视化图表设计中,红色代表警示,蓝色代表科技,黄色代表金融,绿色代表健康;柱状图中同类型的数据不能用粗细不平等的图形展示,需要宽度或者高度保持统一;折线图的数量不能五颜六色,数量不能太多(最好保持在4个以内);饼图避免过度分割,否则导致视觉上无法阅读,分块数量≤6,用同一色系的分块组成等等。

映射

映射?这难道不是数学概念?

它来源于数学概念,但是在设计之中,赋予了它新的意义。它指的就是在使用产品的时候,人们对产品进行操作、控制等行为与其进行这些行为之后产生的结果之间的关系,这种关系叫做映射。

设计要映射出我们约定俗成的习惯,把现实生活中的经验模拟到一个虚拟的世界里。

例如不同地区红色的意思是不一样的,在股票走势图中,中国股市将红色定为上涨,将绿色定为下跌;而在国际股市中,红色是下跌,绿色是上涨。上涨和下跌的颜色是根据各国人民的喜好决定的,取决于各国的宗教信仰。所以要建立正确的映射,就必须搞懂受众的习惯。

图表2.png

例如设计图中按钮的形状源于生活中的原型,区别于平面,设计图中的按钮虽然是扁平,但形状和颜色往往要和其他元素有明显的区别。

图表3.png

第四条.png

用户进行某个操作后,产品应该给出明确清晰的反馈,告诉用户操作的结果。比如声音反馈,屏幕展示反馈和操作结果反馈等等,目的是告诉用户,你已经成功操作了,并出现了对应的结果。

图片.png

比如在实时监控大屏中如果有紧急事件,需要有醒目的提醒设计;当鼠标滑动到某个自动轮播的图表或者列表时,图表和列表应该静止,说明用户想看当前数据等等。

其实个人认为反馈也可以延伸到“线下”,通过开发者的反馈,优化和调整设计方式,提供可开发的图表或者效果展示,只要是参与整个项目当中的所有人,也都可以看成用户。

设计不是盲目的低头做,做完后不管一切,而是一边做一边沟通,了解用户,了解需求,了解开发,根据反馈进行设计的合理优化。

本文只是对《设计心理学》中4个方面的简单分析,其实还有很多经典实用的理论可供大家学习,做可视化和UI或者平面还有很多的区别,如果想了解更多关于可视化相关的知识,欢迎关注公众号,也欢迎大家积极留言,分享自己的经验~

感兴趣的小伙伴,欢迎前往联通ANOV沃云门户,了解开发手册以及培训视频等更多内容 anov.woyun.cn

800.png