交互设计 | 2个概念,梳理成熟的交互设计作品思路

交互设计 | 2个概念,梳理成熟的交互设计作品思路

直接上干货,给大家介绍作品设计中至关重要的两个概念——storytelling 和 process

这两词不是我拍脑袋想的,是我和很多hr(包括一些美国的agency,知名大公司如amazon)聊天的时候直接问的。

不仅如此,我的院长,一个在微软做交互十余年的researcher也说了同样的话。

交互设计 | 2个概念,梳理成熟的交互设计作品思路

1. storytelling:考验你如何包装作品的能力

让一个陌生人甚至是外行,五分钟内理解了你这个项目做了什么,发现了亮点,同时又很信服,这难道还不够牛逼!?

交互设计师本来就是研究如何提升输入输出这个过程体验的。能够用作品和面试官有效的对话,也侧面反映了这个交互设计师的能力。 

2. process:展示分析、思考、解决问题的能力

如果说storytelling考验你如何包装作品的能力,那么process就是实力了。process不是流水账,不是你第一步做了访谈,第二部画了线框图,第三步做个UI,这样的process一点意义也没有。


process是记录你设计过程中,每一次迭代,推进,修改,背后的原因,结果和分析。也就是展示你分析思考解决问题的能力。面试官看到了这种能力,也就确认了你可以利用这种能力解决未来工作中遇到的设计问题。

送你一句金句,storytelling 和 process 是用来展示你作为交互设计师的能力,而不是作品,作品集不如叫做能力展示集更恰如其分。这金句可是俺摸爬滚打hci界三年才有幸得知,你现在就知道了,可要加倍努力哟!

另外如果是申请美国学校的作品集,我个人认为突出challenge比较重要。欧洲的标准似乎是细节。国内的标准实在是纷繁复杂,有的看你线框图画的多不多,有的看你动画做的炫不炫。

交互设计 | 2个概念,梳理成熟的交互设计作品思路

交互设计 | 2个概念,梳理成熟的交互设计作品思路

举栗子,帮助大家更好地消化上述理论—— storytelling部分

①作者把过程用链接形式贴在页面里:

虽然这样让读者增加了点击动作,但是你点开链接就发现,过程真是太多了!要是全部展开在本页,就会有过于冗长,滚轮滚半天滚不到头的不爽感。我认为对于过程较多的作品,这个手法值得借鉴,也让读者一目了然你是通过怎样的过程达到了最终结果的。

②没有过多的设计元素干扰:

读者可以专心阅读内容。

白色页面,#363636灰字,没有用死黑,死黑看久眼会瞎。只用了加粗不加粗,字大字小这几种属性搭配使用,构成视觉层级。图片全部同样大小,3Diphone镇图。


有些童鞋会觉得这样很无聊,简直根本没有视觉嘛。可是让视觉元素减少的最大好处就是能让读者专注在里面的UX部分。大家注意看图,虽然只是3d iphone加上中规中矩的界面,作者却把Iphone凹出了各种角度,形成了视觉深度,所以看起来也不会太无聊。

③模块化的内容展示:

Journal甚至做了菜单,分成UX/UI, 视觉,技术三类。 方便读者从各个角度了解设计过程。 


交互设计 | 2个概念,梳理成熟的交互设计作品思路

不仅如此, 一般学UX的视觉做的都不咋样,这句话绝对不是无中生有,人的精力都有限,搞了ux就没空搞视觉,没空搞代码。所以普遍来说,做UX的视觉没有学平面的好,代码没有学CS的好。所以俺觉得,与其摆一大堆五彩缤纷的丑图, 不如这样素净的让人看着不闹心。有句话说的好,明明腿就没人长,干嘛非穿阔腿裤,咱露小蛮腰不好么!


交互设计 | 2个概念,梳理成熟的交互设计作品思路

然后,点开2rd usability testing链接,就进入了journal, 仔细看,favicon变色了有木有,小细节小细节。

Journal甚至做了菜单,分成UX/UI, 视觉,技术三类。 方便读者从各个角度了解设计过程。

交互设计 | 2个概念,梳理成熟的交互设计作品思路

——process部分

然后我们来谈谈PROCESS这个关键词是如何做到的。

仔细阅读作者的文字,作者首先提到这个usability test目的是测试用户是否能理解界面完成任务。然后标题出现了:“what's changed” , 作者说根据结果,他去掉了某些按钮,然后用户觉得好。

大家不要太在意这个过程是不是肤浅,至少作者做到了:


收集用户反馈(每一次迭代的原因)

根据反馈进行重新设计(每一次迭代的结果)

对新设计再次收集用户反馈(每一次迭代的分析和下一次迭代的原因)

我觉得"what's changed"这个标题不错,简单直白,也能勾起读者的兴致,如果是中文应该叫“转折点”?


交互设计 | 2个概念,梳理成熟的交互设计作品思路

交互设计 | 2个概念,梳理成熟的交互设计作品思路

