facebook注册登录,facebook注册登录显示暂时无法处理

朋友说某个APP不错，下载后正准备好好体验一番，却被糟糕的注册登录页面弄的精疲力竭，无奈最终只能放弃。注册登录流程能让用户扭头就走，也能让产品获得新用户的芳心。

一个合格的注册登录页面，应该是具有清晰的操作流程，良好的交互细节和美观的视觉设计。

1.清晰的操作流程

APP的注册登录有三种流程:

①无需注册登录

常见于系统自带的工具类APP，像经常使用的闹钟、日历、计算器等等；一些简单的第三方APP：乐流，榫卯等。

这些APP的特点都是功能相对单一，比较“轻”，不需要记录用户信息或行为历史。

计算器&榫卯

②非强制登录

有注册登录的流程，但是用户不需要注册登录也能使用产品的部分功能，也就是所谓的支持游客模式。

内容类、购物类、娱乐类等都会使用这种形式。

非强制登录又有两种设计流程，一种是先展现出注册登录页，但是允许用户跳过。

展开全文

网易云音乐&豆瓣

另一种是直接展示产品功能，当用户想深入使用某些功能时用户得选择注册登录。

开眼&same

③强制登录

用户必须先进行注册登录，才能正常使用产品功能。社交类、2B类、工作类的产品会使用这种流程。

强制注册登录的流程会影响用户的转化率，所以产品不是严重依赖于账号系统的话，尽量采用非强制登录的方式。

path&企业微信

2.不同的注册登录方式

①邮箱

最开始的时候注册登录是基于PC的，也就是基于网页，PC时代的互联网产品多使用邮箱作为唯一ID。所以邮箱注册成为主流，而且注册过程中需要验证邮箱也很方便，用户直接在PC端就可以完成所有操作。

现在很多APP依然保持着邮箱注册的方式。

②手机号

随着移动互联网的到来，人们触网的主要设备已经从PC逐渐转移到智能手机。

加上手机号码的实名制、全球通业务的普及，使得手机号码也具有了唯一标示性。而且在移动互联网时代，用手机号码作为登录ID，并用短信验证码的形式来验证ID，这些操作流程都基于手机端，特别方便快捷。所以手机号码逐渐取代邮箱成为APP注册登录的主流方式。

③.用户名

早期用户名注册登录还很常见，但是随着第三方登录的普及，以及用户名登录自身的缺陷：“只能区别用户的ID，并不能获取到用户的联系信息”，用户名注册登录的方式已经退出主流。目前很多产品会将用户名作为昵称来用，而不是作为注册登录的ID来使用。

④.第三方账号

邮箱、手机号、用户名，都属于自建账号体系的方式，除此之外还有一种方式：第三方账号登录。用户不需要输入注册登录信息，直接选择第三方账号就能完成登录。国内常见的第三方账号有微博、微信、QQ、豆瓣、人人等，国外常见的第三方账号有Facebook，Twitter，Google等。

现在国内除了超级APP之外的APP基本都支持第三方账号登录，这样能简化用户注册登录的流程，提高APP的用户转化率。

这四种方式各有优劣，但总的来讲，通过手机号注册登录会更方便，通过获取验证码输入四位或六位数字就能完成注册登录。

3.注重交互细节

APP的优秀与否，由很多因素决定，而良好的交互细节是每一个优秀APP的共同品质。只有从用户场景出发，并从用户的视角来思考产品，才能设计出打动人心的APP。

①用显示/隐藏icon代替输入两遍密码

为了确保密码输入正确，很多APP需要用户输入两遍密码来确定密码输入无误，但这无疑增加了用户的工作量。替代方案是在密码输入框右侧增加一个“显示/隐藏icon”，让用户在输入完一遍密码后可以选择点开“显示/隐藏icon”来确保密码输入无误，减少用户的工作量。

issuu&in

②弹出相对应的输入键盘

点开邮箱输入框，弹出带有@的英文输入键盘。

