马海祥博客是一个专注于分享SEO优化、网站制作、网络营销和运营思维的自媒体博客!
马海祥博客 > 网站制作 > 交互设计 > 交互设计师必须知道的五大交互设计流程

交互设计师必须知道的五大交互设计流程

时间:2014-05-06   文章来源:马海祥博客   访问次数:

交互设计又称互动设计,从用户角度来说,交互设计是一种如何让产品易用,有效而让人愉悦的技术,它致力于了解目标用户和他们的期望,了解用户在同产品交互时彼此的行为,了解“人”本身的心理和行为特点。同时,还包括了解各种有效的交互方式,并对它们进行增强和扩充,交互设计还涉及到多个学科,以及和多领域多背景人员的沟通。

交互设计师必须知道的五大交互设计流程-马海祥博客

其实,交互设计需要做的事情也不是一成不变的,它会随每个交互设计师的工作内容差异而不同,具体到每个项目也会有区别。下面我就在马海祥博客上分享下我是怎样做交互设计及做交互设计的五大流程,方式不一定合适所有的交互设计师,但却能说明一些你想要了解的问题。

一、发现用户需要,建立明确需求

发现用户需要的方式有很多种,我们可以在用户反馈里收集到许多用户提出的想法,他们希望我们能提供帮助解决问题的产品;我们也可以主动去观察一些生活中的信息,为灵感的迸发做储备。

比如说网页的隐形加载机制项目,有不少用户跟我们反应说,他们有时因为网站的图片太多或太大,会导致网站页面加载慢,同时在加载的过程中页面显示都空白的,所以希望能提供一个专业的隐形加载机制功能,能够帮助他们有效的展示页面的显示情况。

确认了用户的这一需要,我们的产品同事就会组织立项,把用研和设计组的同事呼唤过来一起进行调研(具体可查看马海祥博客的《交互设计的三大隐形机制:加载、刷新和缓存》相关介绍),确定我们的目标用户。

用研组会通过问卷调查等方式尽可能多的去收集信息,交互设计师也会参与分析调研,组织会议帮助用研组完善信息,我们会采取一些有趣的方式,比如一堆人在一起头脑风暴,大家回忆各种相关的生活场景,然后把一些关键词记录下来。

这一步我们的目的是要知道:用户想要什么?

通过这些步骤我们提炼出一些最重要的功能需求,接着产品组会整理出需求文档,设计师就位。

二、提出设计方案

通过调研,我们得到了大量数据信息,并建立了明确的需求,下一步就是开始提设计方案。

这个阶段我会做一些概念设计,类似于做实物产品时设计一个水杯,我会描述它说:我要设计一个旅行用的水杯,它能叠成一个小圆盘,喝水的时候只需要把小圆盘的圆心部分往下按,就能变成一个杯子。

互联网产品也是这样,需要赋予它一个概念,例如日程管理:这是一个专业的日程管理功能,通过使用它,我们可以有效的管理自己每天的日程和时间,以提高工作效率,并且不会再错过每个重要的约会!

这些文字并不一定非是交互设计师所总结,但是交互设计师必须要做到对产品心里有数,明确我们要做什么。

同时需要进行的还有初稿设计,在这里我所谓的初稿,并不一定是严格要求中的交互原型,可以是用工具软件把主要的页面流程做出来,也可以手绘草图,只要能清晰表达设计构思的,什么样的方式都可以。

三、制作设计原型

制作设计原型,也就是常说的交互稿,区别于做设计方案时的初稿,这份交互稿我会尽可能细致的把流程和具体操作形式表达出来。

考虑到做交互是一个迭代过程,马海祥会在设计稿的首页为设计的产品做一份交互更新日志,记录下交互更新时间、版本名称、更新类型、更新内容、参考需求文档与交互负责人。如下图所示:

交互设计师必须知道的五大交互设计流程-马海祥博客

马海祥觉得对于这份更新日志的意义在于:

