设计规范 | 详解组件控件结构体系:引导类

本文是系列文章之详解组件控件结构体系的第三篇——引导类。enjoy~


本文是系列文章之详解组件控件结构体系的第三篇——引导类。enjoy~

设计规范 | 详解组件控件结构体系:引导类

引导是带领用户更快速更愉悦地达到目标的过程,能在用户使用产品功能前或遇到障碍之前给予及时的引导提示。

为了业务或者产品目标的需要,有时候需要给予一些适当的提示方便用户去理解产品。

为了完成不同的引导内容和引导的目标,移动端的引导设计会根据需求进行不同的多样化处理。常见的引导有:引导页(幻灯片)式引导,浮层式引导,嵌入式引导。

3种类型的引导各有各自的特点以及使用场景,本篇文章详解组件控件结构体系—引导类

依旧附上一张脑图,组件控件分类(如果单纯通过组件控件,难以满足功能划分的需求,所以我将这个范围扩大,分类里面不仅仅含有组件和控件,所以请不要在意细节。)

设计规范 | 详解组件控件结构体系:引导类

引导页(幻灯片)式引导

定义:一般出现在app首次启动的时候,是一系列宣传、解说、帮助等页面的组合。

在移动互联网的产品的设计中,引导页的设计则是在用户初次使用该移动产品时,给予的一些必须性的帮助以使得用户能快速愉悦地了解这个产品的功能与具体操作方式。

一方面从产品的角度考虑,产品希望用户能够方便得理解产品的特性,减少对产品的陌生感;另一方面,从用户角度来看,一个应用里好的引导不仅能使他们对一个应用有好感,也可能更容易得留住他们。

设计规范 | 详解组件控件结构体系:引导类

用途

1. 让用户快速了解是一个什么样的产品。

2. 让用户快速了解该产品的主功能、或者要重点宣传的特色、重大更换功能。

建议

1. 文案简单易懂,重点突出

2. 内容可以是图片、视频、插画漫画等,且内容和文案要有一定的关联性。

3. 分页符一般是2-5个。

4. 提供可以直接跳过引导页的操作。不强制用户一定全部浏览。

使用场景

1. 用户第一次使用时,产品通过引导页让用户快速了解产品的主功能。

2. 用户更新产品时,产品通过引导页给用户传导更新的新功能。

浮层式引导

定义:一种轻量级单目标性很强的引导方式,一般是浮层结合文案的,样式类似气泡的引导方式。

设计规范 | 详解组件控件结构体系:引导类

用途

1. 提示用户新增功能或页面调整,或如何使用该功能。

2. 提示用户重要功能或一些隐藏操作。

建议

1. 特有文案、带有指示箭头的类似气泡设计。

2. 一般为非模态浮层,大概显示3秒左右自动消失,对用户干扰较小。

3. 文案上尽量简洁,表意清晰,建议控制20字以内。

使用场景

1. 有些新增功能不易让用户察觉同时这些功能对产品本身来说显得比较重要,这时候需要浮层引导,让用户知道该功能或者使用方法。

2. 用于新手引导

嵌入式引导

定义:将引导内容直接嵌入到界面中的引导方式,可以嵌入到状态栏、导航栏、工具栏,比较常见的是嵌入到主题内容界面中。

设计规范 | 详解组件控件结构体系:引导类

用途

1. 让用户了解当前界面或者操作处于何种状态,并指导接下来如何操作使用。

2. 保留当前界面的内同同时,增加引导提示。

建议

文案简短表述当前状态并告知用户如何操作。

使用场景

1. 异常状态时使用嵌入式引导,目的是提示用户异常状态。

2. 初始状态时,由于界面数据为空,这时候通过嵌入式引导提示用户操作。

3种引导类型按照重要度依次为:引导页(幻灯片)式引导>浮层式引导>嵌入式引导。3种引导可相互组合使用。到底使用哪个?则根据业务和对产品的定位来判断。

相关阅读

设计规范 | 详解组件控件结构体系:导航

设计规范 | 组件控件结构体系:加载类

#专栏作家#

UX,微信公众号:UEDC,人人都是产品经理专栏作家。华为ITUX交互组组长。

本文原创发布于人人都是产品经理。未经许可,禁止转载

题图来自 Pixabay,基于 CC0 协议

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/20239/

(0)
CatherineCatherine
上一篇 2017-08-04 04:09
下一篇 2017-08-04 05:09

