交互设计怎么入门呢?

经常会有童鞋来问我:“交互设计如何入门?工业设计转行做交互设计的门槛高吗?用户体验和交互设计的区别是什么?”工业设计转行做交互的门槛并不高,就像工业设计需要考虑用户和实体产品之间的互动一样,交互设计更多的是考虑用户与界面之间的交互,只是换一个载体,其理论体系挺相似的。设计技能并不能弥补设计思维上的欠缺,技能只是一种表达方式,而Design Thinking才是最为核心的价值。基本概念浏览招聘网站上的讯息,就会发现UED,UX,UI等不同...

经常会有童鞋来问我:“交互设计如何入门?工业设计转行做交互设计的门槛高吗?用户体验和交互设计的区别是什么?”


工业设计转行做交互的门槛并不高,就像工业设计需要考虑用户和实体产品之间的互动一样,交互设计更多的是考虑用户与界面之间的交互,只是换一个载体,其理论体系挺相似的。设计技能并不能弥补设计思维上的欠缺,技能只是一种表达方式,而Design Thinking才是最为核心的价值。

基本概念

浏览招聘网站上的讯息,就会发现UED,UX,UI等不同头衔。那么他们之间怎么区分?

交互设计怎么入门呢?

侧重点不同

1、UED(User Experience Design)用户体验设计,有些公司也称为UX,更关注用户的心理预期。是基于用户画像、和细分用户使用场景,去了解用户在使用过程中存在的体验不足,关心的是整个服务系统中人的交互行为。

设计要具有全局观,关心用户在服务各个环节中的不同需求,需要掌握行为学和用户心理学。可以说UED是个全流程设计,设计师需要掌握一些用户调研能力、一些交互模型搭建能力、一些界面设计能力。

学生口中的交互设计更多的是指IxD(Interaction Design),主要定义交互系统的结构和行为,交互设计师只关注设备和用户的交互行为,需要具备逻辑思考能力和行为学背景。

UI(User Interface)交互界面设计,是用来表达功能和反馈用户行为的重要媒介,思考更多的是设计美学,考验设计者对设计工具与视觉法则的掌握程度。

交互设计怎么入门呢?

新零售的无人货架(来源网络)

以无人货架为例。UED要考虑的是用户在使用无人货架购物的全流程的用户体验,包括了扫描二维码,进入应用程序、浏览商品列表、在线付款、线下获得商品、获得红包等。IxD要考虑的是用户在使用应用程序的过程中的交互问题,包含浏览商品列表,线上付款和获得红包等流程。而UI只需要关注应用程序中各个界面的设计,例如商品列表页、收款界面、支付成功页面、红包页面等的具体视觉设计。

当然,在实际设计中并没有这么明确的界限。理解不同,才能明确选择。

交互设计流程

所有的设计流程都可以参考IDEO的design thinking process,如下图

交互设计怎么入门呢?

IDEO‘s Design Thinking Process

交互设计流程:

1、DISCOVERY:理解所要解决的问题。设计被用户所认可就是解决用户在使用和体验上的痛点,满足他们的需求并给予惊喜。第一步Dicovery对于任何产品都是适用的,无论是初创产品还是成熟产品的迭代。

挖掘用户需求的方法有很多,比较学术全面的介绍就是Design Research Methodology,比较常用的调研方法有问卷调查Questionaire、桌面调研desk research、访谈Interview、观察Observation、体验Be a user等。其中问卷和桌面调研为定量分析,通过大量的数据分析找准市场定位以及技术支持;访谈和观察为定性分析,帮助你更加准确地抓住人群特征和现有设计的不足。前期调研的不充分,很可能直接导致后面用户行为、用户需求的错误分析,在设计阶段就无法真正缔造有价值的设计,说服不了自己,更说服不了甲方。

