掌握这5个方面,让你具备真正的交互设计思维!

Z Yuhan(英国约克大学人机交互硕士):交互思维是什么?网上的搜索结果大多是一些交互设计 的方法。但是我这里要讲的,是真正做交互设计 所具备的思维方式。交互设计在国内发展的并不成熟,还有很长一段路要走。很多人,甚至包括交互设计师自身,对这一工作的性质和价值都未必有足够的了解。

文章目录[隐藏]

掌握这5个方面,让你具备真正的交互设计思维!

Z Yuhan(英国约克大学人机交互硕士):交互思维是什么?网上的搜索结果大多是一些交互设计的方法。但是我这里要讲的,是真正做交互设计所具备的思维方式。交互设计在国内发展的并不成熟,还有很长一段路要走。很多人,甚至包括交互设计师自身,对这一工作的性质和价值都未必有足够的了解。

交互设计,听上去是“设计”,但是其本质和常见的UI和视觉设计相去甚远。“交互”指的是人类与机器之间的沟通,与美学、界面、按钮什么的,其实没有半毛钱关系。领域细分之前,也许我们考虑的东西越多越好,但是在细分之后的今天甚至未来,交互设计就要有它不一样的价值。

由于目前的大环境对这一细分领域仍旧缺乏了解,所以我希望在这篇文章里,写几个做交互设计所需要的思维方式。

1. 可用性优先,视觉靠边

一个功能首先要能用、好用,才会有人关心好不好看,审美挑剔的用户其实比你想象中要少很多。当然不是说视觉设计不重要,只是对于交互设计而言,解决可用性才是最优先的,而视觉上的优化,可以在下一个环节再做讨论。

例如下图这个例子,在一个较宽的页面上放一段较窄的文字:如果只以视觉感官来考虑,可能会设计出方案一(左);如果纯粹以可读性来考虑,可能会设计出方案三(右);如果两者都估计到,可能最后得出的是方案二(中)。可见单凭任何一个环节都没有办法得到好的方案,但是我们应该分清顺序,从各自的立场提供帮助。

掌握这5个方面,让你具备真正的交互设计思维!

2. 不寄期望于用户的理解力、耐性和信任度

通过长期的摸索和测试,你会发现用户这种生物,不但永远不会成长和进化,反倒变得越来越懒惰。十年前也许你可以用纯文本小广告骗到点击率,如今没有图片大家都懒得扫一眼。交互思维需要有一种佛祖般的慈悲胸怀(只是一个比喻),无微不至地对主流用户表示关怀(对不起,小众和非主流们)。如果你对用户行为感兴趣,可以去看我之前写过的这篇《你想象中的用户 vs 真实的用户》

例如下图,解析图片中,右边写清楚“解析中”帮助用户理解当前在等待什么,进度条帮助减轻用户的不耐烦,模糊处理的图片给用户“你的图没有丢,正在处理呢”的心理暗示。

掌握这5个方面,让你具备真正的交互设计思维!

3. 不脱离目标谈设计

交互设计师不喜欢听到:“请你设计两个界面,商品列表页和详情页。”

更好的沟通方式是:“我们需要为想要购买商品的用户提供信息,可选的商品数量有N个,用户最感兴趣的信息有……,一般人不会看但必须附上的信息有……”

这样做并不是矫情,而是不同的信息量和重要性,所对应的解决方式可能完全不同。并不是一提到商品信息,就都要想淘宝、亚马逊那样的结构。

例如下图,如果商品详情重要程度较低,很多人愿意直接购买(如 App Store),可以采用方案一(左),如果商品详情非常重要,不看几乎不会购买,则可以采用方案二。

掌握这5个方面,让你具备真正的交互设计思维!

4. 用户期望比逻辑更重要

有传言说交互设计需要很强的逻辑性,才能够梳理页面上复杂的信息。这想就错了,界面是为了便于使用而存在,如果用户不能快速理解和操作,逻辑再正确也丧失了意义。

拿到一大堆信息时,需要思考的不是改用总分、分总还是总分总结构,而是对用户来说那些事基础、主要和辅助功能/信息,详细可以去看我以前写过的《复杂页面的布局设计》

例如下面是简书网页端的布局分析:

掌握这5个方面,让你具备真正的交互设计思维!

5. 没有奇怪的设计,只有看不懂的设计

自以为对互联网产品很了解的人,通常习惯用定式思维来评判设计的好坏。例如,认为凡是符合设计趋势的(扁平化、卡片化……)就是好的,凡是自己没见过的,就是不好的。这样的习惯非常危险,因为用户从来不会以这些标准评判一款产品的好坏,对他们来说,能够帮助他们高效完成任务的,就是好的产品。

例如下图,你可能很少在手机上看到分页,但这并不是一个拒绝在手机上使用分页的理由。如果列表数量过多,需要支持用户逐条寻找,且在搜索和筛选上有一些限制,就有可能需要用到分页。否则,用户并不会觉得你的设计很符合当下流行趋势,而是烦恼无法完成自己想要的操作。

掌握这5个方面,让你具备真正的交互设计思维!

总结

交互思维并不能够取代任何东西,也并不比任何你之前所学到的东西更加正确,甚至并不是所有的交互设计都要有与之相同的思维方式。

如果你是交互设计师,我希望这篇文章能够启发你更加深刻地思考自己所在的角色以及能够提供的价值。

如果你不是,我希望这篇文章能够帮助你与交互设计师合作时,沟通更加顺畅,一起创造出色的作品。

欢迎关注作者主讲的的设计Live:「听完这个Live,你对复选框设计的知识就满格了」

