UI设计、交互、产品、都应该具有这十种思维模式!!

注:文章由 集创堂联合创始人CEO纯色老师和设计帮联合出品!这篇文章从十个维度深入挖掘交互设计的思维模式,如果你是UI设计师、初级交互设计师、产品经理、那么这篇文章很值得你学习。笔者在和纯色老师探讨交互设计思维时,老师说“不管你是UI、交互、产品,在团队中都不能是孤立单一的技能,要用联系的观点去看设计,不能分裂来看”。老师说的很对,做UI设计到最后是离不开交互知识支撑的,同样交互、产品也应该具备对设计的审美,这样每一个角色再探讨产品时才...

UI设计、交互、产品、都应该具有这十种思维模式!!

注:文章由 集创堂联合创始人CEO纯色老师和设计帮联合出品!


这篇文章从十个维度深入挖掘交互设计的思维模式,如果你是UI设计师、初级交互设计师、产品经理、那么这篇文章很值得你学习。


笔者在和纯色老师探讨交互设计思维时,老师说“不管你是UI、交互、产品,在团队中都不能是孤立单一的技能,要用联系的观点去看设计,不能分裂来看”。老师说的很对,做UI设计到最后是离不开交互知识支撑的,同样交互、产品也应该具备对设计的审美,这样每一个角色再探讨产品时才不会各自其说找不到共同的认知。



一、人的认知习惯


认知是个体认识客观世界的信息加工活动,人的认知是有共性和规律的,例如:当我们第一次去一个房子里访问,通常我们都是先了解房子的大致结构,哪里是卧室、厨房、餐厅、卫生间、这个结构输入到我们脑子后,我们才开始观察细节家具、家电、装饰品。


当我们的大脑遇到的信息太多时,大脑就会自然的形成分组,先录入宏观信息再完善细节信息,最终形成一个记忆,这就是人的认知习惯,多数人都是差不多的,不管是对一套体系的知识,还是对一个产品都是沿着相同的这种规律。


所以我们在设计产品时产品形态语意定位要符合人的认知习惯,我们设计的app页面内容有主有次,这样让人的大脑更容易接受页面的信息,从而形成深刻的记忆。

如何站在这种认知习惯上更好的运用它呢?看下面两个词:

UI设计、交互、产品、都应该具有这十种思维模式!!

这是两种思考问题和接收信息的思维模式。

下面来测试你在思考问题时,是自然流动思维模式,还是线性结构思维模式。

UI设计、交互、产品、都应该具有这十种思维模式!!

第一种答案:

“操作方式不一样、应用场景不一样、信息承载量不一样、页面结构不一样等等”。

回答的模式是想到一个说一个,这种被称为自然流思维模式。


第二种答案:

从这两个端来讲:移动端相对pc产品而言,更加注重交互体验,功能更加精简。移动端的产品在交互上更多的和手势动作相结合,同时移动端设计会和自身特征结合起来,如:录音、拍照、蓝牙、GPS、重力感应、push推送等”。

pc端屏幕较大,擅长做复的图表呈现、特效制作、数据计算、后台管理、pc迭代速度更快、硬件兼容性更高等等”。

回答的模式先总结后细化,就像上面说的对房子的认知,先格局再细节。这种答案是拥有体系化的思维模式,它是有一个结构,思路更清晰。

初级交互设计师是自然流动思考问题!

高级交互设计师是线性结构思考问题!


总结:

自然流动与线性结构思维模式适用不同的场景。

1、自然流结构是一种随机放松的一个状态,更感性。适合休闲娱乐,比如商场的结构就是自然流圆形结构。自然流方式不适用于学习,因为录入信息没有规则不成体系不容易形成记忆存储。

2、线性结构是比较有规律有逻辑的录入信息,例如看书,从第一章节有序的往后看,这样获得的信息更有沉浸性,容易形成体系的认知。思考问题更加理性有规律,有说服力。

二、创新与干扰

UI设计、交互、产品、都应该具有这十种思维模式!!