1、更新时间:便于全程跟踪记录项目,掌握每个时间点。

2、版本名称:便于项目参与人员查找上一版本的交互稿。

3、更新类型:了解每次更新需求的性质。

4、更新内容:清晰呈现每一次更新的内容,并提供一个直接去到更新页面的链接,这样在进行迭代时我们的伙伴不用一页页去寻找更新点。

5、参考需求文档:便于项目参与人员查找对应的需求文档。

6、交互负责人:记录每次迭代的交互负责人,并能方便工作交接。

交互稿的制作过程,一般是要先做原型的,像一些视觉比较成熟且相对稳定的产品,我会偏向做高保真模型,我们会整理一个控件库,这样能提高制作效率;做一个全新项目时,黑白稿线稿都是可用的方式,如果交互设计师能对大概的视觉效果有把握,也能做得精致些。同时,也要保证页面的合理性(比如我曾在马海祥博客发布的一篇关于网页分页导航的问题,具体可查看《网站分页导航的10大交互设计因素》相关介绍),这些我想大家都很了解,所以不多说了。

四、制作交互设计说明

交互设计师必须知道的五大交互设计流程-马海祥博客

之所以把这部分内容提出来单独写一段,是因为之前和很多做交互的朋友讨论过该怎样做好交互说明,大家各有看法,很难找到这部分工作的衡量标准。

交互说明书在整个设计过程中,也许只会占用小部分工作量,但是作用不小,它能帮助我们减少沟通成本,辅助交互稿描述设计理念,表达交互流程,更细致的展现我们的设计。

与做设计稿不同,个人认为,交互说明这部分工作,需要我们更多了解它作说明的对象,即产品经理、视觉设计师、开发人员的需求,从而达到真正的“辅助”效果,而不是盲目凭自己主观去长篇大论,否则我们要为此花费时间,而且这部分工作只能沉积为一堆我们自己欣赏毫无意义的文字。

为此我曾与合作过的各组同事进行沟通,提炼出一些他们对交互说明的需求,不求全面,但求能说明一些问题。

1、交互说明最好是图文并茂(all)

其主要作用就是便于阅读和理解。

2、页面跳转的说明(产品&程序)

页面跳转是涉及多个页面关系的操作,产品人员在看交互稿时,会更多去关注多个目的性的任务操作流程,而对页面跳转的记忆是有限的,所以需要页面跳转说明。

3、交互说明能否考虑与产品需求文档结合(产品)

开发文档会涉及产品概念、技术方案、业务执行角色等内容,和交互设计稿有着紧密关联,所以,马海祥觉得交互说明书与开发文档是可以相互做补充,整理成一份文档,这样也能避免工作内容重复。

4、对交互稿中不明显的交互动作或隐藏的设置项作说明(产品&视觉&页面构架)

细节和动作需要描述清楚,比如说鼠标focus、click的动作,或click后是loading还是跳转,这些平时都是开会上讨论,但是参与项目的人员不一定都能记住,所以会需要在交互说明书里做说明,并需要考虑到页面构架组需要预留适应变化的结构。

5、产品风格定位(视觉)

商务风?休闲风?视觉需要一个准确的产品风格定位。这部分工作不一定是由交互人员来确定,但在产品孕育阶段中,设计稿讨论以及不定时更新的数据调查,会使得产品风格定位渐渐明确,视觉的同事更多是参与设计阶段的工作,这就需要交互人员将这些信息在交互说明中记录下来,以辅助视觉完成。

6、极限状态(前端)

比如一个列表最长和最短显示。

7、异常/出错情况说明(程序)

这一点在交互稿制作和与产品沟通过程中容易被忽略。

有的设计师会疑惑:为什么我做的设计说明书会没人看?我写的很详细了,但是他们还是会问我一堆设计的问题!甚至,问我为什么要做这个文档?

在这些情况面前,设计师应该做些思考,我们所制作的这份说明是否真正解决问题了呢?

