热门标签 | HotTags
当前位置:  开发笔记 > 后端 > 正文

【技巧和案例分享】引导页如何设计,才能把用户顺利“引进门”?

如今,同类产品竞争越演越烈。用户对产品的第一印象往往决定了一切。而用户的第一印象又起始于引导页。也就是说,引导页的好坏,很大程度上直接影响

如今,同类产品竞争越演越烈。用户对产品的第一印象往往决定了一切。而用户的第一印象又起始于引导页。也就是说,引导页的好坏,很大程度上直接影响用户是否最终使用或购买产品。如果设计师能够一开始就添加引人入胜的引导页设计,产品吸引和说服用户使用和购买的机率就会更大。

 

因此,本文将结合真实的设计案例,为大家介绍引导页相关构成和设计技巧,和大家一起探讨引导页如何设计,才能短时间内留下最好的第一印象,提供最佳用户体验。 一起来看看吧!

 

 

什么是引导页?

 

首先,我们先了解一下“引导页(onboarding)”这一基本术语。引导页(Onboarding page),最初来源于招聘和人力资源领域,用于指代一切能够帮助新员工快速上手、适应环境的流程、技术和方法。大家都知道,刚入职的员工多少都会有些压力,需要努力学习和适应,才能有所改善。而这些来自企业层面的引导流程和协助方法,不仅能够快速缓解他们的焦虑和紧张情绪,还能够有效提升他们的自信心,让他们更加高效地学习、工作和交往,从而快速为企业创造价值。

 

其次,用户体验设计领域迅速吸收了这一术语,用于指代网页或App设计中,能够安慰用户并简单介绍产品的一系列交互设计和设计技巧。

 

考虑到用户(尤其是第一次使用产品的新用户),并不会花费太多时间了解产品的工作原理,用户引导页设计,首先需要解决的问题就是:明确设计优先级。毕竟,用户愿意学习产品的时间和能够记住的内容都是有限的。 所以,即使产品信息确实很多,也千万不要尝试在引导页展示所有细节。正确的方法应该是给各个信息设定优先级,由产品相关人员共同决定产品信息展示的先后顺序。当然,在此需要注意的是,教程、向导、提示以及说明之类都是产品最基本的信息,需要优先进行考虑。

 

正在上传…重新上传取消

Bee Exchange的引导页设计,文案简洁有力,视觉层次结构清晰,直观高效地展示用户最关心的产品内容。

 

 

利用动画,提升界面活力

 

另一个能够有效提升趣味性和用户参与度的方法,就是在引导页中添加动画。好的动画设计,不仅能够让人机交互更加生动自然,还能为界面注入活力,轻松打造出让人眼前一亮的视觉效果。更重要的是,动画还能有效突出一些重要的细节。当然,类似的设计也会增加界面加载难度。所以,设计师需要谨慎评估,向开发了解相关技术可行性之后,再考虑是否添加。

 

吸睛的3D动画设计,能够有效提升引导页的趣味性和吸引力。

 

允许跳过

 

引导页设计,也需提供跳过选择。因为并非所有用户都需要使用引导。事实上,根据大量产品设计实践证明,即使是第一次使用产品的新用户,也可能想要直接跳过教程引导。所以,是否添加类似功能,也需要设计师反复测试和分析之后,再决定。

 

添加提示设计

 

工具提示是帮助用户体验界面功能的重要方式。它们在用户一步步探索界面功能的过程中,逐一展示,提示按钮或界面功能,突出产品特色,是用户使用产品的重要引导性设计。

 

Amazon工具提示设计,引导非注册用户及时注册登录。

 

考虑空状态设计

 

对于那些需要用户填充信息的产品,设计师则需要考虑空状态的设计。因为在用户添加任何个人信息或内容之前,它们往往都是空白的。此时界面该如何布局才能留住用,就变得至关重要。例如, 某些产品设计中的愿望清单、项目集合以及用户反馈等界面,虽然它们暂时是空白的,但确是获取用户反馈和提升用户参与度的重要方式,不容忽视。

 

Dropbox的收藏项目模块的空状态设计,就通过添加有趣的插画和简短的提示文案设计,引导用户如何选择和使用该功能模块。

 

注意情感化设计

 

富有情感的产品,拥有独特的魅力,能够快速与目标用户建立牢固的情感联系。而情感化设计,就是实现这一目标最灵活有效的方式之一。设计师需在充分调查和了解用户之后,确定整体的感情基调,然后再开始设计。在未确定产品与用户交流应该使用的基本语气、语调以及感情色彩之前,千万不要贸然开始撰写任何文案。

 

此外,切忌不要幽默过度。尤其是那些面向多国售卖产品的企业,需要特别注意。因为很多在我们看来十分趣味幽默的设计,在他国用户看来,可能一点都不幽默,有时甚至可能会冒犯到他们,最终影响产品销量。总之,情感化设计,也需要设计师把握好度。

 

避免过度设计

 

老实说,并不是所有用户都需要使用引导或帮助。所以,设计过程中,也不要过分突出引导性或帮助性设计。事实上,在以下情境中,引导页设计甚至会带来反效果:

 

  • 引导性内容太多

  • 引导性内容太分散用户注意

  • 引导性内容不够清晰

  • 用户无法跳过或取消引导设计(例如并未提供“不再提示”之类的设置选项)

  • 引导性内容并未提供任何有用信息

 

总之,设计师需要注意平衡和取舍,及时测试,不断优化。

 

结语

 

综上所述,优质的引导页设计是产品与用户之间不可或缺的沟通桥梁,能够快速与用户建立牢固的情感联系,清晰展示产品特色同时,轻松给用户留下最好的第一印象,从而提升产品销售量。设计师们需要格外重视。

 


推荐阅读
author-avatar
fuotb_204
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有