专业干货!3个方法帮你优化交互设计流程的“闭环”问题

　　

　　交互设计师有一项很重要的工作就是界说任务流程。在接到需求以后，设计师需求把笼统的需求设计成具象的流程，然后再把流程分配到不一样的界面，最后构成制品。 设计流程不难，然而设计好的流程特别难。今上帝如果从“闭环”这个角度来说讲流程设计中的优化问题。

　　举个简单的例子，注册这个流程能够这么界说：

　　

　　这么一看，确实很简单。然而这是一个好的流程吗？好比填写手机号码的时候发现手机号码已经注册了，这个时候需求怎样办？好比获得不到验证码怎样办？这些细化的场景假如没有考虑到的话，流程就会变得很艰涩难用。怎样去寻觅细分的场景一直是流程设计中一个困难，这部分今后谈判。所以，今天我主如果从“闭环”这个角度来说讲流程设计中的优化问题。怎样去结构 交互设计的闭环，我主要从以下几个维度去讲：①打通断头路；②设置延伸线；③开拓新岔道。每个流程就好比一条路，所以这里借用交通领域的名词来说明，懂得起来更加形象生动。

　　1、打通断头路

　　断头路，望文生义就是流程走到某个地方，尽管目的还没达成，然而道路已经中止了。假如现实中碰到断头路，司机确定是一顿怒骂然后沿路返回，再选择新的路。在流程中，假如用户碰到断头路，有也许用户会沿路返回，然后去试探新的流程，然而也有也许是用户会直接流失掉。假如流失掉客户，那么亏损可就大了。所以，在做流程设计的时候，首先就要看看有无断头路，然后要把断头路都打通。

　　回到一开始的例子，我们来看看这个例子中也许出现的断头路。在填写完手机号码以后，普通都有个检验的功能，首先会检验输入的是否11位数字，接着才会检验是否已经注册。假如已经注册了，普通起码都弹出一个toast“该手机号码已注册”。流程以下：

　　

　　△ 注册流程（增加toast提醒）

　　假如依照这个流程走，就出现了我所说的断头路。在注册/登录流程，用户的目的很明确，就是要注册或许登录以应用应用，假如没能达成这两个目的就中止，用户的任务就没办法完成，用户固然会很不爽。所以，假如只是弹出一个toast“该手机号码已注册”，这无疑就中止了用户的流程。

　　那么要怎样进行改良呢？最简单的就是把提醒案牍修正一下“该手机号码已注册，请直接登录”，通过案牍的引导，能够让用户晓得后续要做什么。不要小视加上去的这几个字，缘由是我们没办法琢磨用户的状态，所以我们不能够保障用户不时刻刻都很明白他在干吗，他接下来要干吗。针对这类情形，交互设计有一个“可学习惯”的原则，简单地说就是，我们要一步步告知用户，他应当怎样做。其中，案牍的用处相当重要。

　　固然，目前这还不是最好的方法。最好的方法是什么呢？我们来捋一捋目前的场景。目前是用户的注册流程被打断了，为何会被打断呢？缘由是用户已经注册过了。为何用户会目前还注册一遍呢？缘由是他想进入应用应用。所以呢，既然我们晓得用户走到了断头路，我们也晓得用户想去哪？那么最好的方法就是告知用户：“嘿，这条路走不通了，然而这里有捷径哟”。详细实行起来就是用一个弹窗进行引导，以下图：

　　△ 弹窗提醒直接登录

　　然后做的再细致一点，缘由是用户已经填写了手机号码，登录的时候就不需求用户再填写一遍了。还有，不要忘了登录页面的“忘却密码”选项。

　　回头再来看看设计中的断头路，还有哪些情形。好比说搜索不到内容，这时候候就相当于一个断头路。假设这时候候提供一些推举的有关的关键词，就相当于打通了断头路。好比说，下载资源没速度，这也相当于断头路。旧版迅雷会推举类似的资源，这就像打通了断头路。再好比说，chrome浏览器衔接不到网络，断头路又出现了。chrome会推举一个小游戏给用户玩，这也相当于打通了断头路。

　　2、设置延伸线

　　假如说打通断头路更多是站在用户的角度去进行设计，那么设置延伸线除过是为用户考虑以外，还有一部分是为了产品自己考虑的。详细做法就是，当本来的任务已经完成的时候，但这时候候又推举一些任务给你做，流程变得比本来更长了，这个新参加的刘晨就是我所说放入”延伸线”。乍一看，这似乎违反了交互设计的简练性，无故端把流程变长了，就不需求考虑流程的用户流失率吗？固然不是，关于这一点，还让我细细说来。

　　之前在手机管家实习的时候，正巧是手机管家从5.x到6.x的升级改版项目。这里略微解释一下，手机管家是一款工具型应用。你能够把手机管家当做瑞士军刀，是一堆工具的合集。在5.x的版本碰到有个问题就是，部分功能的渗入率特别低（注：渗入率就是一个功能的应用率）。通过调研分析，得出两个办法，其中一个就是整合功能，把本来20多项的功能整合到10多项，削减选项确实有助于让用户做出选择。第二种就是这里讲的“设置延伸线”的办法。详细的做法就是通太高渗入率的功能去带动低渗入率的功能。好比说，在某个操作完成以后，除过结果反应和完成按钮以外，能够推举用户做另外一些操作。通过这类流程的优化去带动其他的功能，从而提升整体功能的渗入率。以下图：

　　

