开发者社区> 爱原型设计> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

年度十佳电商网站设计赏析

简介: 伴随着近年来电子商务的迅猛发展,世界范围内的线上购物持续增加。以刚过去的黑色星期五为例,用户通过网络渠道购买商品的销售额达到了50.3亿美元,相较于2016年同期增长了16.9%,创下了美国电商历史的新纪录。
+关注继续查看
img_6110a67178a6cf14b7a36e0ad0e227df.jpe

伴随着近年来电子商务的迅猛发展,世界范围内的线上购物持续增加。以刚过去的黑色星期五为例,用户通过网络渠道购买商品的销售额达到了50.3亿美元,相较于2016年同期增长了16.9%,创下了美国电商历史的新纪录。在电商及网购快速发展的当今,走心的视觉设计已是应对不断增长的用户需求的必需品,也是构成用户感知产品、选择平台的核心因素。空泛的描述总会让人不知所措,不如从下面10个年度最佳电商网站中寻找设计灵感和答案吧。

1. Carolina Herrera

类型:时尚服饰类

网址:https://www.carolinaherrera.com/


img_76a1428b15574cefe20e25fc2c316fa1.png
img_3551d3d68862e6dd1930d5366729ab6c.png

相比于传统的顶部多级导航栏,侧边栏会让页面显得更加整齐易用。Carolina Herrera 的侧边栏设计则更有意思,它采用的是多级侧边栏,功能上不弱于顶部导航栏,并且提升了浏览体验,视觉上的效果也更加突出。

2. X-Doria

类型:手机App类

网址:https://xdorialife.com/


img_e7922e355b1613c291a99bf4d47420ac.png

导航、搜索、筛选是方便用户寻找想要内容的重要手段,也是用户获取有用信息的必要途径。X-Doria的网站不仅提供了常用的搜索功能,而且提供了相应的筛选功能,让用户很快定位并获取想要的东西。

3. 8 Faces

类型:阅读书籍类

网址:http://www.8faces.com/


img_e6d92281330b0d4f62b9d00e527bf549.png

8 faces 巧妙使用了一款较叫 jQuery Kinetic的插件,主页上大幅图片非常吸引人。高清细腻的产品图和绚丽的背景用色,让产品和网站都显得个性十足,视觉优先式的布局让产品看起来诱人无比。

4. Ada Blackjack

类型:皮革制品类

网址:https://www.adablackjackgoods.com/


img_f7246e9e5be66d492e9b3870a6c61b38.png

从主页图片中你能猜出这个网站是做什么的吗?答案是——销售皮革制品。Ada Blackjack是一个制作手工包包以及皮制品的品牌,在设计方面使用复古大幅照片,显得简洁大方。

5. Bellroy

类型:皮革制品类

网址:https://bellroy.com/


img_dc74644a91b4d97ee9a55ad43a3b41f2.png

这个网站的设计主要遵循传统,使用了插图,布局相对简单 。深入观察后,你会发现它的单个商品展示多种多样 。通过将传统插画和有趣的展示视频相结合,让人眼前一亮。网站的顶部使用了单独设计的英文字体,这些微妙的字体设计会让网站看起来更加优雅有品味,也足够个性化。

6. Luhse Tea

类型:茶具饮品类

网址:https://www.luhsetea.com


img_ef7214e30d4cf9f0a17492ac722ac19e.jpe

在这个网站主页上,最出彩的可能就是导航栏中一排抽象茶具的显示。第一次看到这个主页时,你可能觉得这是一个漫画书网站,但事实上这是一个跟茶有关的网站。这是一种非常聪明的吸引用户注意力和挽留顾客的方式。

7. ETQ Amsterdam

类型:品牌鞋类

网址:https://www.etq-amsterdam.com/


img_08b8bdd64bb7e1a1b285f10d5144bc35.png

ETQ Amsterdam 是著名的鞋类品牌,优雅、永恒和品质是这个品牌的三大核心价值,而他们的网站也同样采用了这样的设计理念。整个网站的设计充满了现代式的简约美,简洁的排版,清爽的配色方案,大量的图像和微妙的动画共同营造出少即是多的美感。

8. Best Made Company

类型:生活用品类

网址:https://www.bestmadeco.com/


img_95c5a69a383bb4260fa8722991f9a7fd.png

这个网站界面设计的非常简洁,布满漂亮的商品,这些东西非常新奇,最值得学习的是页面最上方设计了创新型导航,简洁,易于识别和使用。

9. Good as Gold

类型:时尚百货类

网址:https://www.goodasgold.co.nz/


img_43d0bd28efe060712dc9a5cb16e7623a.png

Good as Gold这个网站使用了大幅图片作为主页,是一个时尚百货商店。将产品名称和重要的信息制作成为漂亮的超大字体置于网站首页上,这种充满冲击力的字体设计在移动端上看起来尤其明显。

10. Shwood

类型:时尚配饰类

网址:https://shwoodshop.com/


img_ed673dafc07382be2eedf7a46ecf12b7.png

