一招教你让交互方案更靠谱——目标导向设计法（下）

之前的两篇文章介绍了什么是设计目标，以及如何确定设计目标。这篇文章介绍一下确定设计目标之后的工作。确定了设计目标之后，可以按照这个通用的流程继续进行：竞品分析→流程图→原型图。竞品分析是一个较大的话题，以后有机会另辟一篇文章跟大家分享。本文重点说一下流程图和原型图。

把一个流程图画出来，需要两步：第一步将需求涉及的元素列出来，并进行归类；第二步根据心理模型进行排序。

画完了流程图，需要根据设计目标找出流程中每一步的设计重点。我们来举个🌰 ：

【需求】新建视频列表：用户在手机客户端里新建一个视频列表，加入选定的视频。这其中涉及的元素有：列表名称、简介、封面、选择视频（包括上传新的视频和选择已上传过的视频）、标签。

分析一下这些元素：名称、简介、封面和标签是关于视频介绍的，可归为一类；选择视频是为列表添加内容，归为一类。

然后根据心理模型，也就是人们普遍的认知，来为它们排序。人们一般是先为列表取个名字，设置好封面这些基本信息，再为其选择内容。所以这里的流程设计为：填写列表信息→选择视频。

请思考一下：由于这个需求涉及的功能点比较简单，可否把这两步流程放在同一个页面呢？这就需要用到我们这次系列文章的核心：设计目标。

分析一下这个需求的设计目标：产品目标是这个功能的完成率尽可能高；用户目标，是快速、准确完成这个任务。由于这个需求是为手机客户端提出的，而手机屏幕的尺寸较小，流程的两步如果放在一个页面，这个页面会变得很长。同时因为该需求需要操作的点比较多（输入名称、设置封面、选择标签、选择视频等都需要操作），如果放在同一个页面，这个页面会变得比较重。因此这里较好的做法是把选择视频这一步挪到第二个页面，从而使页面轻盈，减少用户负担。

流程有了，我们来分析每一步的设计重点。在第一步，涉及输入操作，联系我们的用户目标，因此这里的重点是输入尽可能方便。而选择视频的那一步，迅速找到用户想找的视频很关键，所以这是重点。

带着这些重点，我们来设计原型。在设计填写列表信息页的时候，我希望让这个页面清晰、简单——在没填写内容时，我们使用默认文字来告知用户这里应当填写的内容，并且把标题和简介只用一条线分开。为了使输入方便设计了一个细节：在用户输入标题之后，在下简介区域会自动匹配和标题相关的内容，然后后面有一个“使用”按钮，用户点击“使用”就可以添加上这些内容，减少了用户的输入。同时，标签部分也会为用户根据标题进行自动匹配。所有这些设计，都是为了达到方便用户输入的目的。

在选择视频页面，设计的重点是迅速找到视频。因此，方案采用了一行两个视频的展现方式，方便用户通过封面图迅速辨识视频；同时一行两个的排布方式，并按照视频名称的字幕顺序进行排列，用户浏览效率比较高。在选择了视频之后，页面底部会有提示栏提示用户选择了几个视频，点击可以查看，方便确认。另外，需求里是没有提搜索功能的。但是考虑到如果用户有很多视频，这个列表会很长，不容易找到列表后部的视频。所以方案里增加了搜索功能，帮助用户快速找到视频。

可以看出，一切的设计，都在围绕产品目标和用户目标来进行。

最后顺提一下，在完成了一个设计稿，我们可以对照设计目标，然后通过数据和反馈来看我们的设计有没有达到设计目标。这对我们的成长有很大的帮助：成功的设计可以变成我们的经验，没有达到设计目标的方案，我们可以从中分析原因，避免以后再犯。

获取数据方面，我们可以跟数据分析师沟通需要的数据变化情况，或者自己寻求数据权限来分析结果。获取反馈反面，有两种方式：一是可以通过用户的反馈，比如后台用户的留言，用户调研的结果获取方案的反馈；二是可以通过同事和领导的反馈来检验自己的设计。

以上是《一招教你让交互方案更靠谱——目标导向设计法》的第三篇内容，也是最后一篇，主要介绍了如何画流程图以及原型图。愿你通过三篇文章掌握这一利器，新年升职加薪走上人生巅峰。

欢迎关注我的微信公众号：新设计青年，及时收取设计和个人成长方面的文章。