解析电商网站注册界面设计超全面指南

2016-02-16 21:01 5 1 收藏

关注图老师设计创意栏目可以让大家能更好的了解电脑,知道有关于电脑的更多有趣教程,今天给大家分享解析电商网站注册界面设计超全面指南教程,希望对大家能有一点小小的帮助。

【 tulaoshi.com - 平面设计 】

辗转已到第三课,趁着双十一还木有剁手之前,赶紧来学一篇超赞的登录界面设计指南。想想有一天你满心欢喜买了一篮子东西,刚想豪爽地叫小二买单,小二让你先注册,顿时欢喜近无。这时候就该设计师出场咯,今天我们分享10个技巧,帮访客高兴注册。

AnyForWeb :电子商务网站已经慢慢成为现代都市人的必需品,大家都乐此不疲的使用着,但对于第一次注册使用的情景,相信大家还记忆犹新。精心挑选完商品之后,用户们怀着愉快的心情点击购买按钮,但显示的却是请先注册或登录,原本满满的购物欲和好心情有可能瞬间大打折扣。

电商网站需要注册和登录才能执行购买流程虽然受到很大一部分用户的不喜爱,但确实是非常普遍的现象。用户之所以如此反感,也不完全因为流程繁琐,网站的表现形式不够友好、人性化也是原因之一,甚至还有网站令用户很直接的感受到一种强迫性。

市场环境让几乎所有国内的电商网站都随大流的加上注册登录环节,那么,如何让这一步骤变得更友好更适用,这是我们需要思考的问题。现在,就列出10条我们的观点。

1. 简洁突出,大胆留白

挑剔是大多数网购人群的特性,这种挑剔不仅体现在他们对商品的态度,也蔓延到对网站的每个页面。用户不喜欢思考和寻找,他们希望所有自己需要的内容都清晰的摊在眼前,甚至眼前只有自己需要的内容。这样的要求听起来很苛刻,但只有把握类似这样的细节,才能在竞争激烈的电商市场中占有一席之地。

很多设计师对于留白都有些战战兢兢,生怕让别人误以为是自己偷懒了。其实,在电商登陆页的设计中,留白却是一种挽回用户好心情的好方法。登录注册在用户心里就是一个很麻烦的过程,而大量的留白能让用户感觉原来只有一个步骤而已,能很大程度的提升用户体验。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

苏宁易购的登陆页使用了大量的留白,页面整体和细节都十分干净整洁,让用户以最快的速度完成注册或登录这一环节。

一个精致有调性的注册界面,也能减少访客的抵触情绪,来优设搜99个+注册界面就可以看到咯。

2. 以访客利益为主导

访客利益为先的衡量标准说起来可能比较空洞,很多电商网站也因此忽略了这一点。电商网站的主要目的是尽可能的多推广、多销售自己的产品,于是有的网站就不放过任何一个可以推销自己产品的角落,这样的做法会让用户很厌烦,尤其在登陆页上出现诸如此类的推销信息。

登陆页是一个属于用户的网页,比较一下你的登陆页面,提到用户的次数和提到品牌产品的次数哪个更多?

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

麦网的登陆页是一个反面教材,网站过于急切的想把自己的商品展示给用户,所以页面上的内容看起来很杂乱,这有可能对营销会有一些帮助,但却造成了不佳的用户体验。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

亚马逊的登陆页就与之完全不同,不仅在引导上做的很到位,语句的撰写也更多的为客户考虑,我的邮箱地址是,这样的语言显得更有亲和力。

3. 好的标题是成功的一半

有统计显示,阅读标题的人是阅读正文的人的5倍,这意味着敲门砖的重要性。如果你的标题够吸引人,也许用户跟不用等到购买前才登陆注册,让用户心甘情愿的化被动为主动才是交互设计更深层的意义。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

嗨淘首页的登录入口标题就与普通电商网站的标题不太一样,hi的小标识让按钮更吸引用户点击。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/pmsj/)

点进登陆页后,嗨淘的标题依然与众不同,相比较普通的欢迎登录,还不是嗨淘网会员?这样的标题是不是更能让用户愉悦呢?

4. 简化页面副本,切中要害

刚才已经提到,用户根本没有心思在短短的几秒钟之内做任何思考,因此,这里又涉及到了页面副本的问题。如今什么都讲求要创新独特,但在登陆页上还是要尽量避免。登陆页面上的文案还是应该简单一点,用一些一看就能懂,而且没有歧义的文字。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

百度糯米的登陆页真正理解了简化副本的含义。页面文字的简化并不是文字越少越好,而是要用尽可能少的文字把意思表达清楚。左侧的图片上也没有多余的文字,色彩上也选择了淡色系,让整体看起来很舒服。

5. 有趣美观的页面设计

人不爱美,天诛地灭,视觉上美观的是事物总能给人更好的第一印象,对于网页设计也是一样的道理。从色彩到布局,登陆页设计要的是一种和谐,如果能在和谐舒适的体验基础上增添一些趣味性,用户会更乐于使用和点击。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

京东的登陆页就很有趣味性,左侧图片是略带搞笑的风格,也许能不少让用户会心一笑,带着好心情来登录和购物。

6. 必要时加入动画效果

