不能不说的设计秘密:4个步骤提升交互思维

良好的用户体验包含很多内容:服务、产品、参与者的感受等等,显然产品功能的强大、界面的美观并不能完全概括体验。体验还包含在产品与用户之间的互动、产品与场景的交互、产品对用户的情绪上的影响等等的细枝末节中。第一阶段回顾:分析商业目标,描述了典型的用户模型、通过故事细化了用户的心理模型和行为模型。第二阶段回顾:交互设计师通过综合分析、发散收敛思维、提炼精化的过程,理清了流程中各个组件的关系,形成完整的产品图景。第三阶段回顾:主界面的打磨,细节体验的关注都是塑造良好体验的方法,好的产品应该让用户感知丰富、情感投入。第四阶段回顾:全面审视设计流程,通过专家评审等方式改进方案,规范总结设计方法。


良好的用户体验包含很多内容:服务、产品、参与者的感受等等,显然产品功能的强大、界面的美观并不能完全概括体验。体验还包含在产品与用户之间的互动、产品与场景的交互、产品对用户的情绪上的影响等等的细枝末节中。

不能不说的设计秘密:4个步骤提升交互思维

交互设计是设计人与产品接触的动态时间轴上的每一次接触,从一开始的靠近、到产生共鸣、赞美,在每一个接触行为的背后都有需要关注的用户情绪、需要理解的用户认知。卡耐基 · 梅隆大学设计学院的John Zimmerman等提出了一个设计过程发现和汲取知识的流程框架:define(定义)、discover(发现)、synthesize(综合)、construct(建构)、refine(精炼)和reflect(反思)六个过程,这个流程的每一步骤都确立在前一个步骤的基础上。

认知用户、定义设计的过程总是千头万绪的,各个流程之间也是交叉进行的,商业设计的具体实践中很难真的遵循如此明确的流程。源于对具体设计问题的理解,大致可以将交互设计的过程分成四个步骤:

  1. 识别需求,模拟场景(define、discover)
  2. 理清设计机会、定义功能(synthesize、construct)
  3. 交互流程与原型图(construct、refine)
  4. 反思评估、规范化(refine、reflect)

明晰的设计模式帮助产品从概念构想到完成品的整套过程。正如绘画作品希望传达给观者情感内涵一样,交互设计也是借由产品与用户进行持续性的对话来创造产品的使用体验。

一. 识别需求,模拟场景

1.1 判别问题和机遇

设计师接触到需求任务的时候,先与产品经理进行沟通,搞清以下问题:

  1. 产品想做什么?
  2. 用户是谁?
  3. 用户的使用目标是什么?
  4. 产品商业目标和用户使用目标一致吗?

设计师应该抱持着怀疑批判的态度来审视产品的“愿景”,对于产品经理提供的商业目标与用户目标是否一致,是不确定的。为了具体量化这种不确定性,可以通过一些具体的问题:产品想要给谁做?功能对用户有用吗?有过类似的产品吗?有没有用户反馈?

通过询问潜在用户、产品经理、为产品提供服务的第三方、了解现有数据等等途径,设计尝试了解用户诉求和商业目标,综合多种信息渠道后,如果觉得产品的商业目标和用户来到产品的目标是不一致的,那么产品是否值得做就需要再讨论。

如果判断产品商业目标和用户目标一致,那么设计师需要做的就是在用户需求和商业利益之间取得平衡。为了能够更加深入的了解目标用户的行为,做出人本设计的产品,就需要构建典型的“用户行为模型”,也可以说是讲个典型的用户故事。

1.2 模拟典型场景故事

为了再现真实的用户需求,需要模拟出真实的用户场景。场景包含了用户可能会施行的动作,也包含用户随着时间的进行所产生的情绪体验等。

优秀的场景故事必须富含丰富的细节,帮助设计师更加准确的预期用户的行为。在故事的构建过程中,有两点可以帮助设计师丰富、细化故事情境:

  1. 故事中包含哪些元素;
  2. 故事有哪几个节点。

1.2.1 故事元素

故事元素指的是典型场景的什么用户、什么心情、什么行为之类,帮助故事实际情境描述的更详尽。下面列举了故事中的元素。

不能不说的设计秘密:4个步骤提升交互思维

1.2.2 故事的节点

故事的情节按照时间轴的推进,一系列行为的演化着,有一些关键情节可以被挑出,拆分关键情节就可以组成故事脉络。在产品的故事中,这些关键情节就是用户与产品的每个触点,将故事划分为一个一个的节点,可以清晰的了解用户的行为步骤。

