移动端交互文档应该如何写？

　　互动设计师一般在团队中扮演着承上启下的角色。上游对接视觉设计师和项目经理，下游对接视觉设计师和开发工程师。他们都以交互设计师输出的交互文档作为下一步工作的参考，交互文档的重要性不言而喻。本文结合案例分享了移动交互输出文档的写作步骤和过程中需要注意的关键问题，供大家参考和学习。

　　我认为一套完整而优秀的移动交互文档可以包括以下部分：

　　1.商业背景、产品目标、用户群体和用户目标

　　2.定义业务规则

　　3.用户流程图

　　4.设计原则

　　5.标注交互过程

　　当然，产品概况和更新日志也可以添加。产品概况简要说明产品版本号和产品相关人员。

　　更新日志主要是指每次更新后更新的内容、更新者和更新日期，如下图所示。

01 业务背景、产品目标、用户群体和用户目标

　　作为一名交互式设计师。在我们收到需求后，我们首先需要找出需求的业务背景是什么。其次，根据业务背景了解产品的目标。最后，找出产品的用户群体和用户目标。

　　互动设计师从产品经理或其他需求发起人那里了解需求生产的业务背景，并了解为什么要这样做。在清楚地理解之后，追溯到需求的原始本质。

　　在我们实际工作的大多数情况下，产品经理不会在需求文档中清楚地写下业务背景。此时，我们的交互设计师可以在交互文档中输出业务背景，并清楚地显示它们。

　　什么是商业背景?商业背景通常是我们为什么要做这个功能。做这个功能对业务有什么帮助?通过业务背景，我们可以推断业务需求，获得相应的产品目标。

　　产品的目标是什么?产品的目标是产品能得到什么样的结果，产品能得到什么样的好处。因此，产品目标应体现在交互文档的设计中。通过明确产品目标，我们可以清楚地指导我们制定交互计划。

　　用户群是什么?用户群主要是通过我们对现有产品的用户肖像获得的，并计算使用这种需求的用户群是什么样的人。通过明确的用户群，我们可以清楚地知道在设计过程中为谁做这个需求。

　　用户的目标是什么?用户希望通过使用此功能达到什么好处或目的。

　　接下来，我将用一个虚构的案例来解释如何输出移动交互文档。

　　案例：浏览器猜测新活动。该活动的需求是让用户通过浏览器的金币猜测活动与产品进行新的互动，提高新老用户的日常活动量和活动。基于这一需求，我们的交互设计师应该如何设计和输出交互文档?

　　在设计之前，我们需要考虑业务背景、产品目标、用户群体和用户目标。

　　该需求的业务背景、产品目标、用户群体和用户目的如下：

　　业务背景：

　　用户可以通过使用浏览器的一些指定任务来赚取金币，并将金币用于消费(猜测活动)，从而形成一个完整的良性闭环。

　　产品目标：

　　1.通过活动共享提高浏览器下载量;

　　2.通过用户赚取金币，增加用户使用浏览器的时间;

　　3.引导用户通过活动分享，从而获得更多的产品活动曝光。

　　用户人群：

　　1.使用浏览器并喜欢盈利活动的用户;

　　2.不使用浏览器但喜欢盈利活动的用户。

　　用户目标：

　　完成猜测活动简单方便，希望获奖。 02 业务规则

　　关于产品的业务规则，可能需要与产品经理、业务方和运营商进行沟通和讨论。这涉及到整个产品业务的规则。在实际工作中，我们会遇到两种情况：

　　1.产品经理将与业务或运营沟通，然后输出业务规则。此时，我们可以仔细阅读和整理业务规则。如果我们觉得不合理，我们可以与产品经理讨论和沟通，修改业务规则，使其更合理，并将其输出到互动文档中。

　　2.产品经理只是有一个简单的业务规则想法。此时，我们的互动设计师需要帮助沟通和完善他们的业务规则，并将其输出到互动文档中。

　　浏览器猜测新需求涉及的业务规则包括：活动时间规则、金币生产规则、金币消费规则、资本池消费规则、活动发布规则和现金提取规则。对于这些，如果产品经理没有明确的制定，或者制定不够详细。然后我们可以整理和制定互动。

　　在制定规则的过程中，我们的设计师需要了解活动开始前、过程中和结束后的所有活动过程，并运行整个活动过程。并给出一个合理的规则定义，如果规则不合理，整个活动将因规则漏洞而崩溃。

　　下图显示了我定义的所有规则：

03 用户流程图

　　用户流程意味着我们的设计师应该在使用过程中梳理用户的各种场景流程。通过用户流程图，我们可以避免错过场景和交互方案。