虽然登陆页面讲求简洁,但不可否认动态的事物总能在第一时间抓住用户的眼球。当用户不愿阅读文字的时候,在网页中加入动画或小视频就是个提高转化率的另一个方法。但这样的做法如果把握不好界限反而会破坏整个页面的效果,甚至影响用户体验,所以还是要谨慎而行。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

在线客服的功能很多网站都有,但在登陆页出现的却不多见。在登录或注册的过程中,其实用户很容易遇到困难,在麦德龙的登陆页中就很贴心的设置了这一功能,并且实现动态效果,让用户在有需要的时候马上找到它。

7. 撰写充满号召力的文案

要用仅仅几个字的短句就抓住用户的心,文案的号召力是很重要的因素,尤其对新用户。这里所说的号召力也并非一定要用短句来实现,使用大动态字体的注册也能产生相应的效果,总之能让用户感受到你的活力和朝气,他们才会更愿意去做。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

充满号召力的文案一定要够简短够顺口,易迅网的就是这么拼虽然称不上多有创意,但着实能勾起用户的购物欲,让用户对登录注册更主动。

如何写有吸引力的好文案?超实用教程!《年度最佳教程!7招教你写出互联网顶尖文案!》

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

8. 尽量减少表单域

从视觉角度来说,表格状的形式不仅能把杂乱的数据清晰化,也能把原本简单的内容复杂化。有调查显示,电商网站登陆页上显示的表单域越少,转化率就越高,由此可见,用户对于填写表格并不感兴趣。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/pmsj/)

尤其对于首次使用的新用户来说,他们对网站的信任感还很薄弱,在这时让他们填写大量的表格式个人相关信息是很不恰当的,这对之后建立彼此之间的信任感也很不利。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

ebay的网站走的是极简路线。而表单形式在登陆页面中基本上避免不了,所以,ebay很聪明的只保留登录部分,有注册需要的用户可以点击右侧的按钮跳转到另一个页面。这是一个两全其美的做法,既让登录页面变得更简单,也让网站的条理更清晰。

9. 感谢页面社会化

与其想尽办法让广告在网站内无处不在,不如把握住感谢页面,效果可能也会好得多。当用户完成登录页的转化后,我们可以在页面上添加一些选项,比如为登陆页点个赞,又或是分享到社交网站上,这样能第一时间集中更多的客户群。

10. 使用单开式登陆页

无论从实际操作还是用户体验角度出发,单开式的登录页都是目前最理想的打开方式。如果选择弹框或者直接本页登录,会很明显的不利于用户的使用,Lancome的网站就是一个例子;另外,有些浏览器会有屏蔽弹框的功能。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

单开式的登陆页设计能更好的引导用户,同时产生一种被重视的感觉,这对于电商网站尤为重要。

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

解析电商网站注册界面设计超全面指南,PS教程,图老师教程网

一号店的登陆页是同类网站中做的很周到的,在首页的登录入口位置做了一个鼠标悬停显示的效果,这样可以避免用户因为误点而造成的不必要的点击。

总结:

我们认为,在电子商务网站的登录环节暂时还无法割舍的现在,页面的设计要以用户体验为先,让用户在使用的时候尽可能的减少思考时间。同时,我们也希望在未来可以让注册登录成为不必要的环节,让用户可以以游客身份直接购买,登录注册的好处只是让购物流程变得更容易或者价格更优惠,以这样的方式让用户主动注册,让登录注册变成一个用户喜欢的环节。

来源:https://www.tulaoshi.com/n/20160216/1574297.html

延伸阅读
颜色对于网站设计来说十分重要,那些使用多种颜色的炫彩网站大多都能给人很强的印象,而颜色过多也有缺点,就是很容易产生杂乱感,当然对是有经验的网页设计师可以很好的避免这一点,比如下面这些网站就都是用了炫彩的颜色,而没有给人不良的视觉感受。 Calypso Park Pixele Peminoz Colour Pixel Mbdizajn Life Lab ...
白色是所有网站中使用最多的一种颜色,本文中主要收录的是一些主要靠白色、灰色来打造出高雅简约等风格的网站界面。这类网站看给人感觉很简单,但实际设计中想要把握颜色使用分寸时,很卡宴设计师的水平。从布局,插图选用等都会影响到网站最后的效果。 我们可以看出其中许多网站都用了一些鲜艳的色彩与插图,不过整体效果却依然节约典雅,设...
最近一直想写个案例关于电商网站设计,从国内的电商网站中寻求素材,始终没有想要的,不得已收集了国外电商网站的一些设计元素,笔者个人认为,那是追随时尚的设计元素,当然这篇文章也是既《国外常见电商黄金首页设计模式》之后的有一篇关于国外电商网站设计的文章。 并不是笔者不看好国内电商网站的设计,只是国外电商网站从网页设计,宽假...
也许你是老板,要评估自己的新网站设计情况,或者你是项目经理,要查看你的设计师制作的网站模型。你该在网站界面设计中发现什么呢?谁都会无关痛痒地说这个看起来不错或者这个好像不怎么好用,但是怎么才能给出有意义的反馈呢? 我们经常需要叫非职业设计师来评判界面设计的好坏。也许你是老板,要评估自己的新网站设计情况,或者你是项目经理...

经验教程

820

收藏

36
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部