详解原型设计登录交互细节

几乎每一个APP都需要用户登录注册，这是一个产品的基础功能。这样一个简单的基础功能，也会随着用户使用场景和产品的特性变化。下面小编为大家带来登录页面原型设计的一些细节。

1、 输入框：手机号码输入框，手机号码显示一般是344格式，这样便于用户检查号码是否正确，如188 8888 8888；对输入手机号的判断，首数字必须以1 开头，非1字符及提示错误，第二位数字必须在3到9之间（包括3到9），不在范围即提示错误等等验证码输入框，长度一般比较短；密码输入框，默认一般为密文显示，为了更好的交互可以设置明文显示按钮，最好只设置一次密码。

2、 按钮：按钮设计，提交按钮和文字按钮的位置和主次布局设计；按钮状态的设计，不同的状态操作都要考虑，默认置灰和高亮的条件；按钮提交反馈，点击操作要给出响应或反馈。

3、 验证码：验证码的格式，字母、数字、字符等，一般为数字4位或者6位；验证码的有效时间，根据不同的产品设计不同的有效时间，在有效时间内的验证码操作需要给出明确的反馈；验证码的获取次数上限，技术限制和产品设计限制同步，避免被无限制获取；验证码获取时间，一般为第三方发送，但时间最好限定在5秒内让用户获取到。

4、 返回按钮：在注册、找回密码、第三方登录等操作流程中，返回时需要特别注意点击返回后的操作提示；比如注册手机的修改，验证码提交后设置密码等。点击返回时，干扰了正常流程的操作一般需要强提示，提示弹窗注意文案和按钮文字设计。

由千语创想团队倾情打造的一站式在线设计平台——千语创想（https://www.qianyuthink.com/?url=），帮助您一站式完成编千语创想所有设计工作，需求梳理+原型设计+ui设计一个人统统搞定。必须要强调：千语创想免费使用，是互联网产品人提升工作效率的神器，海量需求模板库覆盖各个行业，一键生成产品需求导图，可根据需求在线编辑；需求导图一键生成产品原型，再也不用为设计原型图而苦恼；在线ui设计，支持Sketch导入，一键切图和标注。千语创想可提升30%-60%项目开发效率，快去免费体验吧。