　　△ 完成页的推举任务

　　你也许会说，那这样不会有问题么？流程不会变得很长很长么？结果反应页不会变得很复杂么？

　　关于结果反应页的问题。没错，页面会变复杂，然而页面简单其实不是我们的目的。我们的目的是通过页面去引导用户，所以能够通过页面内容的大小比较、颜色比较来处理页面复杂的问题。同时，交互设计是一个均衡用户需求和商业需求的职位，所以，有时候为了商业需求也需求牺牲一点用户体验。

　　第二个是流程变长的问题。这个问题是这模样的，用户能够选择像之前那样直接完成任务便可，所以我们只是增加了选择本钱罢了。其次，假如我们推举的功能恰好是用户需求的，那么用户固然会很愿意持续操作下去。最后，不是每项操作完成以后都紧随着一些推举功能。当流程太长时，我们能够封闭这个“设置延伸线”的功能，只留下结果反应元素和“完成”按钮。

　　小结一下，设置延伸线相当于把应用不一样模块之间做一个串连，一是能够提升功能模块的渗入率，二是假如串连的功能恰好是用户需求的，那么同时也会提升用户体验。只是，怎样样“恰好”推举到用户爱好的功能，这个需求多方调研和用数据做支持才行。

　　3、开拓新岔道

　　普通来说，正常的流程应当是线性的，这样的流程最简单，用户应用起来也没什么压力和本钱。然而，这仅仅只是正常的流程。交互设计需求考虑复杂的异常流程，这也就致使了好的流程更像一张网，有多数的岔道，每个岔道还也许有岔道，岔道走着走着也许又回到原点，最后，一切的道路都聚集到一个或很多个终点。

　　这是普通的情形，然而也有特别的情形。好比说我目前要讲的这个“开拓新岔道”，假如说前面两个办法都还是为用户着想的话，目前这个办法更多的是为产品运营方着想的。开拓新岔道是说在正常流程的某个节点，分岔出新的流程，最后分岔的这个流程还会回归到正常的流程。

　　以下图，蓝色代表普通的流程，然而目前插出来了一些新的节点，就是橙色的点，这些橙色的点组成的流程就是我所说的新岔道。

　　

　　△ 新岔道

　　这么说还是很笼统，我还是通过例子来说明吧。购物车是购物应用里面一个非经罕见的功能，用户在应用购物车的时候流程是这模样的。

　　

　　△ 购物车应用流程

　　然而，真的是这样么？在检查购物车的界面，其实除过购物车的内容，还有其他的内容。以下图：

　　购物车页面其实还有一个推举商品的部分，假如用户恰好在这里发现自己需求的商品，就很有也许会跳转出去浏览，然后再回来购物车进行结账。流程以下：

　　△ 京东购物流程

　　这一个跳出去的动作就是我所说的岔道。在电商这个场景下，岔道的意思就是要让你多“逛”一下，万一你再重视其余物品，电商不就多赚一点么？同理，岔道还适用于其他合适“逛”的产品，好比说资讯浏览类产品等等。关于其他产品，这类办法就要郑重了。缘由是有也许岔着岔着用户就不回来了。除此以外，岔道的设置也会使得界面变得更加复杂，用户有也许会迷失掉。

　　可是，我们能够从结果推导一下：既然目前电商的购物车广泛都用了这类办法，说明它还是切实有用的。所以，是否选中这类岔道，不只需求基于本身产品的属性来考量，更重要的是要从上线以后的数据来视察。

　　好了，讲到这里，我关于交互 设计流程的闭环问题也就讲完了。总结一下，闭环实际上是一种“串连”，把同个功能模块下的不一样流程串连起来（打通断头路），把不一样的功能模块串连起来（设置延伸线），或许是自己把自己串连起来（开拓新岔道）。这类串连有为用户着想的，也有产品方面的考量。然而不顾从哪里动身，在设计交互流程对这些闭环进行思考，全部交互流程才会变得更增壮大和完整。

　　「技多不压身的设计师才有高薪资！」

　　平面设计： 《超赞！设计师彻底自学指南》交互设计： 《交互设计师修炼指南！教你从零开始成为优良交互设计师》UI设计： 《超适用新手指南！零基础如何自学UI设计？》前端开发： 《天猫高手来教你！零基础如何系统地学习前端开发？》抠图技能： 《从菜鸟到高手！PHOTOSHOP抠图全方位攻略》配色方案： 《颜色搭配速成！3个适用办法帮你整体搞定配色》DPI指南： 《基础知识学起来！为设计师量身打造的DPI指南》交互设计自学道路图： 《零基础入门！给非科班生的自学道路图之交互设计篇》

　　原文地址： jianshu

　　【优设网 原创文章 投稿邮箱：yuan@uisdc.com】

郑重声明：此文内容为本网站转载企业宣传资讯，目的在于传播更多信息，与本站立场无关。仅供读者参考，并请自行核实相关内容。