基于场景的UI设计方法

再以谷歌的hangouts为例，场景描述：用户在聊天页面(where)聊天的时候(do)收到对方发送的信息"where are you"(how)，根据对当前场景的判断，预期到用户下一步的行为是回复对方自己所在的位置。怎样帮助用户在接下来更加方便快捷地回复所处位置是当前场景的设计机会点，hangouts将该机会点转化为如下设计点：当检测到对方发送的文字中包含"where are you"的时候就会在原有页面中插入定位按钮，点击定位按钮后发送自己的位置给对方（如图11）。

第三步：设计策略

在第二步中我们已经对当前场景的机会点进行了挖掘，那么怎样将机会点转化为设计点呢？在场景设计的第三步，我们给出了一些设计策略，这些设计策略是我们通过对大量案例进行分析归纳，提取总结出来的，可能还不够完善，希望可以帮助你快速产出方案。在设计策略阶段，我们通过设计目标把策略分为三部分：以贴心为目标的设计策略，以高效为目标的设计策略，以情感化为目标的设计策略(如图12 )。

1 高效。

以高效为目标的设计策略共有五点，根据行动点明确程度依次为：行动点前置插入，行动点替换，行动相关推送，突出行动点，自动执行。这五个设计策略都能够不同程度地提高用户操作效率，接下来通过案例依次介绍一下每个设计策略。

◆ 行动点前置插入 行动点前置插入，指将预期到的用户下一步的行为点前置到当前场景，使得用户在需要的时候就能直接操作，达到缩短关键流程，提高操作效率的作用。行动点前置到当前页面的形式多数为直接插入，以美团团购电影票为例，放映前将取票二维码前置插入到首页中，作为首页内容的一部分进行展示，点击后可直接弹出取票二维码快捷取票，很大程度上缩短了关键流程。除了这个案例外，上面有提到的谷歌hangouts也属于行动点前置插入的典型案例，检测到对方询问你在哪里的时候，在聊天页面直接插入定位按钮（如图13）。

◆ 行动点替换 行动点替换，一般是指当前场景下某个行动点的功能不再适合当前场景，因而将其替换为另外的需求较强的行动点，位置不发生变化，而功能变化，为用户提供当前场景需要的或与下一步意图相关的行动点能够帮助用户提高操作效率。以Mono首页为例，当用户在首页上滑向下浏览时，导航栏的"推荐"按钮替换为"返回顶部"，在不改变布局的情况下实现了高效操作的目的（如图14）。

◆ 行动点相关推送提示 行动点相关推送提示，指根据用户当前或下一步的行为提供相关推送或提示，以辅助用户进行决策行动，提高用户操作效率。以手机淘宝为例，用户在商品详情页面进行截图后，预期到用户接下来的行动是将该商品分享给好友，因此在该页面弹出推送提示框，提示用户进行分享，在用户需要的时候就出现，缩短了关键流程的同时让用户感动 (如图12)。除此之外，上面提到的微信聊天页面音量静音状态下听取语音消息的案例，也是通过预测用户下一步的行为，而提供了相关的提示，以使用户减少思考成本，快速达到下一步目标（如图15）。

◆ 突出行动点 突出行动点，预期到用户下一步的行为后通过颜色或提示等方式对行动点进行突出，吸引并提醒用户点击，减少思考成本，提高操作效率。以拍立淘为例，当在光线较暗的环境中打开拍立淘拍照功能，用户当前场景下的需求为拍到清晰的图片，且预期到用户下一步行为是思考后打开闪光灯，因此拍立淘在检测到光线较暗时立即在闪光灯按钮下面弹出提示，以突出闪光灯按钮来提醒用户及时打开闪光灯。