为什么你的登录页看起来和别人一样?

登录页面设计代表着用户对产品的第一印象,如果这个页面做的不好,那么很容易就会让别人对我们的产品印象不好。登录页面设计应该清楚的传达产品调性,同时在视觉上帮助用户完成登录这样的一个任务。

登录页应该有醒目的标识,经常吧企业形象与产品或服务相结合,提高用户度,避免用户注意力漂移,今天我们就来盘点一下目前市面上的产品里都做得挺不错的登录页吧!!!(觉得不错的放进你们的参考小后宫噢)

背景类

看多了大多数的单调且简洁的登录页,有着炫酷且多变的动态背景的登录页是不是会让人眼前一亮,并且看的停不下来,先来说说几个背景特别的APP吧!

1、马蜂窝&虾米音乐

马蜂窝和虾米音乐的登录页面最大的亮点在于他们的背景动图背景都很好的点明了产品的核心,产品的形象鲜活了起来,如下图所示:



这个我们在参考的时候可能需要考虑一下公司的产品特点,以及时间和成本的投入是否是公司能够承担的(这个是很现实的问题)。其次马蜂窝还有一个小交互细节,值得注意一下,当用户开始输入账号的时候,背景的动图就会变成高斯模糊,减少用户在输入时所受到的干扰,这虽然是一个小细节,但是在我们平时设计的时候是一定要考虑到的小细节。

2、毒&映客

如果第一种实现起来有些难度,也可以转换一种难度系数不是很高的形式,如下图所示:

3、Lofter

Lofter的登录注册入口与引导页相结合,用户在登录的时候能够看到更多的产品信息,这种设计在是市面是比较少见的,如下图所示:

4、快手电丸&FACEU


这两种APP是将手机和第三方登录都做成按钮,同时搭配产品形象插画,这么做的好处是可以将产品的想象更加突出,但是从操作上来说,如果用户是手机登录,还需要进入二级页面,但背景的设计可以参考,容易出效果,同时又能快速符合产品调性。对于大背景设计的难度系数最低,新手设计师推荐优先尝试。

顶部图片

1、最右&bilibili&快手漫画


上图中的三个产品都是产品有卡通形象的产品,同时还很有识别度,因此将有他们放在登录界面顶部,有助于产品形象的深入化,同时当用户在输入密码的时候,卡通形象还会转变成蒙上自己的眼睛或者别的动作,既有趣味性又给用户安全感。以上三个都是不同类型的产品,但是采用了同一种登录方式,但他们都有相对年轻化的用户群体,以及卡通形象的产品,因此使用这种能够更好的固定产品形象。

2、36氪&松果

36氪的头部小背景让整个登录页面不会显得太平,视觉上也不会太过单一,我们可以来做个对比,如下图所示:


上面两种图中有背景和没有背景的登录页,我们能够很明显的发现没有背景的从视觉上显得很单一,并且没有了识别度。想要做比较简约但是又有点特别的登录页可以参考这类的头图,会让你的登录页不那么单调还有识别度。

弹窗登录

叨叨记账&波洞


叨叨笔记使用的是一种类似弹窗同时带有tab切换的登录形式,但是只适合只有一种第三方的登录形式,如果数量一多,就要改变形式或者去掉tab,但是这种表现形式也是挺特别的。作为腾讯旗下的波洞,设计风格很鲜明,登录直接使用的弹窗形式,应该考虑到大多数用户都喜欢直接用第三方登录会比较方便,同时也是自己的产品,因此做成了弹窗形式。上面的两种是不同形式的弹窗,小伙伴们可以根据自己公司产品支持哪几种第三方登录来决定选用哪种参考。

图标

陌陌

陌陌的登录注册页可能大家看着觉得很普通,没什么特别的,我刚开始也觉得很普通没什么特别的,但是大家可以注意一下它的第三方登录,如下图所示