这是一个使用视频作为展示方式的电子商务网站,全响应式设计加上视频的应用使用户能够对产品有更多的了解,同时绚丽的照片也为商品增色不少。毫无疑问,令人愉悦的交互能让用户驻足更久。

结语

其实不同的服务及商品会有不尽相同的网站设计风格,如何把握用户购物心理及行为从而最终实现有效转换,永远是一门值得深究的学问。如果你还在为如何更好地实现更清晰的导航设计、更直观的用户交互体验发愁,那推荐使用国民原型设计工具-Mockplus-一款设计师及产品经理从入门到精通的必备工具。不仅功能简单够用,而且丰富实用的模板例子让你的设计如虎添翼,包括:

购物类App原型制作分享-Lyst

电商类Web原型制作分享-Globalsources

购物类App原型制作分享-Farfetch

电商类Web原型制作分享-Shopify

工具类App原型制作分享-Chartistic

即刻下载,终身受用!

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
[转]AI创业公司收购竞赛:苹果领跑,谷歌第二|全球快讯
长期以来,AI一直是各行业科技领导者的一个关注焦点。从零售到农业,各个领域里的大企业都在努力将机器学习整合到他们的产品中。但是与此同时,AI人才却严重短缺。 这种供不应求的状况导致了对顶级AI创业公司的激烈争夺,其中许多创业公司还处于早期研发和融资阶段。
334 0
利刃 MVVMLight 2:Model、View、ViewModel结构以及全局视图模型注入器的说明
原文:利刃 MVVMLight 2:Model、View、ViewModel结构以及全局视图模型注入器的说明      上一篇我们已经介绍了如何使用NuGet把MVVMLight应用到我们的WPF项目中。
827 0
多语言版本网站建设数据库设计和考虑的因素
由于现在网站上动态应用日益增多,相当多的网站还会使用文件或者数据库来存储应用信息,因此如果文件或者数据库中存储的内容与语言相关时,还需要特别注意。对于存储在数据库中信息,可以采取以下几种方式支持多语言:   1,在数据库级别支持多语言:为每种语言建立独立的数据库,不同语言的用户操作不同的数据库。
1114 0
神奇的滚动动画,30个视差滚动网站设计
  使用 HTML5 和 CSS3,我们能够在浏览器中创建更有趣和更吸引眼球的效果。其中,视差滚动(Parallax Scrolling)就是这样的效果之一。这种技术通过在网页向下滚动的时候,控制背景的移动速度比前景的移动速度慢来创建出令人惊叹的3D效果。
941 0
3Animation动画的创建,CCSpeed,CCFollow
 动画,不同于动作,动画并非属性的改变。而是对帧的播放。 2 方法一 CCSprite * sp = CCSprite::create(“animation/p_2_01.png”); sp->setPosition(ccp(240,160)); //注意:这里的CCRectMake中的参数都是相对自己来
827 0
经典网页设计:25个应用视差滚动的单页网站
  有许多有趣的网站类型,其中之一是视差技术,也被称为视差滚动(Parallax Scrolling)。在网页设计中,视差滚动是当下流行的网页设计技术,通过让多层背景以不同的速度或者不同的方向移动形成 3D 运动效果,有很强的视觉冲击力。
1068 0
经典网页设计:12个优秀的电子商务网站设计案例
  现在越来越多的人喜欢在网上购物,像美容护肤,数码,电器,品牌服饰,家居生活,健康保健等各种生活用品都可以轻松网购。对于电子商务网站来说,让用户在购物过程中简单快捷是最重要的,其次是要有精美的页面设计以及产品图片吸引更多客户去购买商品。
946 0
经典网页设计:30个独具匠心的单页网站设计案例
  经典网页设计系列继续给大家带来精彩文章,这篇文章向分享30个优秀的单页网站设计案例。如果网站的内容不是很多而且将来也不怎么增加的话,那么制作成单页网站的形式是一种很好的选择。这种只有一个页面的网站形式曾经非常流行,现在依然有很多人喜欢。
950 0
10个别出心裁的企业网站设计优秀作品
  如今,网站是企业的标配,担当着企业宣传、产品推销、收集客户反馈等众多功能。为了能够把网站设计得与众不同,设计师们也是绞尽脑汁。为了给网页设计师朋友提供更多的灵感,今天这篇文章与大家分享30佳别出心裁的企业网站设计作品,希望网页设计师朋友们看了后能有所收获。
861 0
25个国外优秀电子商务网站设计案例
优秀网站设计案例   分享35个非常漂亮的单页网站设计案例 25个国外优秀的餐饮网站设计案例欣赏 最新30个漂亮的个人作品集网页设计案例 30个非常优秀的网站导航菜单设计案例 12个优秀的 HTML5 网站设计案例欣赏     这篇文章与大家分享25个国外优秀的电子商务网站设计案例,希望能带给你灵感。
1429 0
+关注
爱原型设计
一名PM,分享个人与设计(UI/UX等)相关的经验与教程。
95
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载