美文网首页@产品产品交互设计
优秀设计案例分析——用户引导(上)

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

作者: 沐风与体验设计 | 来源:发表于2018-06-05 14:42 被阅读90次

无论是作为交互设计师,还是产品经理,肯定都遇到过新上线的功能需要引起用户的注意,或者是想让用户填写某些信息这些需要。这些需要是从产品的角度出发,希望用户使用某个功能,或者提供某些信息。企业以营利为目标,从企业的角度看这本无可厚非。但如果从用户的角度,如果收到莫名其妙的提醒,或者被逼迫去填写一些信息,势必会引起反感。如何巧妙地植入这些提醒信息,不引起用户的反感,甚至是真的能够帮助到用户,就成了一个交互设计师的一个使命。

关于用户引导,我总结了4种手段,它们分别是:气泡、整个页面、默认值、动效。下面通过我找到的优秀的设计案例,为大家介绍如何使用。

一、气泡

这是最常见的一种,最平凡的运用方式,就是当新上线了一个新功能,就冒个气泡出来提示一下用户,比如下面这个页面:

需要注意,气泡的文案一定要提供有价值的信息:这个功能能做什么、这个功能的操作有什么特别之处等等。另外,这种提示气泡最多只能出现2个,超过2个就会对用户造成比较大的打扰。比这个高级的方式,是在特定的时间或操作之后,为用户提供可能对用户有帮助的提示,比如百度地图的这个例子:

当我在下午17:08打开应用的时候,在“路况”按钮旁边冒出一个气泡,提示我现在是晚高峰,可以打开“路况”躲避拥堵。这是很贴心的一个设计。

再比如Facebook的网页版,当我首次播放视频之后,页面会弹出一个气泡,提示我可以进行收藏:

还是Facebook,不过这次是手机端,当应用检测到我在一段时间内拍摄了许多新照片,会冒出一个气泡:

气泡里展示着最近拍的照片,用行动在引导着用户:快选择一张发个动态吧!

这样精巧的设计,不但不会让用户反感,反而会成为用户觉得贴心。如何才能做出这样的好设计呢?有个办法可以帮到大家:用户体验地图。感兴趣的朋友可以去搜一下。

二、整个页面

这种方式一般用在用户第一次开始使用某个功能时,对于重要的信息,使用一整个页面来提示,防止用户错过。比如,当我首次打开这个相机应用的时候,会出现如下的提示:从右向左滑动录制视频。

还有这个例子,当首次打开这个视频录制应用时,会出现如下图的授权提示:

这样做的好处是让用户充分了解操作的意义,给用户充分的预期,带来掌控感。

以上为大家介绍了“气泡引导”和“整个页面引导”这两种引导的方式。下周继续介绍另两种方式:默认值引导和动效引导。

讨论让人认识更深刻。欢迎大家留言讨论,共同进步。

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

相关文章

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

    无论是作为交互设计师,还是产品经理,肯定都遇到过新上线的功能需要引起用户的注意,或者是想让用户填写某些信息这些需要...

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

    新上线的功能由于需要引起用户的注意,或者是想让用户填写某些信息,时常需要用户引导的手段吸引用户的注意。但这些引导,...

  • UI设计中的APP导航模式总结

    优秀的APP导航设计,能够合理地完美展示产品的功能,并快速引导用户使用,增强用户的识别度。合理的导航设计,会让用户...

  • 读《学习设计与课程开发》|4月第八次分享

    和大家聊聊案例的设计和开发。 无论是我们在做培训或引导工作时,我们可以清楚的发现,案例分析具有鲜活性...

  • 移动应用设计细节分析——表单

    本文通过表单的系统表现以及用户输入交互两方面,分析表单设计的一些准则和优秀案例。 参考文章:表单经典原则是错的?来...

  • 「数据采集」- 埋点2

    一、埋点设计案例: 二、哪些数据需要统计 首先将数据目标归类: (1)功能分析;(2)业务分析;(3)用户信息;(...

  • 译文 | 如何做新手用户引导

    优秀的新手引导不只是好的设计,而是如何让用户爱上你的关键。 资深设计师和产品经理都认为初次使用产品的用户体验是产品...

  • PC 网页的横幅设计

    最近在做这方面的设计,收集和分析了一些案例,顺便写下来。(当然,分析都是主观的,我不清楚他们的数据)。 闲鱼:引导...

  • 培训人

    如何设计一个优秀的案例 案例分析可以活跃课堂气氛,激发学员学习兴趣,启发学员思考,促进学员对培训内容的理解和掌握。...

  • 销售---“引导”案例分析

    顾客:我想把头发剪成短发,要类似于手机里图片的感觉 理发师:嗯… 这个发型不是很适合你,如果你想剪短发,我可以给你...

网友评论

    本文标题:优秀设计案例分析——用户引导(上)

    本文链接:https://www.haomeiwen.com/subject/ohxajftx.html