典型的故事场景的描述有两大好处:一是对场景的叙述,可以让设计师一开始就将注意集中在创造新想法、解决问题和实现用户目标上面,也就是“以人为本”,而不是技术如何实现;二是故事本身的时间、情节特性,非常符合交互设计的流程演化,可以对应时间节点上的过程描述。

1.3 数据验证

用户(Person)在具体场景(Case)下的行为(behavior)清楚了。如果想更清晰更全面的完善典型“用户画像”,或者解释一些举棋不定的地方,可以寻找收集项目相关的现有平台、其他类似平台的历史数据。分析数据背后的原因,对决定设计方向的非常有用。

第一阶段回顾:分析商业目标,描述了典型的用户模型、通过故事细化了用户的心理模型和行为模型。

二. 理清设计机会、定义功能

2.1 产品触达用户入口

在讲述典型故事的时候,设计师已经了解到用户实际场景中困难、痛点。然后开始设计之后,进行角色转换。

  • 是不是应该在用户觉得最有痛点的地方提供产品的入口呢?
  • 这样用户对于产品的接受度和尝试欲望是不是最高的呢?
  • 如果用户错过了这个推送入口,那还有没有其他方式作为“触类旁通”的办法?

预先设想产品最好的使用场景,可以帮助产品最大程度的触达用户。

2.2 收敛和发散功能思维

调研也好,无限接近用户使用场景也好,都是为了建立“同理心”。“同理心”的体验帮助设计师搞清楚产品对于用户来说:

  • 有什么用?
  • 那些功能最有用?

产品初期的脑暴中,可能会有很多很多关于产品的功能想法。这个阶段可以通过一些方法来帮助设计师密集的探索新的想法:

  • 广泛的绘制草图、记录想法
  • 顺延故事脉络发散额外的线索
  • 思维导图

这个阶段是创造性的阶段,一开始可能是杂乱五章的,通过不同的反思、归类、验证,可以逐渐归类出特定的方案。在筛选的过程中,典型的收敛方法是将诸多想法逐个剔除直到剩下最佳想法为止。往往这些筛选条件是由人性、技术、美感三个条件混合组成。

不能不说的设计秘密:4个步骤提升交互思维

保证产品的简洁性、最重要功能的好体验是非常重要的。根据重要的设计节点筛选痛点功能,确定功能优先级。

2.3 主要功能任务

对于新设计的产品来说,用户执行任务是具象而零散的,设计师将任务分解和重组之后将用户行为归纳为主要任务,可以较为清楚而全面的囊括用户的需求、情绪、动机、目标和行为。

在整个主任务中,任务步骤被清晰的划分,不同的决策指向不同的任务流程。任务分析是衔接分析和设计阶段的关键步骤。

2.4 业务流程图

流程图综合表达主任务的过程和决策分析的情况。交互设计师使用业务流程图梳理清楚主任务的所有环节,展示产品入口、用户动作之间的关联,根据不同决策而产生的页面跳转。业务流程图的合理性对于产品的整个环节包括后期开发都是非常重要的。创建流程图的过程中可以更清晰的了解系统所涉及的范畴,形成心智图景(mental representation)。

不能不说的设计秘密:4个步骤提升交互思维

图1 流程图示意

第二阶段回顾:交互设计师通过综合分析、发散收敛思维、提炼精化的过程,理清了流程中各个组件的关系,形成完整的产品图景。

三. 交互流程与原型图

业务流程图已经分类任务场景,下一步就是基于主要任务进行界面原型设计,原型设计要求需要准确的展示用户所需的信息,表达清楚各个页面的跳转关系。

3.1 主页面的方案

从用户任务出发,聚焦用户注意。对于一个产品来说,有一到两个不等的页面是产品最为重要的页面,这个页面展示了产品的主要功能,用户在这个页面执行主要任务。同时主要页面的用户体验也承担了产品主要体验的塑造。主页面作为设计的重点是应该被反复打磨的。

如何设计主页面:

  1. 主页面的内容是哪些?
  2. 内容的主次排序是怎样的?
  3. 根据不同的思路将内容按照主次顺序设计
  4. 多种方案的对比、演绎、进化
  5. 设计方案的过程中和后期都可以跟不同的人进行沟通、讨论,不同的人看待问题的角度不同,这样会启发新的灵感
  6. 是否带给用户产品的归属感和关怀体验。