一些基本的逻辑判断和文字内容(具体可查看马海祥博客的《如何个性化设计字体的风格》相关介绍),产品人员已在需求文档中列出且在交互稿中已清晰呈现,例如原型中完整呈现的设置内容,或一个单选复选关系,这些内容我们再花时间去大篇描述,并无太大意义。

所以,马海祥的理解是,交互说明并不一定是一份文本,它不该是设计师的舞文弄墨,更不该流于形式做交互设计原型的复制品。

我们可以在交互原型上注释,在图上写说明,或者是在和项目组发邮件时写为邮件内容,当然也可以是word文档,PPT…。

总之,我们要做到的是真正解决问题,让交互说明书成为帮助项目中各组成员之间进行有效沟通、辅助理解设计内容从而达到提高项目效率的工具,并在需要的时候被制作。

五、用户测试与评估

交互设计师必须知道的五大交互设计流程-马海祥博客

产品基本功能实现后,我们会做用户测试,设计是很主观的,并且会受各种因素影响,所以我们的产品难免会存在一些意料之外的问题,通过招募用户来使用我们的产品,我们能收集到一些使用场景中发现问题的反馈,并把这些整理成优化点,完善我们的产品。

同时交互设计师也要多用自己的产品,保证上线内容与设计保持一致。

这就是我对自己交互工作的一个相对完整的描述,我的感觉是,这是一份很有意思的工作,因为我自己也是一个用户,我会在使用产品的过程中发现这样那样的问题,所以我也自然而然的想去解决这些问题,并在寻求方法中得到一定的积累。

然而,这也确实是一份很需要花心思的工作,设计方式自由,但是设计内容需严谨,疏忽了一个问题,就有可能为产品带来极大的负面影响,甚至失去用户的青睐。

要让我们的产品保持良性发展,就要求设计师们不断探索优秀的设计方法。

马海祥博客点评:

交互设计师不能依靠市场调查出的用户需求来做事,因为这些是最低的要求,只能保证我们不犯错,我们要发现用户潜意识里的渴望。我们要主动的去发现用户的需求,然后用各种方法满足用户的需求。所以,这就要求交互设计师通常是超级敏感的,具有很强的观察能力,创造能力以及表达能力。因为我们真正要设计的,是那些不可言说的感受。

本文发布于马海祥博客文章,如想转载,请注明原文网址摘自于http://www.mahaixiang.cn/jhsj/555.html,注明出处;否则,禁止转载;谢谢配合!

相关标签搜索: 交互设计   交互设计师   设计流程  

上一篇:交互设计的三大隐形机制:加载、刷新和缓存
下一篇:基于用户体验的移动端交互动效设计