点开手机号输入框，弹出九宫格数字输入键盘。

点开密码输入框，弹出英文输入键盘。

这是很小的细节，虽然用户可能不知道哪里不对，但是他能体会到好不好用。一个APP注意了这点，那用户就会觉得这个APP好用。而另一个APP没有做到这点，无论点击哪个输入框弹出的都是九宫格中文输入键盘，用户就会觉得这个APP不太好用。

作为设计师，要知道用户觉得不好用的原因是什么，这样才能对症下药，改善用户体验。

③对手机号码进行3 4 4的分布。

这个规则不仅适用于手机号码，包括银行账号、转账金额等等。

这是因为人的短期记忆是有限的，即一次只能记住有限的东西，如果强制记住很长的东西，短期记忆就很容易出错。

所以将数字以4或者3为单位分组，有利于用户阅读、编辑、校对手机号码。

淘宝&Facebook

④登录时增加一键清空icon。

在登录的时候偶尔会出现输入错误，如果没有这个清除的icon，用户只能按键盘中的清除按钮，需要一直按住直到输入框为空。

一个是只需要点一次就能清空，一个需要长按一段时间或者连续按多次才能清空，孰优孰劣可想而知。

dosnap&nice

⑤清晰的错误反馈。

当用户输入错误信息时，最好利用临时框的形式提示用户。而不是不做反应让用户自己去猜到底是怎么回事。

临时框也有两种形式，一种是下图左侧的对话框形式，这需要用户点击确认才能进行下一步操作。一种是toast的形式，弹出一两秒后自动消失。个人更倾向于第二种形式，因为第一种形式相当于强制中断了用户的操作，用户需要点击确认才能回到原来的操作流程。而toast则起到了提示的效果，并且没有打扰到用户。下图右侧的airbnb，在用户输错密码时，不光有底部的临时框提示，还将整个登录页面的背景色油绿色变为醒目的橙色，这种设计在提示用户的前提下，还做到了赏心悦目，是个不错的设计思路。

QQ&airbnb

4.美观的视觉设计

紧密：通过元素的远近将相似元素分为一组。

对齐：通过对齐，规范元素的排版 。

简约：注册登录页面的背景尽量简约，从而让主体信息更加突出。

对比：将重要的内容放大，增加色块背景；将相对次要的内容缩小，降低明度等从而使得信息层级清晰。

均衡：注册登录页面几乎都是沿着中心线左右对称的，信息是左右均衡摆放的。否者会导致页面不平衡。

品牌调性和产品定位：视觉风格要能体现出品牌调性，也要做到符合产品的定位。

平时收藏的一些视觉不错的注册登录页面：

bilibili&facebook

未知&UBER

早期互联网产品多使用邮箱或用户名登录，这是PC时代人围绕设备走的特性决定的，而现在是移动互联网时代，是设备围绕人走，手机号自然成了主流的注册登录方式。而现在，如果你的产品没有自建账号系统的需求，请直接使用第三方登录的方式，其快捷简单的操作，无疑是成本最小的注册登录方式。

如果之前是邮箱注册登录的产品，建议后期加入绑定手机号码功能，在允许用户使用邮箱登录的前提下，也提供手机号快捷注册登录的方式，还可以增加第三方登录的方式。毕竟注册登录属于产品需求，并不是用户需求，尽可能降低用户在注册登录时的成本，能提高新用户的转化率，帮助产品成功。

在满足产品需求的前提下，让注册登录有一个清晰的操作流程；良好的交互细节；美观的视觉设计，是做好注册登录页的葵花宝典。

APP用户体验十大原则：

如果想从众多的产品中脱颖而出，获得成功的话，其实最重要的突破点就是要抓住用户的体验，或者是抓住了用户的某一种心里，或者是在界面布局上大胆突破，或者是做了很少有人关注到的细分领域，或者是让人产生了真实生活中的亲切感等等，但这一切都源来于生活中的设计的灵感和技巧。

1、流程图是一切工作的基础