相关推荐

  • 做设计不得不讲究的一个点:平衡

    做设计,最难的不是搞清楚解决问题的最佳答案是什么。而是,站在全局去平衡问题与问题之间的关系,做当下资源条件下相对正确的设计决策。

    2017-05-05
  • 为了生存!QQ空间升级改变非主流印象,论用户体验的重要性

    关注留学签证移民的新资讯分享学习工作生活的新鲜事JT EDUCATION点击上方关注非主流、火星文、酷炫的QQ空间45度叫仰望天空、明媚的忧伤十年前,谁还不是个中二症患者?曾经的中二少年变成了大人大人不再点开的QQ空间也变样了面对微博微信这样的对手总要活下去这次QQ空间品牌升级重点在于对用户体验的设计哦?又是用户体验这个词真的是使用频率越来越高什么产品和服务都强调用户体验但具体说起来是什么意思呢?比如有人说现在发微博就像玩扫雷不知道发个...

    2018-03-06
  • 全民关注用户体验的时代已经到来

    聚焦2018年全国两会,共有13位人大代表和政协委员提倡在相关领域内发展与提升用户体验,范围遍布于新能源汽车、互联网、通信、教育科研、传媒、版权保护、交通运输与医药等数十个行业,引起了社会各界的广泛关注。两会期间,全国政协委员叶友达向大会提交了《关于鼓励基于用户体验的设计创新,加速科技创新成果转化的提案》。叶友达建议,从国家层面启动基于用户体验的设计创新倡议,构建用户体验设计创新战略和行动纲领。同时要加大对基于用户体验的设计创新的宣传力...

    微信热点 2018-03-22
  • 交互设计师应该了解的心理学理论:认知心理学、格式塔心理学和心流

    问:贴满一张卡需要多久,A和B是否相同?答案当然是不同,尽管同样需要买10杯咖啡,但往往B方案会更快地贴满。

    2017-05-20
  • Axure制作酷我音乐安卓端高保真原型案例下载

    本案例为原型库网站原创制作,转载请保留出处。这个原型文件,忘记是什么时候练习axure 时做的,做的不好,有bug,部件的层级关系不够明确,仅供参考。拿出来给有兴趣的朋友下载研究吧,关于这个原型的问题就不要找我提问咯,早已忘记了。
    前段时间又重新做了一下安卓端的酷我高保真原型,进步了很多,层级关系十分明确,这个最新的原型等过段时间再给大家分享吧。

    2015-01-04
  • 【笔记】对话十五年设计老兵问答实录

    2017年10月28日,UXRen深圳分舵举办了《对话十五年设计老兵:提问&分享&讨论》的分享活动,本文基于嘉宾刘云天设计总监的问题回答整理而成。   活动笔记(by A.King & 绿宝): 问题1:你在腾讯10年的…

    交互专题 2017-11-13
  • 你的QQ暴露了你的心——QQ大数据及其应用介绍PPT

    PPT概述: QQ大数据规模: QQ月活跃用户数超过 8.4亿 QQ最高同时在线超过 2.0亿 QQ空间月活跃用户数超过 6.5亿 QQ好友关系链对超过 900亿 活跃数据: 一天QQ总发消息超过 100亿 一天发空间说说、个签超过 1亿 数据…

    2016-01-27
  • 创新与用户体验---工业设计的双驱动力

    4月18日上午深圳融一凤巢设计发展有限公司创始人兼深圳市工业设计协会副会长仪永杰在PDC设计廊会场与到场展客商分享并探讨了现今智能硬件和消费电子类领域的设计发展趋势。仪永杰认为在消费升级的市场导向下,供方市场慢慢转化为需方市场,消费者不仅满足于产品的存在,更多的是产品在消费者内心中碰撞出情感。以小米科技为例,现今决定设计生命力延伸的是创新意识,是对工业设计创新的重视程度。从设计服务到产品化和供应链都需要整合创新满足用户对产品日益增长的功...

    2018-04-18
  • 交互设计要点&配色趋势

    色彩在任何一种设计中都起着很重要的作用,相差不多的色彩却能渲染出截然不同的情感效果。因此,好好利用色彩与生俱来的魅力,就能让你的网页设计更特别。 1Metro和柔和鲜嫩的色彩 Odam Luiran的网站是Metro风格,…

    2015-12-08
  • 【招聘】萧山众多高薪岗位专场来了,就在等你!

    萧山之窗移动生活由此开始....关注还在愁到哪里去上班吗?还在担心工资不够花吗?这里或许有适合你的岗位!2018萧山信息港小镇春季综合型人才招聘大会企业名称招聘岗位微医集团(浙江)有限公司资深Java开发工程师,搜索研发工程师,前端架构师,Java架构师,自然语言算法工程师,医学影像算法工程师,家庭医生,健康管理师,HRBP,客服专员浙江讯飞智能科技有限公司系统测试工程师,资深视觉设计师,视觉设计师,大数据工程师,高级交互设计师,研发架...

    2018-03-21