当设计一个页面/功能时，先从设计用户流程开始吧

最近在Udacity学习老美的产品设计课程，我以为会吸收不少先进的产品理念，但只是一再强调那些我早就「看不起」的基本概念、基础注意事项。

他们特别强调对于这些基本功的严格执行。就像一开头我引用国际象棋大师说的那句话一样，「我们能成为顶尖选手并没有什么秘诀，而是对可能是基本技能的东西有更深的理解」。其中一个让我印象深刻的是关于用户流程图的设计。

流程图，我相信在互联网公司待过的同学再熟悉不过，产品会用到流程图、设计会用到流程图、开发测试也会用到流程图。

在我工作的时候，没有做出过一次让设计/码农0疑问的流程图，我把大部分的精力放在了产品/网站的视觉表现上，甚少思考流程里有什么改进空间，甚至有时候因为功能简单连流程图都懒得去想去弄了。

这个课程里提到我们在产品设计开始时会犯的两个典型错误：

看了以后内心特别惭愧，自己就是这么干的。

顺序错了。我们应该从「完成商业目标」和「帮助用户完成任务」开始，你希望用户来到这里干什么，他们要经历多少艰难险阻的操作才能最终完成你的任务，你怎么设计这些操作使得用户减少用户投降放弃的比例。

设计不只是设计它长得漂不漂亮，更重要的是设计它好不好用。当我们设计一个页面/功能时，先从设计用户流程开始吧。

时刻提醒自己的两件事情：

用户从四面八方过来，质量参差不齐，对于产品和信息的了解程度也不同，设计流程的第一步就是为不同的客源设计流程（也许到后面你发现他们的流程都一样）。

他们可能是：

• 搜索引擎主动找过来的；

• 你发布的广告骗过来的；

• 被朋友圈微博吸引来的；

• 正在使用你网站/产品发现的；

……

这些人各自「心怀鬼胎」，你得把他们的需求和你的诉求想办法匹配起来，提升转化率。

举一个之前迅雷会员开通（但我们没做好的）的流程为例，我们的流程是：

这里我们思考得就不够勤快，没有针对不同用户设计流程，也不愿意给自己添麻烦。我随便举一下针对不同用户群改进思路：

１、曾经是会员但现在没续费的

沿用上面流程，但在支付时候可以记住上次支付方式，或者是在支付时提供给老会员买年费的折扣；

２、没有账号的用户

他可能只是想看看价格再决定买不买，但登录/注册的流程会挡掉一大部分人。

提供用QQ登录的接口，或者是直接直接到支付页，在页面填写自己的邮箱/手机，支付完成给他们的邮箱/手机发送密码（当然涉及到已经有账号或者这个邮箱手机被注册了怎么办的逻辑分支）。

如果把流程图更细化、更多一点思考，我相信还能想到更多提升转化率的改进方法。

一些改进用户流程的思考方法：

• 用户来这里有什么需求？他们有什么问题要解决？（空虚寂寞孤独冷的夜晚怎么打发）

• 他们为什么需要你提供的东西？（提供给他一段美好的个人时光）

• 你的产品/服务对于他们最重要的特性是什么？（速度快？立即能看片？）

• 用户有什么担心，他们犹豫什么？（太贵了，有没有效果？）

• 什么信息能够帮助他们做决定？（3天无效退款）

• 有什么情绪或者冲动能帮他们做决定？（精虫上脑）

这些问题靠自己YY肯定是不够的，这就促使你要多跟用户交流了。交流的时候，你发现会有千奇百怪的用户，如果你为每一类人定制专门的流程，就算你不累死设计开发也会把你打得半死.

这其中的取舍就依赖于你的判断了（要不然老板给你的工资是干啥用的啊）。

我自己以前画的用户流程，着重点是不同状态间的逻辑跳转。课程提供了另外一种方式提升可用性，我觉得非常赞。它将一个流程分成上下两部分，上面是「用户看到什么」，下面是「你要用户做什么」。比如：

使用这种方式，可以让你专注于怎么提升用户的行动上。给其他同学看的时候可读性也更好（不像我之前的流程图，实际看的人没几个）。

做的时候可能会比较痛苦，以往的流程只需要考虑状态之间的跳转就好，而这种方式增加了用户可见内容跟要用户行动的内容。但这种工作量的增加是值得的，我自己在做练习的时候，就会时刻提醒自己不忘最后的目标，这些信息是不是有助于提升用户的点击、哪些动作要简化哪些要增加。

作者提供了两个在用户流程方面很不错的网站作为学习对象，一个是tastebuds.fm，一个是codecademy，都不需要翻墙就能直接访问。计算是花个5分钟浏览一下，也能给你带来不少的收获哦。

１、https://tastebuds.fm//

２、https://www.codecademy.com/

作者：黎晨，英文名LC。00年开始接触互联网，可是很年轻。在互联网牛市造福浪潮中连小小的牛尾巴都没沾到，不过，我会继续努力的。

来源：微信公众号【黎小晨想太多】