上图一个人戴着折射眼镜躺在床上看书,我们很多时候都有类似的想法,感觉戴上这个东西特别轻松,这种创新其实是一个非常经典错误的创新,他的根本问题在于,人看书时会有100种场景,这种场景只是解决了一种当前的状态,却影响了其它99种场景的运作。


UI设计、交互、产品、都应该具有这十种思维模式!!

把一个mp3设计成糖果含在嘴里,可以用舌头播放音乐,控制这个mp3通过骨传导来传递声音。设计者当时觉得这是个非常另类的创新,也是给一些另类的人使用,但是这种另类的产品在推广的时候,很难准确的找到这方面用户,会增加推广上的成本。这种不够严肃的产品可能会对品牌形象带来一定的伤害。


UI设计、交互、产品、都应该具有这十种思维模式!!

google glass刚出来时候被业界一致看好,被称为可以改变时代的一个产品,他可以让手机里面接收的一些信息场景通过眼镜来传递给我们信息。最后这款轰动一时的产品死掉了,问题出在可替代性的原因上,google glass里面描述的大多数场景都是可以被手机替代的,而且还需要较好的落地环境,比如:全城Wi-Fi,再加上手指的操作灵活性要比眼球强很多,所以这款产品未能成功。

三、场景的思考


场景的思考能力对交互设计师和产品经理是非常重要的,能够想到一个产品更多的使用场景,哪些是高频率使用场景,哪些是低频率使用场景,哪些是特殊使用场景,这种思考能力尤为重要。


UI设计、交互、产品、都应该具有这十种思维模式!!

假设电影院失火,所以人都着急往外跑,门若是往里开,需要拉才可以开门,那么这个时候门是很难打开的,所以推门更合适。

UI设计、交互、产品、都应该具有这十种思维模式!!

再看安全出口标识,应该是在高处还是低处?

UI设计、交互、产品、都应该具有这十种思维模式!!

当失火时烟会往上跑,我们根本看不到标识,而且失火时人都要低头走,所以在低处更为合理。

UI设计、交互、产品、都应该具有这十种思维模式!!

一个连锁奶茶店,主攻四线城市,他们的奶茶店多用了一倍的灯光,因为县城和镇上晚上的灯光一般不够亮,要想让顾客更快的发现知道你,就是把奶茶店门外的灯调的更亮,最好是能成为那条街的路灯,这样结果每天会多带来几百块钱的收入。这就是对场景思考的重要性,就像在设计页面时会把重要的东西设计的更突出明显,让用户一眼就能看到。

四、故事与痛点


在传递我们产品的痛点时,要学会结合故事来传递。

UI设计、交互、产品、都应该具有这十种思维模式!!

例如上面这张图,一个很伤感的故事,一个女人在中年的时候遇到了人生的灵魂伴侣,对!她出轨了!故事最后一幕,外面下着暴雨她在丈夫车里,丈夫在外面,俩人互相注视着,有几次她的手悄悄的打开车门,她想打开这扇门和他就此离去,就在这时候孩子的喊声打断了她,让她回到了现实。

看完这个故事观众并不会责怪这个女人,更多的是觉得这是个凄美伤感的故事。这就是用故事掩盖了痛点。


UI设计、交互、产品、都应该具有这十种思维模式!!

一家公司引进一个先进的技术,用眼睛来控制手机,听起来似乎是一个比较酷的效果,但是用眼睛控制手机有个很大的缺点,就是有能耗问题,当时这家公司就考要不要上,不上可惜上了又好像不够有足够的亮点,最后加了一个故事决定上这个技术。

UI设计、交互、产品、都应该具有这十种思维模式!!在北上广深这样的城市,很多上班族都要坐一两个小时的地铁,他们喜欢看视频打发时间,偶尔他们需要抬头看看自己到了哪一站,这短短的时间,却让他们错过了视频的精彩,在拥挤的地跌他们可能只能一只手控制手机要回退却颇为不容易,这个技术就是当你眼睛离开屏幕时视频会暂停,眼睛回到屏幕再次播放。

其实这个功能对用户来讲意义并不大,但是做为技术驱动的这种产品,如果想要提升品牌的价值,就要去引进新的技术,这种新的技术可以提升品牌的价值,对品牌的影响是较大的,所以后来这也是考上这个产品的原因之一。