上述几个步骤可以将界面零散的信息逐渐演化清楚为方案,在演化的最初不一定是标准的交互方案,可以是草稿的方式,快速的进行方案的推进演化。等待方案完善之后再用axure等界面软件清晰的表达构思。

不能不说的设计秘密:4个步骤提升交互思维

3.2 支线流程的完善

主要流程中的主界面摆到清晰之后,辅助功能就会在方案形成过程中逐渐清楚。子流程的设计要注意在产品层级不要太深,在用户需要使用的情境适当出现。信息的表达上应该清晰完整,还是应该注意主次关系。

3.3 对细节的关注

对细节的关注和理解,才是获得更高级体验的方法。用户愿意使用尊重和理解他们的产品,也就是与产品产生积极的情感体验。想要满足这种共鸣性更高的体验也有一些方式可以遵循:

  • 具有代入感,也就是产品符合用户角色;
  • 沉浸感,执行某一任务的过程中用户可以进入一种专注的状态;
  • 高度的可感知,操作、反馈、提示都是明确而清晰的。

第三阶段回顾:主界面的打磨,细节体验的关注都是塑造良好体验的方法,好的产品应该让用户感知丰富、情感投入。

四. 反思评估、规范化

反思和规范是设计的最后一步,这个过程可以从全局来审视自己的设计过程,找出需要改进的方法。规范化的案例可以更好的帮助后续别的产品的设计,节约时间和资源。

4.1 可用性原则的检查

文案的表达,错误的反馈,一致性原则,除去冗余的信息等等,这些都是在反复审视稿件中能够不断改进的地方。

下面是一些可用的信息架构原则和页面表达原则,可以作为流程图和页面检查的标准。

信息构架的原则:

  1. 一个页面一个主要内容;
  2. 个人信息&公共信息;
  3. 更少的信息更好;
  4. 同等级的内容应表现成并列的样子;
  5. 信息树应该尽量窄而浅,并且尽量保持平衡;
  6. 与现实生活经验相符。

页面表达原则:

  1. 更少的信息量更好。
  2. 结构化更易于理解。
  3. 信息的表达应该清楚、明确、直接。
  4. 操作可识别。
  5. 操作前,结果可预知。
  6. 操作时,操作有反馈。
  7. 操作后,操作可撤销。
  8. 让用户知道身处何地。
  9. 避免内容看上去象广告。
  10. 不提供多余的功能。
  11. 相同的功能,在不同的页面中应保持一致性。
  12. 措辞统一。

4.2 专家评审

在自己审视交互方案流程也基本顺畅合理的时候,可以将方案发给专家评审,这里的专家既可以指有更丰富工作经验的设计师,也可以是更加熟悉这款产品使用背景的产品经理,让他们了解设计方案,指出存在的问题,修改细节,更好的呈现。

不能不说的设计秘密:4个步骤提升交互思维

图3 评审讨论

4.3 开发跟进

在原型设计完成之后的视觉、重构、前端开发中,时时跟进,把控产品方向跟最初交互设计方案一致也是帮助用户体验的重要一环。

第四阶段回顾:全面审视设计流程,通过专家评审等方式改进方案,规范总结设计方法。

总结

我们平时所谈到的“用户中心”的设计流程大致包含了:策略和用户分析阶段(UCA, User-Centered Analysis,即策略和用户分析阶段)和设计实施阶段(UCD, User-Centered Design, 即整合了设计、评估和实施、评估两个阶段)。交互设计其实恰好是贯穿了分析和实施阶段的桥梁,交互设计师无限的接近真实用户场景,寻找更加合理设计的答案,可以为产品的更好体验提供实实在在的帮助。

 

作者:乔莎莎,腾讯FIT金融市场部交互一枚,对探究人的认知、合理规划人机逻辑抱有极大的热忱,目前持续研究中,欢迎探讨,邮箱:1016415863@qq.com

来源:腾讯大讲堂

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

(0)
CatherineCatherine
上一篇 2017-05-14 13:07
下一篇 2017-05-14 14:52

