这样设计注册 / 登录页面更有效-蜗牛派

这样设计注册 / 登录页面更有效

后台有小伙伴留言请教注册 / 登录页面的设计方法,这期就为大家介绍几个设计小技巧。如果你有想了解的交互知识,也可以在后台留言,我们会尽力为你答疑解惑!

注册 / 登录页面,这样设计更有效!

登录页面的设计方法和技巧

注册和登录是用户使用线上产品时的必要操作。在这一环节中,任何非人性化或不友好的体验都会让用户对品牌的印象大打折扣。优秀的注册流程设计,不仅能够建立起用户对产品的信任感,还会为后续的体验感知做铺垫。以下几个方法,有助于提升用户注册和登录的意愿,推荐你试试:

方法1 :增加利益点

“利益点”是产品的让用户接受的特点,能给用户带来直接或间接的利益。页面上直观可见的“利益点”会吸引用户关注,利益点如果恰好符合用户需求,也更易引发用户共鸣,具体做法如下:

PC 端:除了要填写的表单,页面还有很多空余区域,在这些区域增加利益点,既提高了页面屏效,也可以更好的展示品牌特色。

案例1:淘宝的登录页面会展示最新产品活动的宣传内容,点击后即可跳转到对应的活动页进行有更多了解,即使是在注册页没有注册的用户,被活动的折扣力度吸引,注册和登录的意愿也会提升:

注册 / 登录页面,这样设计更有效!

案例2:GUCCI 的登录页面直接展示了用户登录后享有的权益,提升了用户的身份归属感,使用用户权益激励用户注册:

注册 / 登录页面,这样设计更有效!

移动端:移动端因为页面尺寸有限,可以通过添加背景海报和品牌口号更好的展示出利益点。

如小红书的注册页,品牌 LOGO 加 “标记我的生活” 品牌口号,搭配滚动的生活图片背景,从用户视角出发,更具有亲和力,获取用户认同感:

注册 / 登录页面,这样设计更有效!

方法2 :优化文案设计

不同的文案会给用户带来不同的感受。巧妙的选择用词,避免生硬的“注册”和“登录”,尝试站在用户的角度思考和编排语言,可以降低用户的心理防备:

案例1:GUMROAD 网站将常用的 “sign in” 变为 “get started for free”,让用户刚开始便产生 “薅羊毛” 的感受,更愿意点击注册按钮:

注册 / 登录页面,这样设计更有效!

案例2:ZEPETO 的登录界面用 “制作 ZEPETO” 和 “已有 ZEPETO” 的文案,代替了 “登录” 与 “注册”。“制作ZEPETO” 抓住了用户想获得尝试机会的想法,以制作自己作品为出发点,降低了用户对注册的心理防备:

注册 / 登录页面,这样设计更有效!

方法3 :巧妙新颖的小创意

有创意的页面会让用户眼前一亮,加深用户对品牌的印象,带着好奇和探索的心态完成注册登录。

案例1:Timing 登录页面的短视频风格,结合滚动展示的反问式话语,激发起用户的好奇心和新鲜感:

注册 / 登录页面,这样设计更有效!

案例2:Readme 把动画和交互体验很好的结合在了一起。小猫头鹰会在用户填写完一项后指向下一处填写内容,引导用户一步步的完成操作,既起到了指引作用又为注册流程增加了趣味性:

注册 / 登录页面,这样设计更有效!

方法4 :简化流程

很多平台可以使用第三方账号直接登录,使流程变得简单快速。如无法使用第三方平台,则需要尽可能的简化操作步骤,除必要的注册信息外,其他重要内容都可以在注册成功后提醒用户进行完善,避免耗时且繁杂的填写项目降低用户的耐心。

案例1:Keep 的登录页把注册和登录页合并。未注册的用户无需切换页面,手机验证后就可以自动登录。动态运动视频也提升了页面的吸引力:

注册 / 登录页面,这样设计更有效!

案例2:NIKE 网站的登录页面,替用户默认勾选登录状态,为用户再次登录提供便利;同时将需要勾选的隐私政策和使用条款,变为 “一旦登录,即表明同意”,默认用户已认可条款,简化用户的操作行为:

注册 / 登录页面,这样设计更有效!

检测和评估设计方案

我们曾在之前的文章中给大家介绍过埋点的功能。埋点用于收集用户特点和行为,分析埋点采集的数据,可以对页面设计和优化后的效果进行检测。根据用户的操作情况,了解用户的注册 / 登录的转化率。

分析埋点可以使用不同维度的数据分析工具,如:用热力图工具查看用户常用的操作项和用户关注的页面区域;用漏斗分析工具发现用户在页面上操作流程断点;还可以根据表单中每一项内容的重填率和流失率,分析用户对哪些操作不满意,再进行下一轮的产品设计和优化。

本文作者: 长弓小子,其版权均为原作者所有,文章内容系作者个人观点,不代表蜗牛派对观点赞同或支持,未经许可,请勿转载,题图来自Unsplash,基于CC0协议。
分享到:更多 ()
Copyright © 2015-2024 woniupai.net 蜗牛派 版权所有
皖ICP备18016507号-1 | 本站内容采用创作共用版权 CC BY-NC-ND/2.5/CN 许可协议