020-29815005
预约专线时间:09:00-23:59

【UI设计培训】:设计心理学中的映射交互设计概念

新闻来源:本站 日期:2022-03-23
我们经常会谈到用户体验,其实好的用户体验与设计映射是有很大关系的,今天的设计法则-映射,希望能为你提升产品用户体验度带来一点思考。今天我们来了解一下,设计心理学中的第三个交互设计概念:映射。

  我们经常会谈到用户体验,其实好的用户体验与设计映射是有很大关系的,今天的设计法则-映射,希望能为你提升产品用户体验度带来一点思考。今天我们来了解一下,设计心理学中的第三个交互设计概念:映射。


【UI设计培训】:设计心理学中的映射交互设计概念


  同样,这个概念也要结合示能和意符一起来思考。诺曼先生在设计心理学中提到了映射这个概念,但是比较精炼,对于初学者来说只能有个大概的了解。所以今天我们继续用更多的案例来说一说这个概念在我们数字化以及生活中运用的实际场景。

  这虽然是交互基础的概念但对我们设计师来说也极其重要,概念虽然很简单,但实际在设计中也会频繁的遇到问题。我们先用比较正紧的文案来描述一下这些比较“枯燥”的概念,映射是一个术语,从数理理论借用而来,表示两组事物要素之间的关系。(书中诺曼先生的原话)上两篇文章我们说的示能和意符,表示了事物本身具备或传达的功能和被交互性,而映射则是表示了控制器和被控制对象的关系。

  好的示能和意符的设计,可以让映射变的自然。第一篇示能我们举了一个开关的例子,多控开关之所以让人抓狂首先是缺少了意符的表达,其次是映射的不合理。就如同我们在书中见过的一个煤气灶的案例,4个灶头下方有4个控制开关,左右两种不同的排列方法,体现出好的映射有多重要。

  一、映射的三种层次

  诺曼老师在如何设计映射中提到,自然映射设计可以分为3种层次:

  最佳的映射:控件分布在被控物体的主体对象上

  次佳的映射:控件与被控对象相对更接近

  第三佳的映射:控件与被控对象在空间分布一致

  这三种映射的层次在体验中的满意度与效率一次递减,我们依次在举例说明

  1.1控件分布在被控制的对象上

  例如门把手在门上,我们就觉得这映射设计的很自然,通过转动把手可以对门进行开和关。再例如我家的洗衣机上有一个用来选择洗涤模式的旋钮,洗涤模式围绕在旋钮的周围,旋钮上有光点,旋转旋钮光点就会旋转到我们需要的洗涤模式上,这也是控件与对象一体的形式,满足用户对控制器与被控制对象的心理预期。

  那在数字产品中我们也会遇到类似的情况,例如我们想展开放置在一个卡片中的文字,我们通常最好的方式是在文本的边上设计一个提示展开的“可点击按钮”,再次的方案是放在文案的下方,最不可取的就是放在卡片以外的区域,因为映射关系逐渐减弱到无关。

  再举个例子iOS系统中如果要调节音量,可以在音量模块中直接通过手指的滑动来调节,而不需要在模块中或者模块外部加上两个用来增减音量的按钮。不过说实话,华为的曲面屏双击侧边唤出音量控制模块,个人觉得成本还要比物理实体按键更高一点。

  除此之外,智能手机在逐渐演变进化的过程中,手势操作功不可没,利用手势代替按钮也节省了更多的成本并且在效率方面也得到了提升。例如视频播放器的应用中,会有相应的控件用来控制视频的播放、暂停、声音、进度、亮度、横竖等等,这些按钮其实就是最佳的映射设计

  1.2.次佳:控件与被控对象更接近

  这个也就是我们常说的格式塔心理学中的接近原则,因为越靠近越相关,很好理解。某些物件在设计时无法将控件和被控对象结合设计,那么我们只能退而求其次,让他俩能更靠近一些,在映射关系上可以更清晰。

  接下来我会给大家看我家的冰箱和电饭煲的操作界面,大家就知道,次佳的映射如果不好好设计,也会显的很糟糕。如图所示,其实界面的信息设计无非就是这样,如果你可以把这些界面的信息设计的有逻辑有层次,那么在其他的用户界面中也能够如法炮制。

  例如电饭煲的烹饪模式和其对应的按钮,都是通过点击多次按钮进行控制,而不是在单独的模式中具有单独的按钮,而最好的方法那肯定就是想选什么模式直接选,而不是做一个按钮来多次切换。

  这里是因为本身这款电饭煲没有智能面板,所以通过物理按钮只能这么做,否则,按钮一多就更难操作了。那有小伙伴问他能不能和洗衣机一样做个旋钮呢?当然也可以,因为旋起来也比多点几次按钮来的方便,只不过旋钮做上去之后其他的按钮可能也要变成旋钮,在产品设计上就有更多的问题要探讨啦。

  所以我们再来看它的按钮分布,发现其实控制按钮和被控制的参数其实缺少了距离关系,当你看着想要控制的参数却找不到控制按钮的时候就会比较抓狂,因为在这个布局中既没有满足最佳也没有满足次佳,甚至连在空间分布上也无法产生对应。  

  以上就是优漫教育小编为大家介绍的“UI设计培训】:设计心理学中的映射交互设计概念”相关内容,学习ui设计培训,可以参考优漫教育提供的ui学习路线,该学习路线内容包含ps软件入门、AI与品牌设计、视觉表达技法、web视觉设计、图标设计、产品交互、移动端设计等,根据优漫提供的ui学习路线图,可以让你对学好ui需要掌握的知识有个清晰的了解 !