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

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

背景类 看多了大多数的单调且简洁的登录页，有着炫酷且多变的动态背景的登录页是不是会让人眼前一亮，并且看的停不下来，先来说说几个背景特别的APP吧！ 1、马蜂窝&虾米音乐

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

这个我们在参考的时候可能需要考虑一下公司的产品特点，以及时间和成本的投入是否是公司能够承担的（这个是很现实的问题）。其次马蜂窝还有一个小交互细节，值得注意一下，当用户开始输入账号的时候，背景的动图就会变成高斯模糊，减少用户在输入时所受到的干扰，这虽然是一个小细节，但是在我们平时设计的时候是一定要考虑到的小细节。
2、毒&映客如果第一种实现起来有些难度，也可以转换一种难度系数不是很高的形式，如下图所示： 毒和映客这两款APP ，他们的登录页面背景使用照片做成的背景墙动图，会自动上滑，略微的图片集锦上移也很酷，同时符合这两款产品针对年轻人使用的调性。但是一般来说大背景的登录页面对图片以及视频的要求会很高，如果是做练习或者飞机稿并不是很建议大家选择图片背景（因为符合产品定位的图片是真的很难找），如果大家依然想要大背景，可以继续看下面两种。
3、LofterLofter的登录注册入口与引导页相结合，用户在登录的时候能够看到更多的产品信息，这种设计在是市面是比较少见的，如下图所示： 这种比较适合想要做大背景的登录页面，但是没有找到适合产品图片的设计师来选择。它的优点是能够介绍更多的产品信息，但是缺点也很明显，因为登录页是个用户目的性很强的功能操作页面，因此很有可能就会被忽略过去。
4、快手电丸&FACEU 这两种APP是将手机和第三方登录都做成按钮，同时搭配产品形象插画，这么做的好处是可以将产品的想象更加突出，但是从操作上来说，如果用户是手机登录，还需要进入二级页面，但背景的设计可以参考，容易出效果，同时又能快速符合产品调性。对于大背景设计的难度系数最低，新手设计师推荐优先尝试。
  顶部图片 1、最右&bilibili&快手漫画 上图中的三个产品都是产品有卡通形象的产品，同时还很有识别度，因此将有他们放在登录界面顶部，有助于产品形象的深入化，同时当用户在输入密码的时候，卡通形象还会转变成蒙上自己的眼睛或者别的动作，既有趣味性又给用户安全感。以上三个都是不同类型的产品，但是采用了同一种登录方式，但他们都有相对年轻化的用户群体，以及卡通形象的产品，因此使用这种能够更好的固定产品形象。  2、36氪&松果36氪的头部小背景让整个登录页面不会显得太平，视觉上也不会太过单一，我们可以来做个对比，如下图所示： 上面两种图中有背景和没有背景的登录页，我们能够很明显的发现没有背景的从视觉上显得很单一，并且没有了识别度。想要做比较简约但是又有点特别的登录页可以参考这类的头图，会让你的登录页不那么单调还有识别度。   弹窗登录 叨叨记账&波洞 叨叨笔记使用的是一种类似弹窗同时带有tab切换的登录形式，但是只适合只有一种第三方的登录形式，如果数量一多，就要改变形式或者去掉tab，但是这种表现形式也是挺特别的。作为腾讯旗下的波洞，设计风格很鲜明，登录直接使用的弹窗形式，应该考虑到大多数用户都喜欢直接用第三方登录会比较方便，同时也是自己的产品，因此做成了弹窗形式。上面的两种是不同形式的弹窗，小伙伴们可以根据自己公司产品支持哪几种第三方登录来决定选用哪种参考。  图标陌陌

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

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

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

音遇的账户输入框是会随着文字的增加减少而改变宽度，这样可以让用户更专注于输入账号的输入，以及及时确认自己的输入是否有误。   划重点 因为考虑到实现的问题，所以我找的参考大多都是线上稿，变身成厉害的设计师之前总要做练习，做积累，而有一双能够辨别出好设计的双眼能够让你事半功倍。很多人都会说因为我们审美不行，其实不好看的页面也有值得借鉴的地方，好看的设计也不是所有的想法都适合我们，我们需要学会辨别，而积累仅仅是开始的第一步。