如今,同类产品竞争越演越烈。用户对产品的第一印象往往决定了一切。而用户的第一印象又起始于引导页。也就是说,引导页的好坏,很大程度上直接影响用户是否最终使用或购买产品。如果设计师能够一开始就添加引人入胜的引导页设计,产品吸引和说服用户使用和购买的机率就会更大。
因此,本文将结合真实的设计案例,为大家介绍引导页相关构成和设计技巧,和大家一起探讨引导页如何设计,才能短时间内留下最好的第一印象,提供最佳用户体验。 一起来看看吧!
什么是引导页?
首先,我们先了解一下“引导页(onboarding)”这一基本术语。引导页(Onboarding page),最初来源于招聘和人力资源领域,用于指代一切能够帮助新员工快速上手、适应环境的流程、技术和方法。大家都知道,刚入职的员工多少都会有些压力,需要努力学习和适应,才能有所改善。而这些来自企业层面的引导流程和协助方法,不仅能够快速缓解他们的焦虑和紧张情绪,还能够有效提升他们的自信心,让他们更加高效地学习、工作和交往,从而快速为企业创造价值。
其次,用户体验设计领域迅速吸收了这一术语,用于指代网页或App设计中,能够安慰用户并简单介绍产品的一系列交互设计和设计技巧。
考虑到用户(尤其是第一次使用产品的新用户),并不会花费太多时间了解产品的工作原理,用户引导页设计,首先需要解决的问题就是:明确设计优先级。毕竟,用户愿意学习产品的时间和能够记住的内容都是有限的。 所以,即使产品信息确实很多,也千万不要尝试在引导页展示所有细节。正确的方法应该是给各个信息设定优先级,由产品相关人员共同决定产品信息展示的先后顺序。当然,在此需要注意的是,教程、向导、提示以及说明之类都是产品最基本的信息,需要优先进行考虑。
正在上传…重新上传取消
Bee Exchange的引导页设计,文案简洁有力,视觉层次结构清晰,直观高效地展示用户最关心的产品内容。
利用动画,提升界面活力
另一个能够有效提升趣味性和用户参与度的方法,就是在引导页中添加动画。好的动画设计,不仅能够让人机交互更加生动自然,还能为界面注入活力,轻松打造出让人眼前一亮的视觉效果。更重要的是,动画还能有效突出一些重要的细节。当然,类似的设计也会增加界面加载难度。所以,设计师需要谨慎评估,向开发了解相关技术可行性之后,再考虑是否添加。
吸睛的3D动画设计,能够有效提升引导页的趣味性和吸引力。
允许跳过
引导页设计,也需提供跳过选择。因为并非所有用户都需要使用引导。事实上,根据大量产品设计实践证明,即使是第一次使用产品的新用户,也可能想要直接跳过教程引导。所以,是否添加类似功能,也需要设计师反复测试和分析之后,再决定。
添加提示设计
工具提示是帮助用户体验界面功能的重要方式。它们在用户一步步探索界面功能的过程中,逐一展示,提示按钮或界面功能,突出产品特色,是用户使用产品的重要引导性设计。
Amazon工具提示设计,引导非注册用户及时注册登录。
考虑空状态设计
对于那些需要用户填充信息的产品,设计师则需要考虑空状态的设计。因为在用户添加任何个人信息或内容之前,它们往往都是空白的。此时界面该如何布局才能留住用,就变得至关重要。例如, 某些产品设计中的愿望清单、项目集合以及用户反馈等界面,虽然它们暂时是空白的,但确是获取用户反馈和提升用户参与度的重要方式,不容忽视。
Dropbox的收藏项目模块的空状态设计,就通过添加有趣的插画和简短的提示文案设计,引导用户如何选择和使用该功能模块。
注意情感化设计
富有情感的产品,拥有独特的魅力,能够快速与目标用户建立牢固的情感联系。而情感化设计,就是实现这一目标最灵活有效的方式之一。设计师需在充分调查和了解用户之后,确定整体的感情基调,然后再开始设计。在未确定产品与用户交流应该使用的基本语气、语调以及感情色彩之前,千万不要贸然开始撰写任何文案。
此外,切忌不要幽默过度。尤其是那些面向多国售卖产品的企业,需要特别注意。因为很多在我们看来十分趣味幽默的设计,在他国用户看来,可能一点都不幽默,有时甚至可能会冒犯到他们,最终影响产品销量。总之,情感化设计,也需要设计师把握好度。
避免过度设计
老实说,并不是所有用户都需要使用引导或帮助。所以,设计过程中,也不要过分突出引导性或帮助性设计。事实上,在以下情境中,引导页设计甚至会带来反效果:
总之,设计师需要注意平衡和取舍,及时测试,不断优化。
结语
综上所述,优质的引导页设计是产品与用户之间不可或缺的沟通桥梁,能够快速与用户建立牢固的情感联系,清晰展示产品特色同时,轻松给用户留下最好的第一印象,从而提升产品销售量。设计师们需要格外重视。