APP登录界面设计时应该包含的几大要素简介

大多数情况下，APP的登录界面决定了客户对APP的第一印象，所以在进行APP登录界面设计时一定要格外用心，设计出一个无瑕疵且吸引人的登录界面才可让客户对使用APP有更加强烈的兴趣。下面faceui为大家分享一下APP登录界面设计时应该包含的几大要素，希望对您有所帮助。

　　APP登录界面需要包含的几大要素

　　一、背景的选择

　　1.纯色背景：整体上看起来非常的干净。

　　2.毛玻璃效果：要控制好效果，注意颜色搭配，否则会看来有点“脏”。

　　3.渐变色。

　　4.蒙版背景图片：要注意背景图片的选择及蒙版的透明度，否则容易造成输入框和按钮辨识度降低。

APP登录界面设计（图片来自网络）

　　二、上半部分（即输入框的上面）

　　当前主流的App登录界面一般不显示标题栏，界面整体显示大方，空间感强，上半部分一般展示图片（可能是应用的logo）、文字（应用的名称或一个体现App的短句）或者图片加文字的方式。

　　三、输入框和登录按钮

　　1.纯输入框，里面有输入内容的提示文字

　　2.输入框增加一个小图标，用来标识需要输入的内容

　　3.输入框前或输入框中带title

　　四、注册键位

　　只要两种表现形式：按钮和文字。位置一般在登录按钮下方。一般更倾向于按钮，因为使用频率比较高。

　　五、忘记密码键位

　　大都采用文字展示，毕竟这个功能的使用频率较低，相对于登录和注册是最不重要的功能，一般会放在登录按钮的下方，部分App会放到登录按钮和文字框之间，居左放。

　　六、联合登录键位

　　一般会放在登录界面的最底部，有些App会放在登录按钮之下，注册按钮的上方（毕竟联合登录也属于登录）。

　　APP登录界面设计的两种思路

　　第一种APP登录界面设计思路：大众化设计

　　普通纯色背景，元素就是登录框和密码框，加上登录按钮，这类APP登录界面设计比较大众化，中规中矩。通用的布局就是：上-中-下，上面一般放置企业形象logo或APP名称，中间就是登录密码框，下面就是注册信息。这类APP登录界面的背景是渐变的或者多色块的。很有扁平化的意境。

APP登录界面设计（图片来自网络）

　　第二种APP登录界面设计思路：：情感化设计

　　在大众化设计的基础上，会加上一些情感化的元素，比如人物头像，代表这个APP有象征意义的图标或者背景素材。比如信封，旅游图片。

　　也有一些APP登录界面背景会随着当前的时间来变化背景，如果是白天，背景是简约而阳光的 如果是晚上，则是深层夜晚星空闪耀的背景如QQAPP登录界面设计。

　　用户体验方面的设计注意事项

　　1、把邮箱和手机号输入框合并成一个，可缩减用户的操作步骤。

　　2、用户名密码这些必填项在没有输入时，登录按钮为不可用状态，避免误操作带来的麻烦。

　　3、输入框中显示提示信息的方式进一步释放了画面空间，让整个画面看起来更加简洁。但是注意输入框、提示文字的颜色灰度要把握好，颜色太浅不容易查看。

　　4、画面中核心流程按钮突出显示，其它按钮则最小化显示，根据重要程度将颜色加以区别。

　　5、输入框的获得焦点时突出显示，以便在多个输入框时辨别焦点所处的位置。

　　6、错误提示直接显示在画面中，不以弹出对话框的形式或者toast的形式实现。消息提示框（toast）显示时间如果短的话用户可能会看不清楚。

APP登录界面设计（图片来自网络）

　　7、页面中的输入框、按钮等其他重要控件尽可能在弹出软键盘时显示在手机屏幕上半部分，方便用户切换、确认等操作。

　　8、注册/登录失败的情况，提示信息尽可能地详细，是账户名出错还是密码出错，或者是手机号已经被注册过了。

　　9、输入邮箱地址时，可弹出自动补全功能，自动加入常见的邮箱后缀。

　　10、发送验证邮件后，可给用户详细的说明及操作提示，也可以加入一个按钮直接跳转到相应的邮箱。

　　APP登录界面设计不可马虎，只有多学多试才能设计出令大家都满意的产品。更多的ui设计心得可长期关注faceui，若有其他的相关需求也可随时联系我们进行咨询了解哦。