2、INTERPRETATION:定义用户需求。针对上一阶段调研所得,设计师要提炼理解并融合用户的需求,获得用户画像Persona。Persona指的并不是某一个具体的人,而是Lead User,是一类生活习惯相似,消费水平想近,最为重要的是核心需求一致。定义流程如下图所示。

交互设计怎么入门呢?

Lead User 定义流程(来源网络)

3、IDEATION:提供解决方案。经过头脑风暴尽可能多的收集想法,经过筛选找到可行方案,进行线框图/流程图的绘制,最后到原型图的绘制,所有的创新方法在这个阶段都适用。很多时候,这部分是团队协作的结果,单打独斗的设计容易片面而造成交互流程上的不完整。

交互设计怎么入门呢?

Mobile Wireframe(来源网络)

4、EXPERIMENTATION:测试。测试的方法有很多种,罗列两个经常用到的方法:a.可用性测试usability test,以线上app的测试为例,就是在手机端的虚拟机上进行跳转、响应、界面等一些列的测试。

AB test,这个方法经常用于效益不确定的情况下,在现有用户抽样,一组所见设计为方案A,另一组为B,在一段时间之后,用调研或者收集数据的方式评估,胜者最终上线为所有用户所使用,这个方法是公司最常用的方法。


5、REVOLUTION: 迭代过程。随着时间的推移,设计师对于产品的理解会逐渐加深,一开始设计的交互流程可能会无法满足后来用户的需求。这就需要交互设计师不断体验,不断迭代,不断修复漏洞。这里IDEO的Design Thinking Process依然适用。

交互设计怎么入门呢?

总结:要学会问WHY(为什么想要),理解WHAT(到底要什么),这两个问题理解清楚后,再去想HOW(如何实现)。希望每一个设计都能让解决一些用户需求,make the world better。

工具技能加持

熟练掌握工具可以帮助你快速导出设计方案,提高工作效率。

  1. Axure:鼻祖级的交互设计工具,功能大而全,可做低保真,可做高保真,可做动效,插件众多。对于移动端的设计在软件本身的操作上不是很灵活。高保真的绘制精细度也不够,目前更多的是用来做低保真原型。

交互设计怎么入门呢?

Axure界面截图(来源网络)

  1. Sketch:针对移动端而设计的软件。可做低保真、可做高保真。且高保真的效率非常高,各类阴影效果和图片裁剪功能非常齐全。插件众多,比较常用有可导出html各式标注的measure,可快速生成占位符的Content Generator,移动端的虚拟机Mirror等等。基本上可以满足交互设计师在设计中的需求。

交互设计怎么入门呢?

Sketch软件截图(来源网络)

  1. Flinto:原型设计软件。界面和sketch非常相似,在做动效方面比较出色,界面间的转场,滚动效果以及点击反馈等。并且可以直接与sketch相匹配,文件相互导入导出。

存储方式为mov以及gif,可直接发送给团队成员,对于展示交互流程非常方便,可直接上传至dribbble,与全球优秀交互交互设计师分享。 

交互设计怎么入门呢?

Flinto界面截图(来源网络)

  1. Cinema 4D:适合做比较复杂带有空间变化的动效。功能非常强大,但不适合做app页面间的动效,比较适合做专题页中的营销动画,以及动画游戏的特效。

交互设计怎么入门呢?

Cinema 4D(来源网络)

  1. 墨刀MockingBot:强大易用的原型设计与协作软件。借鉴了Axure的一些功能,优点是操作简单容易上手,可做全流程的mockup,同样可直接倒入sketch的高保真文件。

墨刀的每一个图标都被设置成模块,带有动作链接锁链,可通过直接拖拽链接界面,非常傻瓜式的操作。它可以允许设计者邀请一名或多名队员参与协作,也可直接导出到手机上的虚拟机,直观地体验交互流程。适合做低保真原型,与高保真的交互流程。

交互设计怎么入门呢?

墨刀界面截图