相关推荐

  • 《用户体验可视化指南》视频讲书(1)

    我们选择了人民邮电出版社2018年出版的《用户体验可视化指南》作为第一本,带着大家啃书。原因是这本书真的非 常 好,好到可以成为用户体验设计和研究领域的大辞典了。作者引经据典,却因为篇幅受限,很多没有详细展开。不知前因后果的读者,因此会错过很多有意思的观点。所以UXREN为你详细拆解《用户体验可视化指南》,每次10-20分钟,3首歌曲的时间,日积月累,透彻理解经典书籍。第1期: 前言《用户体验可视化》前言部分,介绍了为什么会提出共线图(...

    2018-03-27
  • 考研是工作的理想国 | 同济大学设创交互设计考研分享

    打造最优质的设计教育有趣·专业·创新上次发了那篇跨专业考研的分享之后,小编收到了很多小伙伴的后台留言说,能不能多多分享一些考研的心得,为了保持我们有求必应的优良传统,今天的推文也是一篇干货分享帖~此次的分享,来自一位考上同济的在职小姐姐,一起来听听她是怎么平衡工作与考研之间的压力吧~张 炜15年毕业于山东财经大学的数字媒体技术专业,因为爱好也因为工作上遇到的瓶颈,希望能通过考研取得进步,并顺利考入同济设创院的交互设计方向。(即在职又跨专...

    2018-04-25
  • 交互设计脉络概要

    一般做交互设计师有的是刚毕业的时候就会去做。也有的是本身是做视觉设计的,然后在未来的职业规划可能对交互设计感兴趣,所以呢,有时候对产品说,我想转交互行不行,那其实整体还是要看公司对你的角色的一个定位和是否给予的机会了。当然啦,很多机会是靠你自己去争取的,这个无论是在公司本身或者另外的公司,就自己去考量自己人生一个选择。一:什么是交互到底交互设计的一个定义是什么呢,因为了解一个新行业我们首先需要知道的就是他的定义,这样才是一个准确的、一个...

    2018-04-28
  • 设计中的交互设计——什么是交互设计

    上一篇我们探讨了设计的本质,结论是设计的本质是解决问题,满足人们的需要。有的朋友可能会问:工程学也是解决问题,比如造一座桥,就解决了一条河两岸的交通问题。那么设计和工程学有什么区别呢?这里我想补充一点:设计是漂亮得解决问题,即设计除了需要考虑如何为人们服务,还需要考虑以一种美观的、令人赏心悦目的方式来服务。因此,“漂亮”这个因素,也很必要。既然交互设计是设计学科里的一个分类,那么交互设计一定首先满足设计的本质:漂亮得解决问题。下面我们来...

    2018-03-13
  • 大屏时代,如何做好电视端交互设计?

    在过去一年多的时间里,笔者有幸参与了电视端大屏幕的项目,在不断的尝试、探索和设计中,也收获了一些关于电视端的设计经验,因此将这些“电视交互设计的一些事”分享出来,共同探讨电视端的设计。-硬件+远距离操控——基本交互-基于桌面资料研究以及设计经验,总结了基本交互主要包含以下几个关键内容:遥控器输入、导航和菜单、信息展现、控件摆放和焦点状态。一 、遥控器输入当我们用手指快速便捷地在手机屏幕上点击或滑动时,主流电视大屏及应用的操作还是:使用遥...

    2018-04-01
  • 【交互设计】入门交互设计需要注意什么

    作者:Mufly 最近一直在想,交互设计的核心是什么?因为身边不少设计师对交互设计有也兴趣,常常被问到怎么学呢?交互设计要注意什么?对于入行不久的我,如何回答这类问题成了难点,因为我怕回答得不好,误人子弟…

    交互设计 2015-07-20
  • 深度解析!天猫双11宇宙 H5 的惊艳效果是如何实现的?

    来源:H5广告资讯站 作者:小呆 原创文章,转载请联系本人! 记得在上个月小站推荐万达的第一支一镜到底H5作品时,就有用户曾放下狠话:“你就等着我们的一镜到底吧!” 因为留言的人是圈内的技术大神,自然也就引起…

    2016-10-25
  • IAMUE 移动客户端的设计作品分享

    Wechat: caochengweiued 分享了他对 IAMUE 移动客户端的设计作品,文末有 阿西 UED 的点评! 阿西UED 的点评: Hi 谢谢你的作品分享,总体上来说,依你当前的学生身份或当前的专业程度,做出这样的设计方案有一定的…

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

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

    2018-04-02
  • 鱼和熊掌——关于产品更注重功能还是更关注体验?

    “你从来不会因为产品功能而赢得用户,但他们会因体验慕名而来——关于快速使用最小可行化产品MVP(注:国内通称为‘试错’)快速进入市场指南”——by Lee Dale 基于这样一个背景,你需要重新考虑你的产品设计——摒弃罗列功…

    2015-07-18