五、按钮与效率


UI设计、交互、产品、都应该具有这十种思维模式!!

上图蓝色体验还不错,橙色体验非常糟糕

我们打字聊天用的键盘都是高频率使用场景,所以对输入的效率会非常敏感,UI设计师都知道苹果的按钮设计规范大小不小于44px*44px,这样点击时会保证准确度,但是有些高频的按钮还是设计的大一点为好,这样操作起来体验会更好。


UI设计、交互、产品、都应该具有这十种思维模式!!对比上面两个页面,哪个更协调美观。


相信大家会有不同的看法,图一,图标的大小一致,画面更协调,图二,方大了播放暂停按钮,操作上更舒服,体验更佳。当我们有了这个认识之后,再去看这两个页面,相信大多数人会觉得图二设计更具美感,美感来源于我们认识到他具有更佳的体验,这也是菲茨定律。

(菲茨定律:菲茨定律是用来预测从任意一点到目标中心位置所需时间的数学模型,目标越大我们需要做的就越少)


六、设计制约

UI设计、交互、产品、都应该具有这十种思维模式!!

我们先来考虑使用场景,当飞行员准备要弃机逃生时,肯定是让他非常快速的反应过来,所以位置要设计在飞行员可以轻松碰到的地方,但是从使用频率上来讲按钮的使用频率是非常之低的,如果把它放在容易碰触到的地方,很有可能会误操作按钮把飞行员弹飞。所以基于这些场景使用的频率考虑再加上战斗机的结构和安全,保证飞行员和座椅一起弹出去,所以设计在座椅正下方,拉杆式操作最为合理。

UI设计、交互、产品、都应该具有这十种思维模式!!

七、状态与反馈


我们的产品在做出任何一个操作都要给用户一个清晰的状态,当前处在一个什么样的位置,之前有过哪些操作,之后将发生什么样的事,都有清晰的反馈信息提示给用户,这样还可以保持这个产品的控制感。


UI设计、交互、产品、都应该具有这十种思维模式!!

上图这个安装就是一个非常糟糕的安装,安装到70%时候进度条不动了,没有任何反馈,也没有任何的关闭按钮。


UI设计、交互、产品、都应该具有这十种思维模式!!

支付宝上传图片也是一样的问题,都是缺乏必要的反馈信息,没告诉用户当前的状态。

八、行为与流程


思考下面的问题

UI设计、交互、产品、都应该具有这十种思维模式!!

这两个行为有着不同的心理动机,所以在设计流程上也会有不同。


删除和拉黑不同的定义规则

删除好友,是对你毫无关心的意思;拉黑对方,是我讨厌你的意思;
于是,删除好友以后,所有聊天记录也一并被删除了;
然而拉黑别人,再恢复的时候,聊天记录还是可以恢复的;
所以,冷漠比讨厌更让人心寒。


当打开微信我们从通讯录找到一个人去聊天,完事点击返回按钮应该回到哪个页面?

UI设计、交互、产品、都应该具有这十种思维模式!!

从交互逻辑上讲应该从哪里来,就回哪里去,但是微信做了一个创新,点击返回按钮是回到聊天列表页面。因为b到c都是为了触发d,所以没必要回到c页面,这就是行为的原因在设计流程上的创新。(安卓手机这样的)


UI设计、交互、产品、都应该具有这十种思维模式!!

上图同样的在聊天列表页面打开是对话界面,从通讯录打开是这个人的详情页,都是基于场景设计了一个体验更好的流程。


九、行为与惯性


大家都知道人行横道会比马路稍微高一点,很多会留一个小坡儿,给一些自行车或者电动车上下坡儿。然而在生活中,很多行人也喜欢从那个坡道走。而不是把步子多高一点到人行横道上去。其实这就是惯性。我们在走路的时候脚习惯抬的高度是七分米,潜意识中就不会多抬高脚步去上台阶,因为这样就破坏了我们走路的惯性。


UI设计、交互、产品、都应该具有这十种思维模式!!