您可能还会对以下这些文章感兴趣!

  • 如何将需求还原成情景变成可用性设计?

    可用性是交互式IT产品或系统的重要质量指标,主要用来表示产品对用户来说有效、易学、高效、好记、少错和令人满意的程度,即用户能否用产品完成他的任务,效率如何?主观感受怎样?实际上是从用户角度所看到的产品质量,是产品竞争力的核心。为了优化产品,提升用户体验……【查看全文

    阅读:789关键词: 可用性设计   情景设计   日期:2014-11-29
  • 基于滑动维度的交互设计变化

    最常见的滑动如ios里删除短信息的操作,这里的滑动是最基础的,可以理解成一维的、被赋予唯一功能的操作。如果你认为滑动就是这么简单,那可能忽略了滑动可以为设计带来的千变万化。当滑动被赋予功能,并与界面(信息或控件)结合时,具有很强的可塑性,并可有效提升操……【查看全文

    阅读:580关键词: 滑动维度   交互设计   设计变化   日期:2014-07-02
  • 基于用户体验的移动端交互动效设计

    在网页设计领域,有不少设计师对前端技术已经有了一定的了解。但是在移动设计领域,学习界面和交互效果如何用代码实现还没有受到设计师们的广泛重视。但我们认为这是很重要的一步,如果你了解了技术实现层面的知识,很多设计阻碍就会消除,创意更容易得到发挥也更容易在……【查看全文

    阅读:3373关键词: 用户体验   移动端   交互动效设计   交互设计   动效设计   日期:2014-05-16
  • 交互式视频设计的分类和实现工具

    交互式视频是指通过各种技术手段将交互体验融入到线性的视频的新型视频。它风靡起源于2005年,随着当时宽带接入速度的提升和多媒体播放技术的成熟,交互式视频越来越多,最初主要是由广告商赞助的广告视频,借用各种新奇的交互方式来吸引人们点击观看,增加产品的曝光度……【查看全文

    阅读:2138关键词: 交互式视频   交互设计   视频设计   实现工具   日期:2014-07-13
  • 交互设计的七大定律

    交互设计是一种目标导向设计,所有的工作内容都是在围绕着用户行为去设计的,交互设计师通过设计用户的行为,让用户更方便更有效率的去完成产品业务目标,获得愉快的用户体验,交互设计是一种如何让产品易用,有效而让人愉悦的技术,它致力于了解目标用户和他们的期望,……【查看全文

    阅读:1271关键词: 交互设计   日期:2015-08-10
  • 初次做交互设计的大致步骤有哪些?

    交互式设计师需要参与方案的实现,以确保方案实现是严格忠于原来的设计的,同时,也要准备进行必要的方案修改,以确保修改不伤害原有设计的完整概念,那么,对于初次做交互设计的朋友来说,交互设计过程中的步骤有哪些呢?交互设计的初衷就是解决用户的问题,不论设计什……【查看全文

    阅读:316关键词: 交互设计   日期:2017-01-25
  • 如何利用动效设计吸引访客的注意力

    动效设计是最夺人眼球的设计方式之一,正确的使用会在与用户的对话中起到很好的引导,不过也正因为它的强势,所以一定要梳理好设计目标,不要让其变为干扰,毕竟用户的注意力和时间都变得越来越少,我们要做的是更合理的利用动效来传达我们的信息,但动效也不是越绚丽越……【查看全文

    阅读:727关键词: 动效设计   日期:2016-05-28
  • 交互设计案例:产品结构化繁为简的设计理念

    化繁为简,从不是件简单事,如何既保证功能体验完整,又体现WP平台自身极简、轻量的特点,成了贯穿我们设计始终的思考。“真正的简洁不是删繁就简,而是在纷繁中建立秩序”,打造全功能版的云音乐WP端,无论是设计还是开发都经历了从混乱到有序的过程。……【查看全文

    阅读:4656关键词: 交互设计   交互设计案例   产品结构   化繁为简   设计理念   日期:2014-09-06
  • 交互设计的三大隐形机制:加载、刷新和缓存

    刷新、加载、缓存机制的设计,我不清楚是否应该归纳进交互设计师的职业范畴,但是作为一名用户体验设计师,这些点或多或少地影响着用户的使用体验,我们都应该给予足够多的重视。这些机制,独立来看都有现有模式可参考,但是交互设计师不应该把他们割裂地设计,不同机制……【查看全文

    阅读:4892关键词: 交互设计   加载机制   刷新机制   缓存机制   日期:2014-04-22
  • 交互设计师该如何做好交互设计

    前不久和一些朋友们聊天,觉得开发、PD和UED是一个很有趣的怪圈,通常而言:开发看不起PD,因为PD除了有想法,写点文档,看起来啥都不会,而通常开发们自己就很有想法;PD看不起UED,因为他们通常会觉得UED太事儿了,事儿太多,考虑得太细,他们根本就不明白这个东西对公司到……【查看全文

    阅读:1046关键词: 设计师   交互设计   日期:2016-02-21
↓ 点击查看更多 ↓

互联网更多>>

SEO优化 更多>>

一个完整的企业网站首页应该具备什么因素? 如何利用极客精神优化网站的网络组件和代码