设计
设计师
iOS 开发
交互设计
用户界面设计

你所见过哪些 App 的登录界面简单而又不失美感?

你所见过哪些 App 的登录界面简单而又不失美感?
关注者
3,173
被浏览
196,918

123 个回答

2016.1.15更新

对启动图有兴趣的也可以看看这个问题:

你见过什么应用的启动界面让你感觉富有美感? - 设计

2015.11.20更新

有评论说喜欢第一张,我个人也是比较喜欢 Steller 的登录界面,不过之前版本的我觉得更好看,所以还是发一下:

顺便再补两张:


----------------------------------原回答--------------------------------------










编辑于 2016-01-15 16:35

求你了招個Ui/Ux 設計師好嗎,設計真不是程序員做的

编辑于 2015-11-21 00:48

谢邀。

首先,如果题主的问题只是停留在界面的美观层面的话,简洁漂亮大方的登录页界面设计还是很多的,站酷和花瓣上你可以找到很多。




以上只是几个国内外比较认可的几款登录页界面设计,但我并不认为这些范例能对题主的设计起到太大的作用,毕竟我并不了解题主所要设计的产品究竟属于怎样的定位,但是一款优秀的设计必然是要立足于整体的产品之上,好看的界面也不等于好用的界面,如果题主只是忽悠领导或客户的话,找几个好看的界面抄下形式,自己再配下产品的主题色和LOGO也是OK的。

但是既然题主在交互的话题下提出了这个问题,我希望题主如果有心的话,可以去深入的了解下自己所设计的产品的背景,定位的用户群目标,我们所去做的不应当仅仅是好看的设计,那样和别人口中“美工”并没有什么区别,我们的目标应当是做“正确的、好用且美观的设计”。

下面引用了一些相关的回答,题主还是可以去了解下的。

界面视觉相关:

链接:

什么样的 App 界面的视觉设计才算是优秀的? - 杨曦的回答

如果题主对界面背后的交互体验同样感兴趣的,不妨看看这个,能帮助题主设计出更好用的登录界面。

链接:

怎么样的登录框才是优秀的? - MoonMonster 的回答

希望题主能够体味,用户界面设计作为用户体验设计中不可或缺的一环,我们在研究学习如何让界面更符合用户的审美趣味和流行趋势的同时,也要去了解我们的界面使用者的感受,并大胆的把自己的设计理念和成果阐述给上级或客户,让他们来了解我们的设计所能带来的更大效益,而不是单纯的做他们眼中的“美工”。说的有点多了,也可能偏题了,不过都是肺腑之言,再次谢邀了。

发布于 2015-11-07 16:42

我来简单的总结一下;

我大致的看了一下我安装的APP,发现app的注册登录页面设计有以下几种模式:

(1)像简书,豆瓣一刻这样的,先呈现的是登录,也就是说,APP默认进入这一页面的主要是已有账号的用户,但为新用户提供了注册选项,但在页面的重要程度低于登录的——只是一个跳转到注册页面的链接。这也是主流的APP登录/注册页面的设计模式。

(2)像next,犀牛故事这样的,提供登录和注册的两个按钮来区分和引导用户;

(3)第三种不多见,想即刻一样,只提供第三方账号(微信,qq ,微博等)登录按钮。

还有一些APP为了简化流程方便用户注册,推荐用户用第三方账号登录而弱化注册新用户选项,如种子习惯和糗事百科。


另外,在视觉呈现的层面讲,登录/注册页面设计也有以下几种方式,

(1)背景精美的插画,或者图片,如拇指时间,medium等等,

(2)纯色背景(颜色就是UI的主色调)例如path和穷游


(3)没有装饰性的元素,只有简单的logo,按钮等等,例如豆瓣,火柴盒和豌豆荚等。


只是简单的总结一下,希望有所帮助。

发布于 2015-11-15 15:27

b站

QQ空间

编辑于 2016-01-01 23:00

Snapseed.


除iPhone自带调色功能外

最赞赏的图片编辑器

这种低彩度低明度的温和配色

让我每次打开

都想去海边骑自行车

吃香草冰淇淋




Zine.

文字编辑器

登陆界面不算惊艳 但很清爽

但使用的整体舒适感很强

无处不透露出设计者的极简理念

本人是删除偏执症患者

但这款App常驻


记录在这里成为习惯

清爽的编辑界面使灵感也似乎来得通畅些