前段时间微信就基于这种理论做了删除的优化。

UI设计、交互、产品、都应该具有这十种思维模式!!

腾讯的斗地主游戏很好的利用这个惯性心理,每次当你失败了,会弹出一个弹窗,这个弹窗的操作区域就是刚出牌的操作区域附近。这样的设计只会让你反复的来玩这个游戏出不来,这就是交互惯性。

十、等待


UI设计、交互、产品、都应该具有这十种思维模式!!

等待的场景是很令人讨厌的,如何尽可能的减少或者消除这个烦恼呢?

例如排队时,提供进度条提示还需要多长时间、插播语音广告分散排队人的注意力、还有定位提示,距离100米、距离50米,把长任务分成几步会显得短了很多。

UI设计、交互、产品、都应该具有这十种思维模式!!

高层楼的电梯,需要坐很久的时间,电梯里面信号也不好,那么在电梯里面设计怎样的场景,会让用户感觉没那么长时间呢?答案就是镜子!因为人在镜子面前会觉得时间过的更快。

看下面三个进度条小动画,先快后慢好?还是先慢后快好?

UI设计、交互、产品、都应该具有这十种思维模式!!

1、先快后慢心理学的解释是,后面慢了用户不忍心放弃,会持续等待;

2、先慢后快心理学的解释是,开始慢用户比较有耐心等待,后面慢慢失去耐心  的时候再快起来,这样用户同样不容易放弃。

前两种都没有问题,但绝对不可以匀速,一定要变速,变速会让人觉得时间过的很快。


长按下方二维码关注“互联网设计帮”

UI设计、交互、产品、都应该具有这十种思维模式!!


原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/34918/

(0)
交互精选交互精选
上一篇 2018-01-30
下一篇 2018-01-30

