流程分析 基于用户行为流程分析的UX设计

吴卓浩，用户体验总监 2012-03-09

UX设计基础

你参与的产品开发流程是…？

你参与的产品开发流程是…？

你参与的产品开发流程是…？

UX设计的流程分析

UX设计的流程分析

以系统、抽象直观的图示，

全面呈现和分析用户与产品的关系，

并发现潜在的创新突破点。

UX设计的流程分析

从主任务开始，

全面列出用户

可能的行为

用带有方向箭

头的线连接各

个行为节点

分析、验证这

些节点与连接

的合理性、重

要性

标出产品中不

存在的节点和

跨越式连接

UX设计的流程分析

从主任务开始，

全面列出用户

可能的行为

啊！产品中没考虑到

这几个用户行为点…

好，竞争产品没有考

虑到这几个点，也许

是机会…

用带有方向箭

头的线连接各

个行为节点

UX设计的流程分析

从主任务开始，

全面列出用户

可能的行为

按照合乎技术逻辑设

计的解决方案要经过

这么多步，但是从用

户行为的角度其实可

以直接连通…

用带有方向箭

头的线连接各

个行为节点

网页上看到图片

保存图片

打开微博应用

新建微博

贴图

发微博

打开相册

选择图片

通过微博分享

通过微博分享

在手机浏览器上看到好图，分享到微博

普通流程图 VS UX流程图

UX流程图的基础元素

点击ABC Yes or

No

步骤 （用动词）

判断 连接 （单向或双向）

案例分析：谷歌地图(2008)

建立节点、连线，补全

• 粗线框表示更重要

• 虚线框表示尚未有功能对应

案例分析：谷歌问答(2006)

Logo

复杂情况，可以按情景拆分分析

案例分析：谷歌资讯(2009)

配合产品数据做分析更有效

案例分析：谷歌生活(2007)

发掘产品机会，从全局到细节

案例分析：点心SNS(2010)

头像 王小虎

人人 开心 微博 05-04 20:18

<

人人 05-04 12:20

…

联系此人

人人 05-04 10:35

流程分析用于界面规划

案例分析：流程分析不适合用界面线框图

回顾：UX设计的流程分析

节点 全面列出用户在使用产品过程中的行为点

连线 单向或双向连接任何可能连接的节点

权重 设定主任务，优化主任务上的节点和连线

修正 利用用户研究或产品运行的数据，对节点、

连线和权重进行修正

界面 规划相应的界面结构及交互流程

以免错失必要的用户与产品交互点

确定交互流程、以及每个界面上的元素

跨越式连接发现创新机会

要优化全局，必须分清主次

初步设定的权重必须以数据支持和修正

这时的界面规划变得异常清晰

练习 选取一个实际产品的小功能入手，

进行UX设计的流程分析

例如：忘记密码

流程分析 基于用户行为流程分析的UX设计

5@chuangxin.com weibo.com/uxworks