还有Adobe的AE和PS也可以用来做原型设计,教程网上应有尽有。还是强调软件只是帮我们快速导出设计的工具,只要熟练掌握一款全面型软件,或者几种软件相互配合覆盖工作流程即可,做到最直接地向产品经理展示交互流程设计。

推荐一些交互设计网站:

UI设计

1.http://www.uiparade.com/发现最好的UI设计图库

2.https://www.mockplus.com/blog推荐UX / UI设计资源和有趣专题

3.http://designrfix.com/logo/tips-design-perfect-logo提供最流行的网页和图形教程

4.http://www.fltdsgn.com/给出案例和相应的UI网站

5.https://www.siteinspire.com/让用户体验不同网站中的交互设计

6.https://www.chainco.cn/app帮助交互设计师进行演示的工具

动效设计

1.http://www.uisdc.com/c4d-photoshop-2017-font-poster教你用C4D+PS作出2017特效字体海报

2.https://www.youtube.com/channel/UCKQ7xHm52MlA8MSxjVj-Nwgyoutube上专注于分享flinto动效制作过程的博主

3.http://www.woshipm.com/rp/614989.html?utm_source=tuicool&utm_medium=referral墨刀教程:如何快速制作一个APP首页原型

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

(0)
交互精选交互精选
上一篇 2018-03-23
下一篇 2018-03-23