相关推荐

  • 全国高校“用户体验、视觉界面(UI) 设计、交互设计新技术实践教学与应用师资研修班

    商务合作联系QQ:3158521867 或加微信号:jujiao01一、会议背景近年来新技术、新趋势不断爆发,同时掀起了互联网的蜕变热潮,行业和用户更加成熟理性,随着网站和平台开发需求不断增多,智能手机广泛应用,用户体验、视觉界面(UI) 设计、交互设计对于网络产品来说是赢得用户的关键特性。苹果、google等顶级企业的成功案例已经深刻说明了这一点。打破传统界限,连接商业与技术,在新商业环境中实现更大的价值,把设计领域、设计概念向外延展...

    2018-03-30
  • 用户体验再度升级,共享租车现里程碑式进步

    近日,国内共享租车领导品牌凹凸租车发布最新APP 4.0版本,该版本通过优化匹配算法和系统功能,在业内首度实现共享租车平台零拒单,免除了用户交易后租不到车的后顾之忧。同时,新版凹凸租车上线了“精选优车”频道,全面提升用户的租车体验。零拒单,用户所租即所得在共享租车行业,用户租车后遭遇车主临时拒单或取消的现象成为一大痛点。在凹凸租车4.0新版本中,平台通过车源端优化、车辆接单标准化、智能推荐匹配算法和系统功能升级,实现了工作时段的无拒单、...

    2018-02-01
  • Axure网页Banner大集合、Banner模板、京东Banner...完整版rp源文件下载

    网页Banner大集合,banner模板、天猫banner、拉勾banner、严选banner...已发布在产品大牛http://www.pmdaniu.com/rp/detail/54529只需完成以下2个任务,即可免费拿到完整版RP源文件:1、打开上方链接地址:在该页面中点赞、下载、转存、好评;2、长按下方二维码,并关注“亮亮原型”微信公众号;最后:将完成的任务截图,发送至QQ邮箱:653390398@qq.com邮件标题请使用“网...

    2018-04-02
  • 同学进了大公司的UED部门,我想一部分原因是…

    2017年开年,已经陆续有毕业生提前找实习工作了,在与一位成功入职的新人设计师交谈中,有一个重要发现:交互设计越来越受重视了。这位计算机专业的小伙伴,机缘巧合接触了设计,从此一发不可收拾,短短不到一年时间就熟练掌握了PS、AI、AE等软件,还自学了手绘技能。不过即使如此,她的求职仍困难重重。不是985 重点大学/非视觉传达专业/只会画图标界面等等,都成为用人单位将她拒之门外的理由。虽然要求有点苛刻,但站在公司的角度,想要在浩浩荡荡的求职...

    2018-01-31
  • 用户体验设计中的功能动画

    一位优秀的用户体验设计师能够轻松地解释设计概念中每个决策背后的逻辑。包括信息架构、页面内容结构、流程及假说。动画迟早会被融入线框图中,但在做设计决策或解释它们的时候,就会略显尴尬,因为理由基本上就是“这很酷啊!”或者“这很流行”“多有意思”,这些理由使得设计一开始就毫无说服力。在考虑设计时,我们应该更加深入地研究动画,就像解释其他设计元素那样,有依据地定义动画并解释其目的。→什么是功能动画?功能动画是一种微妙的动画,我们将它嵌入到用户界...

    2018-03-22
  • 什么是交互设计?这篇文让你彻底弄清!

    达内UI设计,中国UID课程标准制定者通常来说,拥有成熟产品的大型互联网公司都会设有交互设计岗位,这个岗位在近几年的招聘市场上也越炒越火。不同于视觉设计师有可视化的作品展示,交互设计师的工作大多无法直观可视化或出于保密性难以对外展示,所以在大众心目中始终是神秘的存在。所以今天就来给大家分享一下我作为一个交互设计师眼中的交互是什么样的。文章的目的是帮助对交互设计不太了解,但工作相关或对此感兴趣的人对交互设计进行基础入门的了解,所以采用了尽...

    2018-04-08
  • 从用户体验的角度聊《南方公园:手机破坏者》是如何盈利的

    原文作者:Matt Suckley & DeltaDNA欢迎回到In-App Purchase Inspector,在这里我们会以消费者的视角,定期测评一些F2P游戏。每期文章,我们都会考虑游戏中IAP的诱因、压力、它们的感知价值、IAP带来的扩展内容还有整个游戏体验的评估。最终目的就是看看这游戏究竟值不值得我们砸钱,不花钱的游戏体验是否也能让玩家感到满足。本期文章,我们与数据分析公司DeltaDNA合作,对改编自动画情景喜剧《南方公园...

    2018-04-02
  • 2018用户体验趋势报告

    在2017年我们看到了很多用户体验的进步和优秀的产品。在与来自全世界的189489名设计师分享学习了1926篇优秀文章之后,我们(uxdesign.cc)分析得到了2018年的一些用户体验趋势。1 用户体验的死亡与重生作为用户体验设计师,我们一直都在争取尽早地参与战略决策,现在,设计师在项目中的地位越来越重要,那么我们要如何应对呢?你的app的用户引导页使用体验如何呢?下面是最佳的自查表;不确定哪种导航最适合你的网站?去看看网站设计样例...

    2018-02-03
  • 从用户体验的视角聊首款《CSR赛车(CSR Racing)》

    原文作者:Om Tandon我最近一直在玩《CSR赛车(CSR Racing)》和《CSR赛车:经典(CSR Classics)》,在近期的游戏中我发现,Natural Motion在该系列的核心玩法、货币体系、社交机制和盈利模式中都引入了许多新的花样和用户体验功能,这些新元素的加入为游戏的某些方面带来了更好、更流畅的玩家体验。CSR-Racing-iPhone(from theiospost.com)CSR系列专为手游玩家设计,会话时...

    2018-03-26
  • 用户体验丨有一点,我特别不服:我一向健康,这本“生命说明书”却告诉我,风险无处不在!

    我与优福的故事聚 集 幸 福 之 因[图片]癌症,是人们的恐惧中心。很多人平时身体棒棒,突然就倒下了,永远的离开。比如我婆家的姑爷,发现时已经晚了,无力回天[图片][图片][图片]。2013年,安吉丽娜·朱莉检测了自己的基因,发现乳腺癌症易感基因患癌率是87%!她提前知道,提前预

    微信热点 2018-02-01