对移动平台产品“登陆页面”设计的一些分析
话说前几天看到了elya姐姐写的一篇《从手机产品登录页面设计想到的》文章。加之自己也使用了快一年的iPhone OS平台的很多互联网产品。也算是对文章中谈到的“登陆页面”这个细节有所感触。作为一个无线互联网产品新人，就寻思着也写一下在平时使用过程中对这些产品交互设计上的一些个人看法。
和elya姐姐一样，对于互联网产品，我也是追求简单而高效的设计。刚好最近几天下载了飞信在iPhone OS平台的app，试用下来，感觉飞信的登陆页面是我用过的产品中登陆页面体验比较差的一款。开头就以飞信为例，谈谈我对这块儿设计的看法。
左图是默认的页面，右图是点击登陆框后虚拟键盘打开后的页面。
我个人对这个登陆页面的设计总结就是：内容很繁杂，关键点不聚焦。
具体而言：
在左图中，整个页面呈现了太多太多的内容，而且中间部分的登陆和下面部分的快速登录帮助使用了两个分层框。一个使用者第一次进到这个页面，会被这么多的内容搞得很迷糊。而且其注意的焦点也会被分散。从而使用的效率会被大大的降低。
在右图中，上半部分还是内容过于繁复，框架是从左图中间部分的框架移植而来，飞信的logo被大幅度减小。上下部分的配色，字体问题也比较突出。而且两张图中，登陆框我觉得都比较小，输入的字符得仔细看。
对于上面两幅图中的文案，也存在问题。
比如两个登陆框内已经提示了“请输入飞信号或手机号”和“请输入密码”的前提下，前方的“账号：”“密码：”就可以省略掉。
账号输入框上方的接入点的选择提示基本可以和最下方的“快速登录”一起合并到“设置”的二级页面来呈现。
“立即登陆”这个按钮，看起来像是被硬生生的插了进去。太突兀了。
对于“登陆页面”这个产品（姑且称之为产品吧），我觉得它的首要核心功能是让用户快速高效的完成输入账号密码的动作从而快速的进入到产品的使用当中。
所以对于它的设计，就是给用户呈现非常少的核心信息，而用户可以高效的聚焦，快速的使用。
一、产品架构
上图中就是我觉得这个页面所必须给用户呈现的最核心的内容了。太多的内容会显得繁杂，不聚焦。
当然，像“帮助”“设置”之类的在有的产品中需要有，但就不是核心的了。
参考一下其他比较优秀的设计，：
这是所有的设计中，我觉得最简洁高效的一款了。甚至它连登陆的按钮都省略了。因为很多用户在输入完信息后直接点 Go 就可以了。
但是它存在的一点点的瑕疵就是密码输入框下方的“注册Facebook”如果更加美化处理下就更好了。
人人网的基本的沿袭了Facebook的设计，但是在 注册 的处理上就比较完美一些。
QQ也是十分优秀。中部的登陆框，接下来对于 注册账号 和 登陆 框的不同颜色处理。通过蓝色背景白色字体的设计，更一步加强了 登陆 的聚焦度。
右下角的设置按钮也对进一步的信息推送做了很好的补充。
像Foursquare的。就直接在首页采用2个入口的形式。点击登陆后：
也是非常的简洁有力。
以上的几个优秀的设计，都是在突出了核心信息的情况下，做到了高度的聚焦。
二、细节设计
如上图所示，主要从登陆页面进入后虚拟键盘的开启与否角度切入。
默认开启的例子：
好处在于进入后直接输入内容，然后登陆。不需要二次点击。
默认关闭的例子：
如上面腾讯微博和新浪围脖的例子。
在虚拟键盘默认关闭的情况下。首页有更大的面积。从而可以适当的向用户推送一些动态的内容。比如新浪围脖首页下方的微博广场。就是一个比较好的亮点。腾讯微博光秃秃的下方就有一点突兀。至于推送的动态内容是否会对用户的聚焦产生影响。还得进一步根据实际情况分析。
对于我而言，还是比较喜欢虚拟键盘默认打开的设计。
简洁而高效。
三、最后的思考
1、用户在使用了保存密码和自动登录的功能后，以后使用中会有多少次碰到登陆页面？
2、简洁与高效的设计是否会因呈现信息太少而是很多傻瓜用户产生迷失？
3、对于默认关闭虚拟键盘的设计来说，推送的动态信息是否有价值？
4、自动保存密码，自动登录这些功能是否需要默认打开或者关闭？
5…………
左图是默认的页面，右图是点击登陆框后虚拟键盘打开后的页面。
我个人对这个登陆页面的设计总结就是：内容很繁杂，关键点不聚焦。
具体而言：
在左图中，整个页面呈现了太多太多的内容，而且中间部分的登陆和下面部分的快速登录帮助使用了两个分层框。一个使用者第一次进到这个页面，会被这么多的内容搞得很迷糊。而且其注意的焦点也会被分散。从而使用的效率会被大大的降低。
在右图中，上半部分还是内容过于繁复，框架是从左图中间部分的框架移植而来，飞信的logo被大幅度减小。上下部分的配色，字体问题也比较突出。而且两张图中，登陆框我觉得都比较小，输入的字符得仔细看。
对于上面两幅图中的文案，也存在问题。
比如两个登陆框内已经提示了“请输入飞信号或手机号”和“请输入密码”的前提下，前方的“账号：”“密码：”就可以省略掉。
账号输入框上方的接入点的选择提示基本可以和最下方的“快速登录”一起合并到“设置”的二级页面来呈现。
“立即登陆”这个按钮，看起来像是被硬生生的插了进去。太突兀了。
对于“登陆页面”这个产品（姑且称之为产品吧），我觉得它的首要核心功能是让用户快速高效的完成输入账号密码的动作从而快速的进入到产品的使用当中。
所以对于它的设计，就是给用户呈现非常少的核心信息，而用户可以高效的聚焦，快速的使用。
一、产品架构
上图中就是我觉得这个页面所必须给用户呈现的最核心的内容了。太多的内容会显得繁杂，不聚焦。
当然，像“帮助”“设置”之类的在有的产品中需要有，但就不是核心的了。
参考一下其他比较优秀的设计，：
这是所有的设计中，我觉得最简洁高效的一款了。甚至它连登陆的按钮都省略了。因为很多用户在输入完信息后直接点 Go 就可以了。
但是它存在的一点点的瑕疵就是密码输入框下方的“注册Facebook”如果更加美化处理下就更好了。
人人网的基本的沿袭了Facebook的设计，但是在 注册 的处理上就比较完美一些。
QQ也是十分优秀。中部的登陆框，接下来对于 注册账号 和 登陆 框的不同颜色处理。通过蓝色背景白色字体的设计，更一步加强了 登陆 的聚焦度。
右下角的设置按钮也对进一步的信息推送做了很好的补充。
像Foursquare的。就直接在首页采用2个入口的形式。点击登陆后：
也是非常的简洁有力。
以上的几个优秀的设计，都是在突出了核心信息的情况下，做到了高度的聚焦。
二、细节设计
如上图所示，主要从登陆页面进入后虚拟键盘的开启与否角度切入。
默认开启的例子：
好处在于进入后直接输入内容，然后登陆。不需要二次点击。
默认关闭的例子：
如上面腾讯微博和新浪围脖的例子。
在虚拟键盘默认关闭的情况下。首页有更大的面积。从而可以适当的向用户推送一些动态的内容。比如新浪围脖首页下方的微博广场。就是一个比较好的亮点。腾讯微博光秃秃的下方就有一点突兀。至于推送的动态内容是否会对用户的聚焦产生影响。还得进一步根据实际情况分析。
对于我而言，还是比较喜欢虚拟键盘默认打开的设计。
简洁而高效。
三、最后的思考
1、用户在使用了保存密码和自动登录的功能后，以后使用中会有多少次碰到登陆页面？
2、简洁与高效的设计是否会因呈现信息太少而是很多傻瓜用户产生迷失？
3、对于默认关闭虚拟键盘的设计来说，推送的动态信息是否有价值？
4、自动保存密码，自动登录这些功能是否需要默认打开或者关闭？
5…………
aaaaaaaa