　　对于任何功能或活动，第一个问题是入口设置在哪里?因此，我们需要设计活动入口的逻辑。

　　活动的主要用户流程是用户正常活动时的流程。

　　与主流程不同，对应的是金币不足时的异常流程。

　　假如用户竞猜获奖，那么相应的问题就是提现，因为浏览器目前还没有钱包，所以设计为通过绑定微信提现。

　　为了曝光活动，需要关注共享功能和入口的设计。当用户获奖时，需要提示使用该产品的用户获奖。当活动过期时，需要设计相应的过期活动界面。

　　通过以上简单的分析和深入的用户流程图梳理总结，可获得以下7种用户交互流程图：

　　1.猜测活动的入口设计在哪里?

　　2.金币充足-猜猜活动主流程

　　3.当金币不足时

　　4.提现流程

　　5.活动共享流程及所有入口

　　6.中奖时的场景

　　7.活动过期时的场景 04 设计原则

　　这里的设计原则是一些非常常见的交互或视觉设计原则，但在设计这个活动交互方案时需要遵循的原则。这里的设计原则与业务密切相关。

　　在设计本次活动之前，我们应该明确本次活动在设计过程中应该具备哪些原则。这样，在设计整个活动的各种场景时，我们可以清楚地遵循既定的原则，使交互过程和页面布局更具全局性。

　　该活动的产品目标是通过该活动获得产品的曝光和下载。需要满足的原则是引导用户快速找到活动入口，并提供活动描述，以吸引用户参与并顺利参与。

　　本次活动的用户目标是简单方便地完成猜测活动，并希望获奖。在设计过程中，它应该简单易懂。用户没有认知和运营成本。为了给用户一个获奖的机会，让用户感到公平，我们需要及时向用户反馈获奖用户。

　　由于活动只是临时的，因此有必要减少对大多数非目标用户的干扰或厌恶。

　　基于以上分析，总结后制定以下设计原则：

　　1.引导用户快速找到活动入口，顺利参与

　　2.提供活动简介，吸引用户参与

　　3.竞猜活动页面简单易懂，用户没有认知和运营成本

　　4.尽量减少对大多数用户的干扰或厌恶

　　5.确保公平公正，及时向用户反馈中奖人数

　　上述设计原则是为以后的交互过程确定思路和设计指导。 05 标注交互过程

　　基于以上用户流程图，可获得7个用户操作流程，即7个交互流程标记。

　　目前，我认为标记交互过程的更好显示方法是以站点地图/画板的形式显示一个主流程。当主流程中存在多个分支操作流程时，可分别显示在站点地图/画板中。同时，用标题区分分支流程的操作名称。

　　如下图所示：

　　如果涉及到异常场景，并且可以全局重用，则只需要全局组件说明，不需要每个过程都显示其异常场景组件或页面。

　　全局组件是指全局断网、操作成功、操作失败、加载、空数据界面、404等整个产品的通用组件

　　·全球断网：tips提示通常用于主页。当用户点击其他界面时，toast反馈也会提示用户。也有一些应用程序在用户进入时提示用户网络异常。与对话框相比，使用tips对用户的干扰更小。

　　·操作成功：一般操作成功是根据具体的使用场景对应的提示。

　　·操作失败：异常情况导致操作失败，此时需要统一提示，通常使用toast，也有一些使用对话框强烈提示用户。

　　·加载：涉及全局加载和局部加载。设计中应统一说明全局加载。例如，单击上一个界面进入下一个界面，需要说明使用的全局加载。如果是一些小场景的加载，则需要特别说明。如上拉加载、下拉加载、局部小区域加载等。

　　有三种类型的空数据：

　　1.初始状态的定义:初始状态，没有任何内容，需要用户进行某种操作来生成内容界面。

　　2.清空状态的定义：通过删除或其他用户操作，清空当前页面内容并产生空界面。此时，需要明确提示并告知用户如何处理。

　　3.错误状态的定义：由于网络、服务器或没有找到其他结果，无法加载内容，导致空界面。此时，需要有一个明确的提示，并告诉用户如何处理它。用户操作反馈的无结果界面也可以用这个想法来设计。

　　下图显示了H5竞猜拉新活动部分交互过程的标注图：

　　在列出过程中，尽量走到最后，避免线与线之间的交叉。界面之间各种线穿插的结果是阅读非常混乱，体验特别差，逻辑也容易出现问题。同时，在每个界面下写下相应的标记说明。

　　结语

　　以上是如何输出移动交互文档说明书，仅供参考。您可以根据自己公司的实际情况合理添加、删除或修改，使文档更符合自己的公司/项目组。