写给UI新手的APP结构指南：用户引导和提示

这主题是用户引导和提示，它们打扰到用户，也有很的共通点，就暂且归到一集中聊一下。

先看下体内容：

△ 以下图片来于网络和应用截图，仅作为学习交流使用

我们先来说说户引导，户引导在 app 的使过程中是十分见的，是必可的，旨在降低户的习成本，快速了解和上手产或者是增功，避免户使过程中的迷茫，减犯错率，是升产整体愉快体验的必要手。

一、用户引导的种类

1. 闪屏引导页

闪屏引导页主要目是用户展示品新功能操作法，这个部分上篇文章里有过描述，这里不多赘述了。

2. 新手引导（页面遮罩+提示）

顾名思义就是教新用户何使用产品，用户打开应用是为达到某个目的，而不是为花时间学习怎样使用，新手引导的用就是短时间内让用户快速上手产品或者是新增功能，目的是节约用户的时间，减少犯错率。但是我现在现类的引导有一个现象就是整页一次展示出部提示或是文字，每次看到种引导页的感就是害怕，么内容竟要我一个个住，而短期忆又容易遗忘，越想住能就忘的越快，给我造成负担，相信你们也有同样的感受。（下图就是一反例）所以在设计类引导的时建议一定要突出重点功能，文字要精简；或者是能够采用分步引导，寻找恰当的时机，比正使用到某个功能，出现引导，样更一点。分步引导切忌，不一次次的点击只让用户感到厌烦。

3. 操作引导

这类引导旨希望用户完产品希望完的某种指的操作，比如完善人资料、身份认证、充会员、点击收藏/关注……这类操作都不强制用户完，但可能设的会让人很欲望的去完操作。一些 app 会采用 FAB 按钮，置一些核功能，又或者让用户产粘性的功能，比如氧气的签到功能，方便用户去使用；还一些页面出动图行引导的况，一般常见于电商或者视频类app中，这种会直观，比如下图中支付宝 – 口碑页面的签到icon一直闪烁，蘑菇街首页的动图一直也闪……这类例子很多，特点都特别显眼，很去一探究竟的冲动。

4. 功能性引导

这类引导是指比较隐蔽性的功能层面，不会有确切的指引，而是触及某个点而出现的引导类型，例如：在支付聊窗输入数字，会出现给对方转账的引导；在应用中进行截图会引导享至/博等；或是截图后的一段间内，在聊页面开右下角加号按钮会动出现刚出现的截图，方便发送……

5. 对话式引导

这类引导方式较见，一般是悬浮在页面上，几秒钟后就会自消失。颜色取上最好要跟页面颜色区分开来，如略带透明的红色、黑色等，要有较明确的箭头指示，它可现在页面任意位置，可带有上浮效果，人很有点击对象查看的欲望，点击页面他位置就会自消失，对话式引导目的性较明确。

6. 弹框引导

这类引导会打断用户使用品，用户打扰最大，然也会让用户最视。组合：黑色遮罩（60%-80% #000000）+文/插图+触发button（+关闭button）。该类引导需要用户做出选择后才会被关闭，有纯文说明类，例如退出登录、误提示弹框等；也有伴有图片类，比如首页领券等，可能伴有动效，会显不那么单调，有趣味性，容易接受。

7. 局部引导

局部引导一般在页面顶部出现，也有嵌页面某一地方的情况，通常用警示用，比消息提醒未打开，网络异常等等，通常的组合是：文字+伴有红、黄等警示类块（+关闭button），以引用户的重视。

8. 全局引导

全局引导就比较好理解了，就整页面都引导提示，属于主动型引导。常见的就空页面：文字提示+插图占符+跳转button，点击button 会入某页面，避免出下面第三整页空白的况，不然用户会觉得卡住了或出了 bug。

9. 其引导

• 小红/数+红：常见是未读消息，相信很多强迫症患者都会有把小红掉冲动，我是度强迫症患者，看见必须掉，这是利用了用户这心理作用，来到查看品类似促销等信息目；
• 字醒：经看见应里的某个模有促销就会现这类引导，一般会伴有红点使，相信大已经见怪怪了；
• toast 引导：式是 toast 类型，但是用作引导，例如下拉刷新后，出现提示刷新数据，点击进行查内容。

小结

引导的使用要根据场进行合理选择，合理、有趣味的引导设计，给产品加分，增强用户探索新功能的欲望，当，初衷是为方便用户的使用，合适的时机出现合适的引导，切忌乱用，否则只适得其反。

二、提示

每一款应用离不开提示，提示的用就是告用户当前操的结果，及时的反馈，什么时用什么提示是有区别的，也是有讲究的，要尽能的减少对用户的打扰。

1. 弹框（模态弹框）

类提示和上面说的弹框引导出一辙，对用户的打扰大，也最受重视，属强互。弹框包含黑遮罩，主页面不以进行操，要通某种操退出，一般用告促销活动，比红包、优券，又或是版升级、对应用进行评价、允许定位、打开消息通等。弹框以分为告弹框、操弹框、底部弹框/功能弹框（换头像、选期、分享至双微等）、选择弹框、信息录弹框（输密码）……弹框的设计要有能吊用户的积极，比生动有趣的文案或是插画，即使是讨厌的弹框也以让用户容易接受。另外弹框要避免叠加的情况，就是在弹框的基础上次弹出弹框。

2. 浮层提示（模态弹框）

比较常见的一种提示类型，比如微信页面右角点击添加 button，或按复制。

3. toast 提示（非模弹框）

toast 是一种比较常见的提示方式，最初是安卓系统控件，现在 iOS 也广泛运用，比较轻量化，属于弱交互，对用户扰较轻，出现的间较短，一3秒以内，不需要用户进行操作，如果文字过长，用户也不会记住，比较容易忽视，所以文字要简短、炼。一比较常见的就是成功提示、失败提示、警告、加载中……有的出现在页面中间，也有的出现在页面顶部或者底部；还有一类 toast 是需要动关闭的，可能是因为提示比较重要，和引导的作用类似，但是不建议这计。

4. Snakbar（非模态弹框）

它是卓的系统控件，和 toast 类似，区别就是它可进行操作，较见，示字（+button），介于 toast 和弹框之间，点击后消失或是几秒后自消失，一般现在页面。

注作者的公众微信号：「Eason张UED」

图片素材作者：totushi .