想锻炼出结构化思维,好的工具必不可少:《做你大脑中的记号笔!15款为设计师而生的思维导图工具》

也可以看看专业设计师的思维是怎样的:《初级进阶教程!手把手教你培养专业的设计思维》

【优设网 原创文章 投稿邮箱:yuan@uisdc.com】

================明星栏目推荐================

优优教程网 UiiiUiii.com 是优设旗下优质中文教程网站,分享了大量PS、AE、AI、C4D等中文教程,为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章,按照我们的专栏一步步学习,一定可以迅速上手并制作出酷炫的视觉效果。

设计导航:国内人气最高的设计网址导航,设计师必备:http://hao.uisdc.com

原创文章,作者:震天下,如若转载,请注明出处:https://www.iamue.com/34151/

(0)
震天下震天下
上一篇 2017-08-17
下一篇 2017-08-23

相关推荐

  • 一个小小城市选择控件引发的深度思考

    很早以前小Q在《用好的交互设计来管理复杂-“筛选器”》一文,较为全面的剖析了筛选器的各种分类及其利弊。本文会继续筛选器的城市选择控件继续分析。A-Z index(字母索引)适用于对数据量为几十到几千之间的单词、词组或短语等类型的导航,且用户能对这些数据的首字母进行精确回忆。例如:国家、省份或城市的名称、姓名、昵称等。在移动端设计中A-Z index通常以竖轴形式出现在屏幕右侧,点击字母能将内容滚动到该字母的锚点位置。

    2017-06-07
  • UI 设计师如何让设计稿100%还原(上)

    大部分新手设计师可能都会遇到一个问题,设计效果很赞,为何还原效果那么差?是开发不行?然后就吐槽开发傻X,可很少有人想过是否是自自身的原因,在开发过程中就不断和开发撕逼。今天我介绍一些关键点,通过这套系统的方法来解决你的视觉还原度,希望这篇文章能帮助到你。

    2017-04-28
  • 图片优化的那些工具

    图片作为页面的一个主要因素,它的大小直接影响了页面的加载速度,这一点在移动端尤显突出。 怎么让图片的大小更小?除了选择合适的格式(jpeg、gif、png),我们还可以利用网上的应用(如smushit、tinypng、 image…

    2014-11-06
  • 经验分享丨赶集App中秋节的皮肤设计

    随着移动互联网的迅猛发展,同一款产品,使用移动端的用户远超PC端,为了更好的提升APP的用户体验,情感化设计也得到了越来越多的关注,通过它来唤起用户共鸣,带给用户愉悦的心情。

    2017-04-30
  • "用户体验“真是个万恶的东西。

    前些天跟一个在央企大鳄担任要职的朋友聊天,说起某互联网新闻媒介公司被责令整改的事情,(其实我都不确定每天操劳四化建设工作的他知道不知道这件事)我本人并没有什么观点,只是看周围的人都在吐槽说国家管的太碎了,于是就想听听他怎么说。没想到君付之一笑,言道”活该,就应该封了它,它那么大的用户群体,它那么强的社会传播性,它不负责传播正能量谁负责?难道让警察叔叔们一张张发传单传播吗?你做产品做好了挣钱了就应该想想怎么对社会发展负责,不然国家和这个世...

    2018-05-05
  • 如何建立交互设计自查表

    对于移动应用来说,移动情景非常复杂,设备也很多样。那么在设计之后,设计评审之前,你的交互稿考虑的细节是否完善,对特殊状态的描述是否有遗漏,你是怎么提前发现一些问题并查漏补缺的?为解决这个问题,我们团…

    2015-03-24
  • 浅析用户体验在APP界面设计中的表现及应用

    如果要成功运营一款APP,第一个基本的原则就是要全线贯彻落实“以用户为中心”的理念。当今这个时代,在设计过程中能够体现出“以用户为中心”原则的设计就叫做用户体验设计。这就不得不提到两个名词:即用户体验和用户界面概念的理解。一个成功的交互产品离不开优秀的用户体验,一个高用户的App更无法脱离用户体验设计。当产品和用户之间的连接点变成了摩擦点,那么工业设计师的设计就是失败的。相反,如果产品能让人们感觉更安全,更舒适,更乐于购买,更加高效,甚至只是让人们单纯地更加快乐,那么此处的设计师是成功的。

    2017-05-15
  • sketch都能设计海报了?PS爸爸慌了...

    sketch只能做界面设计?曾经我也这么觉得,自从我知道了他的这款插件——looper惊!呆!了!大写的“服”,sketch你越来越接地气了,废话不多说了,让我们先欣赏一张我用这款插件做的一张海报:不得不说,他打破了我对sketch的偏见,对线条的处理过渡很自然到位,我做的时候只花了5分钟,没错!5分钟搞定!所以重点来了:如何用looper做到这张海报的效果呢?第①步1.下载安装包2.双击  looper.sketchplugin完成安...

    2018-03-09
  • 蘑菇街App改版设计总结

    新版app在短短的一个多月内,完成了从方向调整到开发上线的全过程,而设计在其中仅仅只占一周多,这也是互联网公司面临的共性难题。为了配合产品小步快跑的策略,我们采用敏捷设计的方法:快速地进行竞品分析,根据低保真原型一边进行业务细化和方案讨论,一边进行视觉风格的设计。

    2017-05-12
  • 交互设计:给新人设计师的交互设计知识体系

    一篇完整阐述系统交互设计知识体系的文章,希望能够对新人设计师建立的设计知识体系有帮助。

    2017-05-14