关于优秀页面设计的10个小技巧 页面设计怎么描述

登录页面设计是网站用户体验流程的关键部分 。好的设计有助于推动访问者访问你的网站,并把新用户进行转化 。它也给返回用户一个简单的方式登录到您的网站 。
以下案例中我们将提供:当你设计你的登录界面的时候,你应该做什么和不应该做什么 。不是所有的提示和例子都适用于你的产品 。关键是选择最适合你的 。

关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
技巧1:更明显你不应该让你的用户到处寻找登录区域 。他们找的时间越长,就会越沮丧 。他们越沮丧,最终登录的可能性就越小 。
一个很好的例子就是Gmail的登录页面 。
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
你可以确切地知道你需要在何处登录,以及要在输入区域输入什么内容,上面的例子,如果你没有Gmail帐户,它允许你通过单击“创建帐户”来轻松地创建一个帐户 。
好的用户体验是使你的登录区域明显,使你的用户尽可能容易地进行登录操作 。
技巧2:使用第三方登录第三方登录正迅速成为用户登录账户的方式,理由很充分 。为不同的产品创建多个账户既耗时又令人困惑 。很难记住一堆不同的密码和用户名 。
通过允许用户使用用户的第三方账户中的信息来创建一个账户,可以解决所有关于这些问题 。
让我们来看看下面的石墨文档和MONO登录时的选择方式:
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
甚至还有更方便的注册登录方式,手机短信验证码在注册的同时登录:
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
一些产品在用户点击第三方注册登录时还需要用手机号进行短信登录,从用户的角度看,这很明显是一个不好的体验,但是产品的角度去思考就不一样了,产品为了获取用户更多的信息,则需要这样来设计流程 。
这种设计流程该不该用,这需要在产品和用户之间进行权衡,第三方与手机短信验证码登录,在提高用户体验的同时,可以提高用户的效率,使界面更加直观 。
技巧3:更简单因为环境不同,在中国很多网页端的网站,第三方登录很高效的产品很少 。
例如,如果你的QQ没有在电脑端登录,因为即使选择第三方QQ登录,你也要拿出手机—打开QQ—打开扫一扫,进行扫码登录等一些列的操作 。
又或者,当你想要登录behance,只要浏览器有记录之前的第三登录,点击第三方登录即可直接进入该网站,甚至不用注册 。
可以看下面的腾讯网与behance的网页登录:
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
好的登录体验应该只有账号、密码两个输入字段,或者手机号码、短信验证码两个字段,以及使用第三方登录的选项 。在简单、高效的同时,并为用户提供了很好的体验 。
技巧4:区分注册与登录如果一个用户来到你的网站进行注册,或者想他们返回登录界面,这就需要让用户清楚的知道他在何处,下一步应该去哪里 。
我们通过使用登录字段与注册字段的区别来帮助他们,让我们看看下面的dribbble注册界面:
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
关于优秀页面设计的10个小技巧 页面设计怎么描述

文章插图
创建账户的按钮已dribbble的主题能很快突出在用户面前 。新用户可以直接在页面上注册,而返回的用户可以使用最上面右上角的登录两字 。看到上面“sign in ”字段了吗?
dribbble使用了不同的颜色、布局去区分注册按钮与登录的入口,这样更加清晰明了 。
同时可以看看dribbble的主页面,他们会把sign in 与 sign up 的进行区分,在 sign up 加上微边框,让用户能更快区分两者的不同 。
技巧5:跳过用户名让用户用他们的用户名来进行登录真的不是一和很明智的做法,为用户省去记录你产品的用户名的麻烦,应该让他们使用他们的电子邮件地址或电话号码注册来进行代替用户名 。

推荐阅读