优秀设计案例分析——用户引导(下)

新上线的功能由于需要引起用户的注意,或者是想让用户填写某些信息,时常需要用户引导的手段吸引用户的注意。但这些引导,如果使用不当,可能造成打扰,引起用户反感。如何巧妙地植入这些提醒信息,不引起用户的反感,甚至能够帮到用户,就成了一个交互设计师的一个使命。

上周的文章,为大家介绍了用户引导4种手段中的前两种:气泡引导、整个页面引导(文末可查看)。这周的文章为大家继续介绍后两种形式:默认值引导和动效引导。

三、默认值引导

这种引导方式,一般用于需要用户补充信息的地方,如设置封面图、填写简介之类。设计的思路,主要有两个:

1. 告诉用户补充了信息有什么好处;

2. 启发用户如何填写。

先看第一种思路。下面这个例子,是Facebook客户端,“更多”标签下,点击“个人主页”后进入的页面。页面中深色的封面图区域,写着“告诉你的朋友们你关心的内容”,然后下面放着一个“+封面照片”的按钮。这样的提示,有效地告诉用户“封面图”有什么作用,激发用户上传封面图。

第二种思路,即“启发用户如何填写”,一般用在需要输入文字信息,这样对用户负担比较大的地方。比如个人简介这种信息,猛地让人填写,该填点什么好呢?🤔 Facebook网页版的这个设计,就为用户提供了各种提示,减轻了用户负担,如下图:

在“简介”一栏,上图中的提示信息会隔几秒轮换出现,提示用户可以填写的信息类型。不得不说,这样具体的提示,比单纯给个“简介”,要生动具体的多了!

在提示用户方面,谷歌日历的一个例子,也很有帮助:当用户创建日程,如果时间上选择了一天,则输入框里的文案提示是“例:晚上7点在XX地方有晚餐”,选择一周则提示“例:到纽约旅行”。根据用户不同的选择进行相应的、最有帮助的提示,这样贴心的设计真正让人眼前一亮👇

来自知乎的这个设计,也值得为大家分享:当没有任何用户问我问题时,会有一条官方的“值乎的提问”,问题就是“你___有什么特别的技巧?”这个设计有两个功能:1. 引导用户补充自己的技巧信息;2. 演示了当有别人向你提问时的状态,可谓一举两得。

以上为大家分享了默认值引导这个类型的案例。

四、动效引导

动效是引导方式中比较能吸引用户注意的一种,因为人眼天生对动的东西更敏感。因此,在使用动效进行引导的时候需要注意把握动效的强烈程度,保证不打扰到用户的主要操作。

下面这个例子,是使用支付宝付款后,评价部分会出现动效:页面中评价的4个级别会依次从左向右逐渐点亮,引导用户进行选择。从这个页面的结构来分析:最上面是付款信息,之后是消费后获得的福利,该部分由于视觉上面积大,所以能够引起用户注意;评分在福利部分的下面,位置不占优势,但使用动效,可以适当引起用户注意,是很棒的设计。

在知乎的H5页面,底部有一个置底的操作栏,点击可以打开知乎APP。H5页面其实一直有一个重要的使命,就是将用户从H5页面中引导到APP中,因为APP中功能更丰富、内容更多,体验也更好,用户APP中的停留时长、打开次数等指标也是APP的一些关键指标。这个H5页面底部随着歌声摇摆的刘看山,既达到吸引用户注意力,引导用户点击浮栏进入知乎APP的作用,也在一定程度上展现了知乎的品牌形象。不过该类内容类的页面需要格外注意动效不能太强,以免影响了用户的核心体验:阅读文章内容。

以上为大家介绍了默认值引导和动效引导两种方式。如果大家对前两种引导方式:气泡引导、整个页面引导也感兴趣,可以查看下面的链接:

优秀设计案例分析——用户引导(上)

我是沐风,爱奇艺高级交互设计师。留德海龟,曾任职腾讯微生活、网易、宜信。6年交互设计经验,帮你提升设计技能。欢迎关注。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,056评论 5 474
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,842评论 2 378
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 148,938评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,296评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,292评论 5 363
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,413评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,824评论 3 393
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,493评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,686评论 1 295
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,502评论 2 318
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,553评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,281评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,820评论 3 305
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,873评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,109评论 1 258
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,699评论 2 348
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,257评论 2 341

推荐阅读更多精彩内容

  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    X先生_未知数的X阅读 15,967评论 3 119
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,006评论 4 61
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,336评论 25 707
  • 是那颗为你而破碎的心 完整了我的生命 这不是病句 而是爱的定律 ——《病句》 ​​​​
    段童阅读 282评论 0 2
  • 为什么能够断章取义 望文生义的想,断章取义的意思是不读取全文,只按照需要,读取章节中的一部分,为自己所用,其意往往...
    疏影0701阅读 1,217评论 0 0