QQ和微信的icon都是自制的,与我们见到的大多数第三方的icon都不太一样,所以这个点可以作为我们设计第三方登录时参考的点。(我找了好多个产品,目前发现的只有陌陌的图标比较特殊)毕竟我们找参考并不是直接照抄页面,只是可以选择每个页面优秀的地方来成为我们学习的地方。

图标

音遇

音遇的号码输入框也是很优秀的,如下图所示:


音遇的账户输入框是会随着文字的增加减少而改变宽度,这样可以让用户更专注于输入账号的输入,以及及时确认自己的输入是否有误。

划重点

因为考虑到实现的问题,所以我找的参考大多都是线上稿,变身成厉害的设计师之前总要做练习,做积累,而有一双能够辨别出好设计的双眼能够让你事半功倍。很多人都会说因为我们审美不行,其实不好看的页面也有值得借鉴的地方,好看的设计也不是所有的想法都适合我们,我们需要学会辨别,而积累仅仅是开始的第一步。

海盐社(公众号)

作者:潘团子

(0)

相关推荐

  • 企鹅直播怎么样?企鹅直播登录及看直播使用教程

    什么是企鹅直播? 企鹅直播是一款专注体育赛事的手机直播软件,企鹅直播APP为用户提供了高清.快捷.流畅的视频直播和体育赛事直播服务,包含各类热门体育赛事直播,NBA.中超.欧洲杯.美洲杯.奥运会.德甲 ...

  • 电脑axure怎么制作登录页和注册页切换效果

    接下来小编就教大家怎样使用axure来制作登录页和注册页的切换效果.具体如下:1.首先我们打开电脑,找到axure图标点击打开.进入到软件界面之后,我们找到左侧菜单中的登录页选项,然后我们就可以拖动登 ...

  • 微信APP怎么开启发现页看一看功能

    微信APP是我们常用的社交软件之一,有小伙伴问怎么开启发现页看一看功能,下面小编介绍一下.具体如下:1. 打开[微信]APP,点击右下角的[我的]2. 在个人页面,点击"设置"选项 ...

  • 手机微信怎么打开/关闭发现页看一看入口

    微信是现在最常用的社交软件之一,有些用户不知道手机微信怎么打开/关闭发现页看一看入口,接下来小编就给大家介绍一下具体的操作步骤.具体如下:1. 首先第一步打开手机中的[微信]App,根据下图箭头所指, ...

  • 手机微信如何关闭发现页"看一看"入口

    微信是现在最常用的社交软件之一,有些用户想知道手机微信如何关闭发现页"看一看"入口,接下来小编就给大家介绍一下具体的操作步骤.具体如下:1. 首先第一步打开手机中的[微信]App, ...

  • 手机微信如何打开/关闭发现页"看一看"入口

    微信是现在非常流行的一款社交软件,有些用户想知道手机微信如何打开/关闭发现页"看一看"入口,接下来小编就给大家介绍一下具体的操作步骤.具体如下:1. 首先第一步根据下图箭头所指,找 ...

  • 微信朋友圈为什么看不到别人的评论

    微信朋友圈看不到别人的评论,是因为只有互为共同好友才可以看到对方在别人朋友圈的评论. 微信朋友圈评论显示的规律是这样的. 假如有三个人,A,B,C,有两种情况: 1.如果ABC三人都是好友,那么评论的 ...

  • 手机支付宝钱包有点异常如何查看登录记录看是否有人登录

    支付宝钱包如何查看登录记录?想必几乎每个用户都拥有一个自己的支付宝钱包账号吧,现在的支付宝钱包不仅能买衣服,就连去吃什么玩什么都直接可以直接支付宝付款,直接预订。这样也方便我们去吃什么东西不用排队或者 ...

  • 10个方法让用户充分信赖你的登录页

    隐私时代如何让用户安心?想让用户注册登录,除了视觉上要下功夫,让用户相信你也是关键之一,那么如何让用户信任你呢?别急~今天小编带来的文章就是让用户充分信赖你的方法,帮助降低用户不安全感的实用技巧,仔细 ...