• 移动端常见的引导类型有以下6种，接下来我们可以从其定义、适用场景、设计拆解来看看每种类型引导页该如何设计。

• 新手引导页

• 定义：通过整页面的介绍来帮助用户理解产品。

• 适用场景：一般用于产品冷启动、较大版本升级后的新手引导。

• 设计拆解：引导页一般3-4页，图文➕操作按钮（如跳过）。说明文字需简明扼要降低阅读成本，视觉上需传递产品品牌、情怀态度。另外如内容类、社交类APP会把了解用户的相关设置放在引导页，设计上更偏向表单类，在此不过多展开。

由于引导页的设计越来越侧重情感化，主视觉除了静态产品界面图，还有提升用户观感和参与度的（串联式）插画、（滚屏交互）动画、微动效、视频等等。

分步蒙层引导

• 定义：通过分步式的“高亮重点”将产品功能进行逐一介绍。

• 适用场景：作为产品新手引导，传统的分步蒙层引导叠加于产品界面上方，干扰性强且单次可传递的信息有限，不推荐使用，除非是功能特别复杂、新概念或类游戏的产品。

• 设计拆解：分步引导尽量控制为3步，图文➕步骤进度（可选）➕操作按钮（下一步/上一步/跳过）。说明文字需尽量精简，可以让用户快速了解产品功能布局及特色。

弹窗引导

• 定义：通过弹窗形式对产品使用途中的关键特性进行指引。

• 适用场景：弹窗承载信息量适中，一般用于版本更新说明、功能引导、关键任务操作指引、创新微交互演示或运营活动。

• 设计拆解：结构通常为上下布局，图文➕操作按钮。具体需根据所传递的目标信息进行设计，如更新说明以常规图文排版呈现清晰即可，而运营类弹窗视觉可跳脱规范外以吸引用户参与活动。

嵌入式引导

• 定义：嵌入产品流程中的引导页面或提示组件，对使用过程中重要功能进行说明。

• 适用场景：比弹窗引导干扰性低而接受度高，可以用于新手引导（教学任务），（危险）功能引导，运营活动等，功能引导还可以引申为空页面引导。

• 设计拆解：嵌入式引导作为产品使用流程的一部分，需根据具体业务进行设计。运营活动通常用嵌入式的提示组件，图文➕关闭（可选），虽干扰更小但建议活动内容需和当前页内容相关。

操作交互引导

• 定义：用户在使用过程中触发的操作类引导提示。

• 适用场景：该类提示较轻量，一般在隐蔽功能触发时出现，介绍该功能的使用方式，帮助用户正确的使用。常见于工具和视频类产品。

• 设计拆解：该类引导侧重功能操作信息的传递，文字➕手势图（可选），图片信息传递效率高于文字，尽量结合图标图片提高阅读性，同时要注意精简文本。

气泡引导

• 定义：通过轻量气泡形式在功能更新时或首次使用时提示用户。

• 适用场景：气泡属于非模态弹窗（不影响当前操作），干扰性最小，可用于隐蔽小功能引导，内容推荐等。

• 设计拆解：设计元素有文字➕图片（可选）➕操作按钮（可选）。根据出现位置可分为toast和popover。toast通常出现在顶部或底部且会自动消失，最初为纯文字，后续为满足更多场景，演变出带操作按钮的气泡snackbar。popover气泡卡片出现在相应功能附近，有上下文关系且可以包含更多内容元素，其中纯文字提示气泡通常称为tooltips。

那上述类型该如何在设计中正取使用呢？可以按以下步骤进行思考：

• 引导目的：产品新手引导、功能提示、操作指引、运营推广
• 类型选取：根据引导目的，结合具体用户场景下所需引导的强弱，选取合适的引导类型。上述引导类型的强度（信息量&干扰性）排序如下，页面引导>分步蒙层引导>弹窗引导>触发式操作引导>气泡引导。
• 引导设计：单个提示的出现时机、视觉展示、消失机制、出现频率。还需注意一个页面中切勿同时重叠多个提示，app启动周期内注意较强引导数量如控制运营弹窗个数，避免影响用户体验。

这里是专为国内产研团队提供设计协作平台的「行空设计」欢迎伙伴们体验和交流～

Powered by Froala Editor