交互设计 | 2个概念,梳理成熟的交互设计作品思路当然啦,不是说这种过程(或者迭代手法)一定最好最棒最合理。也不是说作者讲故事的方式一定最真最炫最动人。对于process来说,UX设计考虑的因素很多,user test只能说是最基础的。我觉得如果作者能从user test总结出更insightful(有深刻见解的,富有洞察力的)的看法也许会更好。

 比如说界面让人困惑的根本原因是什么,哪些设计错误是只针对这个课题,哪些错误是广泛的错误,等等。

对于storytelling来说,这更像是在探讨你想给面试官什么样的体验

甚至你要考虑是什么样的面试场合,如果是你和面试官面对面展示作品集,是不是使用平板会比电脑更方便?如果使用平板,你是希望面试官操作还是你自己操作?不同的使用场景也会影响你如何讲述你的故事,如何设计你的作品集构架。


交互设计相关文章:

从统计学和供需角度告诉你,交互设计专业为何如此吸金!

设计类专业可以转交互设计吗?| FAQ权威干货系列

你最想知道的北美交互设计前沿干货来啦!!!

【大咖说】交互设计 | 也许这些才是你作品集最需要的

*文章转自知乎稍作改动,原作者知乎账号:noTcenTer,转载需联系原作者。交互设计 | 2个概念,梳理成熟的交互设计作品思路

原创文章,作者:Tinadmin,如若转载,请注明出处:https://www.iamue.com/33457/

(0)
TinadminTinadmin
上一篇 2017-08-01 04:10
下一篇 2017-08-01 04:46

相关推荐

  • 准备入行交互设计之前,先来搞清楚这些基本概念

    一直以来,经常有学生来问我,“是该选产品设计好还是交互设计好?”或者“过去是做产品设计的可不可以转交互设计?”“是不是视觉设计转交互或者界面设计方便点?”等等诸如此类的问题。笔者注:“产品”既可以是物质化的…

    2017-08-03
  • 交互设计实例分享

    现在很多优秀的网站、移动应用中都广泛的使用到交互设计。网络上也有很多相关的文章,例如什么是交互设计,交互设计的流程是怎样的?但是设计从来不是空谈,理论和实际的碰撞,才能激发出更多的灵感。以下是我自己…

    2017-08-03
  • 三个维度解析一个产品的交互设计

    作者:飞起就是一jio链接:http://www.jianshu.com/p/ad13cebe513b本文以“微信首页”为例,用三个维度系统地解析一个产品的交互设计的方方面面首先我们来做个互动,请各位看官打开自己的微信,然后看到你的微信首页…

    2017-08-04
  • 提高交互设计技能的五个方法

     设计师 交互设计师  现在,所有基于Web进行设计的人都需要对交互设计原则有一个基本的了解。即使你没有在人机交互、用户体验设计或人性因素等方向的正式学习训练,但只要你了解这些学科的基本原理,依…

    2017-08-01
  • 浅谈微信应用交互设计

    微信应用相信大家都不陌生,比如前段时间风靡朋友圈的神经猫,就创造了三天过亿访问量的神话,开发一款好玩有趣的微信应用,通过微信朋友圈的自发传播,达到品牌和产品的有效推广,是当下很多企业都在尝试的,但事…

    2017-08-02
  • 交互设计:补上学校不教的这一环

    作者:郦橙 锦妖链接:https://zhuanlan.zhihu.com/p/25279058不知道其他专业有多么具体和细致,我自己的专业(CMU Mii-PS)是典型地抓大放小,各种设计实操细节统统不讲,全靠自己摸索。我也曾经狂看blog,看书,…

    2017-08-02
  • 从零开始学交互:经验分享之基础阶段一

    【对用户体验设计的理解】 对于我个人而言,喜欢以咬文嚼字的方式去理解一个新的词语,这正是汉字的艺术所在。用户体验设计=用户体验+设计。一说到设计,很多人会联想到绘画、创意、各种漂亮的手稿。这是对艺术和设…

  • 交互设计背后的心理学原理

    作者介绍郑少娜,云之家里一只特立独行的用户研究员。想把生活踩在脚下,说:“叫你搞事情!叫你搞事情!”✦✦✦✦✦某次下班偶遇一开发,他问:“你们平常做的交互设计,有什么准则吗?”我列举了尼尔森十原则之类,却遭到…

    2017-08-01
  • 如果你想成为一名交互设计师

    第一篇:Cooper《如果你想成为一名交互设计师》    我们收到很多来自学生和可用性从业者的邮件询问如何成为一名交互设计师,需要什么样的背景才能进入这个行业,怎样才算优秀的交互设计,需要什么样的实际技能和经…

    交互专题 2016-10-26
  • 12个很不错的UI交互设计动效灵感

    转自:设计达人(ID:shejidaren888)链接:http://www.shejidaren.com/ui-interactions-01.htmlUI动效设计是每位设计师们的一个进阶技能,我们做动效时,不仅仅要有用,而且还有好看哦,今天达人分享来自muzili整…

    2017-08-02