如果跳过流程图直接进入开发会让开发变得复杂、不可控，很容易让用户迷茫，所以最后用户必将选择关掉或者卸载你的App。所以，即便是一个简单的app也要有一个思虑周全的流程图，以确保它有合乎逻辑的、合理的导航结构。另一点就是要确保核心功能所在的屏幕位于上层，而不是被埋没在多层导航元素之下。

2、设计师一定要明确把握自己的分工

设计师创建的每一个细节都要经过开发者才能变得活灵活现。花几个小时和几天时间做出的简单设计更改对App功能的影响是截然不同的。还有，设计不能命令功能。比如，一个计划好的App可能有一个搜索框，设计师预想的是一个产生实时结果的键入搜索，但设计师不能是做这个重大决定的唯一决策人。

3、避免使用位图和低分辨率的图片

一般而言，设计首先是为视网膜显示屏、高分辨率的显示屏设计，然后按比例缩减。很多设计师都清楚这一点，但仍值得一提。屏幕分辨率越来越多，设计师需要从高分辨率设备做起，再按比例缩减。更好的做法是使用矢量图形进行设计而不是位图或者栅格图像。

4、点击区域设置一定要合理

大多数用户的食指宽1.6~2厘米(44px~58px之间)。设计时要考虑到手指的宽度，而且用户在快速移动手指的时候，很难准确的点击小片屏幕。在屏幕上加大量的按钮和功能很容易，但按钮一定要足够大，间隔也要足够大，否则用户容易误点。

5、介绍动画的设计一定要精细

在用户首次打开App的时候，给用户一个动画的介绍是个不错的想法，但不能太过火了。事实上，这些介绍动画也延迟了用户接触App的时间。如果你打算使用介绍动画，那要让动画时间尽可能短，设计尽可能精细以及足够吸引人，值得用户花费时间等待。App加载过程中会先展现图片，再过渡至动画。要确保这个过度是平滑的，贴切自然的。

有的App从加载图片过渡至介绍动画设计的非常蹩脚，这就很无趣了。

6、给用户一个加载提示设计

App加载时间过长很容易让用户以为出现了什么故障，也会带来糟糕的用户体验。App加载的时候不要让用户看到空白的屏幕，使用加载指示条或者小动画让用户知道App处于正常运行当中。如果能加入一个加载进度指示条就更好了。

7、不同的操作系统要有不同的设计

不同的移动操作系统比如iOS、Android和WPh7，都有迥异的审美观。开发者需要认真学习各个操作系统的人机界面指南，做好不同版本App的移植工作，不要让用户迷茫和不适应，不一定非要让App看起来是系统自带的，但至少不能让人感到突兀，感觉不属于这个平台。

8、在高密度像素屏幕上禁止填充过多的信息或UI组件

当为高PPI(pixel per inch每英寸像素) 屏幕设计UI时，因为有更多的像素可以使用，所以可在界面放置更多信息或者UI组件。请记住一定要预览一下你在实际设备上的所有设计结果。充塞了很多信息或者UI组件的界面会显得非常杂乱，并且难以有效导航，更会影响界面上的主要功能的展现。

9、可用性测试的必要性

可用性测试是必须的，不管你的App看起来多么好。找值得信任的人(或者有经验的设计师)进行小范围封闭测试，在公开发布之前更新一下界面。另一个简单易行的获得用户反馈的方法是在分类网站张贴广告招募合适的人进行焦点小组测试。

10、不要忘记手势 但不要滥用

不是每个元素都是可视化的，比如iPhone Mail app的删除进程。在收件箱内，用户可以猛击屏幕显示删除按钮，用户就不用点击“编辑”，选择信息然后再删除信息。不过，也不能说“编辑”菜单一点用处都没有，不知道快捷操作的用户还是需要的，而用户还可以通过“编辑”菜单一次性标注多条信息/邮件。 一句话，不要忘记手势但也不能滥用，通常要避免通过使用手势进入菜单，或者通过手势。

文：邹志楠