相关推荐

  • 澳洲留学 | 交互设计专业硕士大解析

    📢:1⃣️条信息,足以改变你的未来!欢迎关注本平台交互设计在中国是一个新兴的产业,但是随着中国电子系统对人们生活影响的逐渐扩大,中国交互设计师将面临一个很大的缺口。什么是交互设计专业?1.words 语言语言是互动的最基础部分。人与人之间的互动是通过语言来进行基本交流。人也通过语言与机器进行交流。这里的语言可以是文字形式、语音形式、或动作形式等。在美国,一个好的交互设计师,也是一个很好地copy writer,需要具备良好的语言沟通和文...

    2018-04-06
  • 小白学Axure,这样学更高效,还能提升产品交互,更容易拿高薪

    众所周知,Axure是产品经理必备的工作软件。BAT对于产品工作2-3年的面试者,均要求熟练使用Axure。别让Axure阻碍你的高薪产品路!别等面试时,才发现自己掌握不够。“起点学院&腾讯课堂”联合打造6周Axure实战班,第6期开启报名!从第1期到现在,1400多位同学学习成长,好评如潮。花3-5分钟了解,很快Axure对于你,就不再是问题。(真诚地说)先来看看学习效果全程实操,学完高效制作原型,做出高保真认真学完,原型效率提升,更...

    2018-03-04
  • 交互设计之架构真经

    建立信息架构是交互设计师主要工作之一,是需求转向交互稿中非常重要的过程。一个架构的好坏决定这这个产品未来的命运,只有具有一个好的信息架构,才会具有一个好的产品体验。以下将从认识——前期工作——如何产出——如何判断,四个步骤来介绍信息架构。一、何为信息架构信息架构设计是对信息进行结构、组织方式以及归类的设计、好让使用者容易使用和理解的一项艺术与科学。这是比较官方的说法,简单通俗的说法就是对信息进行组织和层级分层。当我们一看到购物车这个信息...

    2018-05-01
  • 国服筹备进度公开 将重点打造用户体验和品牌社会影响力

    4月22日UP2018腾讯新文创生态大会(以下简称UP大会)当晚,腾讯于北京举办了一场《绝地求生》国服生态交流会。本次交流会邀请了来自各大硬件厂商和直播平台的代表与《人民日报》、《解放军报》、中央广播电视总台等十余家主流媒体的嘉宾参加。腾讯游戏副总裁黄凌冬、PUBG公司中国区总经理郑秀英、PUBG开发室室长李昌浩、PUBG公司创意总监Brendan Greene、腾讯互动娱乐合作市场部总经理朱峥嵘、腾讯互动娱乐PGame合作产品中心总经...

    2018-04-25
  • 【优秀作业展示】交互设计基础(一)

    《交互设计基础》是学习交互设计的重要课程,在大三上学期开课。任课教师是工业设计系的华梅立老师,通过老师的认真指导和对该课程的学习,大家对交互设计有了进一步的了解,在老师的引导下,同学们对高铁取订票界面设计进行了深入的分析和再设计,并选取了感兴趣的小方向进一步拓展。接下来就看看学完本课程后同学们的优业。优秀学生作业第一期周亦辂产品设计1511高铁取订票界面设计色彩选取字体:冬青黑体字号:18、21、24、28、30、32、36风格:利用从...

    2018-04-04
  • 【线下沙龙】产品经理交互设计大会

    2018年产品经理交互设计交流分享大会活动背景一个优秀的产品经理不仅能引导产品的发展,而且还能引导公司的发展。同时,他还是一名优秀的执行者、项目管理和团队管理者,具备敏锐的洞察力,能在用户心理和产品细节间灵活游走,打磨出令人惊叹的产品。所以,在成为CEO之前,先成为一名出色的产品经理吧。然而当我们投入到实际工作中时,总是一次又_次遇到阻碍:和运营、枝术部门沟通不畅,项目推进难。公司要求不高,任务很轻松就能完成,想要挑战大公司,却深知自己...

    2018-04-22
  • 在Sketch中做游戏?盘点那些你不知道的奇葩Sketch插件

    静电说:我想你一定是看了这个标题进来的,对,今天静电就要来给大家介绍几款看起来很奇葩的Sketch插件,甚至有些插件可以直接生成游戏!诶哟厉害了我的哥哥!来看看吧。Latex Sketch PluginLatex这款插件可以生成像下边的带有上标的公式,也许这个适合数学老师来用。当然如果各位小伙伴有做这方面设计的话,也许可以给你不少惊喜。嗯,这个插件已经被爱因斯坦点赞。下载地址:http://www.sketchchina.com/rea...

    2018-03-02
  • Axure实验室 | 带放大效果的轮播图

    提起轮播图,相信大家已经非常熟悉了,脑海中自然而然的会浮现出轮播图的交互效果——几张图片,可以逐一的左右切换显示,而每次只能显示一张。这是最基本的轮播图,当然,我今天要讲的不是这种。还有一种轮播图,会同时显示三张图片,中间的图片会放大显示(相比左右两边的两张会大一些),像下面这样。阅读原文预览然后左右切换的时候(通过点击左右按钮或者左右滑动),左右两边的图片移动到中间位置时会动态放大,而中间的图片移动到左右两边时会动态缩小。另外,这种轮...

    2018-03-15
  • 尼尔森十大交互设计原则的实际应用解析

    Jakob Nielsen(雅各布·尼尔森)的十大交互设计原则被称为“启发式”,因为它们是广泛的经验法则,而不是特定的可用性指导原则。因此,我们不能把它上升为一种标准,而是应该当做一种经验来学习,然后跟现实中的设计结合来使用。接下来,作者通过一些具体的实例来跟大家深度解析尼尔森十大交互设计原则在设计中的用法。Jakob Nielsen(雅各布·尼尔森)是毕业于哥本哈根的丹麦技术大学的人机交互博士,他拥有79项美国专利,专利主要涉及让互联...

    2018-02-16
  • 交互系统和设计目标

    交互设计:是针对用户与产品之间的“交互行为”来进行设计。可以理解为对交互系统的设计。系统的概念系统可以类比为自然间的生态系统、人体的生物循环系统、公司也是一个系统。他主要有一下几个基本概念:1、系统是一个有机的整体,各个元素之间不可分割,相互作用构成系统。2、这个系统定具备明确的功能,可以用来完成某项任务或支持某些行为。3、系统的功能是由所有的要素共同支持的。4、系统的功能应是稳定的,在各种使用场景下,都能提供功能。5、系统的功能应具备...

    微信热点 2018-02-11