附带功能:自制壁纸

与白色图标融为一体

是不是很(性冷淡)棒





开眼.

因为一些原因暂时删除了

只能在App Store上截图

同Zine一样

是从头到脚的清爽



【其实same的登陆界面也很棒

可爱又性冷淡:)

只是因为功能比较鸡肋(勿喷= =

加上实在是忙

前段时间卸载了】


其实是有点偏题的

算不上登陆界面吧

但真的很喜欢它们

所以想推荐给大家

平时我可不舍得把我的小宝贝们说出来 哼 ( ̄^ ̄)ゞ


觉得一个视觉系满分的App

除了图标

开启界面

操作界面

功能的简洁易操作性还是最重要的

上面推荐的三款App

都集好看与好用于一身

不可否认

很多外国App的界面设计

要领先国产App一大截

但考虑到中文的操作便利性

(已经一个日语狗英语能力的飞速下降)

这里只推荐了最喜国产视觉系


对了

说到视觉系

有一款游戏大家应该都不陌生

《纪念碑谷》

让我在文章的最后送出我的膝盖们吧

通关以后就卸载了

所以没有图片

但几乎每一秒都是惊艳

建议诸位自己去体验一下

语无伦次 见谅

晚安。

发布于 2016-01-31 00:00

  UI设计创新技能层出不穷,UI设计满足着形形色色各种垂直化的需求,在设计方面大家也是想方设法去做一些创新,希望自己能够在各种应用中脱颖而出,今天我就针对 UI设计中登录页设计指南进行简单的说明。

  一、注册登录方式

  1.只使用第三方账号注册登录

  这种方式是最快捷的登录方式,省去了手机注册的繁琐操作,帮用户提高效率,节省时间。

  这里没有找到参考案例,可能现在用这种方式的APP已经很少了。

  2.只使用手机号注册登录

  使用手机号+获取验证码是目前最常用的注册登录方式,通过发送短信获取验证码在60-90秒内进行注册登录,这么做是为了确认用户拥有该手机号的使用权。

  手机号+验证码是比较简便的登录方式,手机号+密码是比较常用的登录方式。在输入手机号后,为了让用户查看是否输入正确,建议手机号显示样式为3-4-4模式(如186 3464 ****)




  手机号也是商家进行用户维护的有效手段,可以在节假日发送祝福或者促销短信,也可以在用户长期未使用产品时进行短信提示,避免用户将产品遗忘。

  3.使用手机号+第三方账号注册登录

  这种样式是上面两种样式的结合,一般这样的组合方式是希望用户使用手机号注册,所以手机注册登录比较突出,第三方注册会置于页面底部弱化处理。如下图所示:




  还有一类APP是希望用户使用第三方登录,弱化手机号注册登录。比如阿里旗下的闲鱼、一淘、飞猪等,登录时为了用户数据之间的连接,会推荐用户使用淘宝账号进行登录,从而弱化了手机号注册登录,这是出于产品属性方面的考虑。




  4.使用邮箱注册登录

  使用邮箱进行注册登录是以前PC端常用的方式,一些又有移动端又有PC端的产品会使用。

  5.先体验后注册登录

  一开始用户可以游客状态进入使用产品,当用到添加、收藏、关注、评论、购买等功能就必须要进行注册登录了,这种方式一般多用于阅读类、游戏类或是电商类产品中。

  这种方式对新用户的产生有积极作用,很多用户在不了解产品的情况下,可能只是想初步了解一下产品,又不想进行手机注册,所以会先进入熟悉一下产品,待初步使用了解后,再通过引导让用户进行手机号的绑定。

  二、注册登录页面设计要点

  1.分步骤注册登录

  先输入手机号, UI设计中登录页的设计指南点击“下一步”的同时,系统查询该手机号是否可以注册,通过的话则进入输入验证码页面,这样做的好处是可以及时反馈给用户,避免用户在输完手机号和验证码之后出现错误toast的情况。

  需要注意的是步骤不宜过多,建议3步以内。如下图所示:




  2.注册登录合二为一

  这种方式是将注册和登录合到一起,如果是第一次使用,只要输入手机号再填写验证码就相当于注册成功了。

  3.弹窗登录

  在用户使用必须要登录才能用的功能时会跳出弹窗登录界面。




  三、注册登录页面常用背景样式

  注册登录页面常用背景样式可分为以下六大类:白色背景、轻装饰背景、纯色背景、全屏大图背景、半屏图片背景、插画背景。

  1、白色背景

  使用白色背景是目前较为常见的设计样式。页面以信息录入为主,不做过多装饰。

  多用于体量比较大的APP中,主要目的是提高登录页面的操作效率,所以没有多余的点缀。如下图所示:




  2、轻装饰背景

  轻装饰背景会添加一些品牌设计元素或装饰来体现界面细节,增加产品品牌感。

  轻装饰背景常见的有以下几种处理方式:

  1、取产品相关元素进行装饰。

  2 背景做模糊处理增加界面层次感。

  3、加入意向类的图片。

  4、 添加几何元素进行装饰。




  3、纯色背景

  纯色背景多采用品牌色,也可搭配Logo进行设计,体现品牌感。

  该方式多用在登录信息简单或者以第三方登录为主的界面中,在不干扰用户视线的基础上丰富页面。

  如下图所示:腾讯课堂、知识星球均采用品牌色进行设计,同时可以看出他们的登录信息都较少,在视觉设计上也较为简洁。




  4、全屏大图背景

  全屏大图背景就是在登录信息下方平铺一张与产品相关的图片。

  优点:图片更容易吸引人的注意力,视觉上更有冲击力,也能提前给用户一个心理预期。

  缺点:信息和背景融合较高,视觉干扰比较大,多用在垂直类的APP中,对于一些体量较大的产品不太适合。

  如下图所示:




  5、半屏图片背景

  半屏图片和全屏图片有些类似, 都是通过意向图片传递产品品牌感,不过半屏图片重点是以登录信息为主,如下图所示:




  6、插画背景

  插画背景就是自己绘制品牌识别元素或者和品牌相关的元素作为背景。

  优点:插画更有亲和力,更能与用户产生情感共鸣。

  缺点:绘制成本较高,比较费时间。

  如下图所示:




  好了,今天的分享就到这里了,欢迎大家留言讨论哦。

发布于 2020-08-19 16:34

Tumblr

发布于 2015-11-25 02:43

其实在我们的生活中,手机里的app是非常多的,要是只是说登录界面的美观程度来讲,那可真是有好有坏,我来分享一下我认为比较不错的登录界面。

像我们最常用的应该就是qq和微信了。

(图片源自网络)

像这样的大厂软件来说,设计出的这种非常生活化的软件肯定首先要注意的就是颜色的搭配和交互功能键的设计了。就拿qq来说,这个登录界面,颜色以qq最常用的蓝白色来当主题色,经典并且登录界面也很简洁大方。微信是绿白的配色,交互同样是非常的简单明了,设计是很不错的。

再譬如说我们常用的一些例如说知乎、钉钉、浏览器等,它们的登录界面都是大同小异,账号密码,加上找回密码和登录注册的功能键,布局合理,并且满足使用者的需求,这些设计都是非常不错的。并且它们也都有共同的特点,那就是颜色不花哨,颜色的选择都非常合理,这个主要还是要根据软件的性质来决定。

在设计软件界面时,需要用到ps、ai、 墨刀设计软件等工具,如果说对页面设计有兴趣的话,可以学习一下这些软件,设计一个自己喜欢的页面。

编辑于 2021-11-21 00:57

当年初次相见真的惊为天人!


模仿了(抄袭了?)中国设计师吴中昊斩获2012年德国莱比锡世界海报大会全场大奖的海报作品<<未来>>

编辑于 2015-11-11 17:17

既然是打算做一个完整的APP,就应该从整体的视觉效果上去考虑,而不是单单一个界面。

正好之前收集了一些APP相对完整的界面设计,可以给题主参考下。

鉴于题主特别关注登录界面,所以我选的都是带登录界面的,题主,我好吧!

高能预警!下面大量图片!流量党小心!


那啥,最后这张是我的毕业设计作品中的一张展板的设计图。

臭不要脸的也放上来了(´◔౪◔)

然后我自己对比上面的再看一下,发现差距太大了!,,Ծ‸Ծ,,

编辑于 2015-11-10 15:56

找ideal来了?

发布于 2015-11-17 23:42

airbnb

发布于 2015-11-10 22:49

片刻,图案会换的,但是都很美

发布于 2015-11-15 04:08


本来想做个Medium离线阅读器,但发现好像开放的API并没有相关的内容,所以就只做了一个登录界面就放弃咯。

发布于 2015-11-14 09:43