1.1 了解电商UI设计

当消费者浏览一个电商平台时，留下的第一印象不是缤纷的商品、超低的价格，而是整个电商UI的设计风格。因此在不计其数的电商平台中，要让自己的平台出类拔萃，就需要拥有出色的电商UI设计。

1.1.1 什么是电子商务

电子商务可以利用计算机技术、网络技术和远程通信技术，实现电子化、数字化、网络化、商务化的商务活动。电子商务是以商务活动为主体、以计算机网络为基础、以电子化方式为手段，在法律允许的范围内进行的商务交易过程。电子商务中传统商业活动各环节的电子化、网络化，其最典型、最常见的代表是淘宝网、京东商城，如图1-1所示。

简单地说，电子商务就是依赖于互联网产生的一种线上和线下交易的商业活动。目前主流的电商模式主要有B2B、C2C、B2C、O2O、P2P等。

1.B2B

B2B（Business To Business）是指连接代理商、生产商、零售商之间的线上、线下交易的商业模式，如阿里巴巴采用的就是B2B模式。

2.C2C

C2C（Customer To Customer）是指个人对个人的网上交易模式，如淘宝网采用的就是C2C模式。

3.B2C

B2C（Business To Customer）是指商家对个人消费者的网上交易模式，如天猫、京东、苏宁等采用的都是B2C模式。

4.O2O

O2O（Online To Offline）是指在线上下单支付、在线下消费的商业模式，如京东到家、饿了么、美团等采用的都是O2O模式。它跟团购模式是不同的，因为团购是限时间段的促销，并且支付情况由团购平台说了算，商家是不知情的，所有消费者的信息资料都掌握在平台那里，商家跟消费者之间在线上没有任何交流。

5.P2P

P2P又称为互联网金融，是一种需要借助电子商务平台帮助借贷双方确立借贷关系并完成相关交互手续的小额借贷交易模式。

1.1.2 电商UI设计属于什么范畴

电商UI设计是传统平面设计和网页设计的结合体，是互联网时代的产物，所以，电商UI设计属于UI设计的一个分支。

UI（User Interface，用户界面）设计是对人、人与界面、界面这3个方面进行研究的整体设计。好的UI设计不仅可以让界面变得有个性、有品位，还可以使用户的操作更舒服、简单、自由，并且充分体现商品的定位和特点。

以前我们可以看到各种超市的促销海报，在海报中可以看到各种商品的折扣信息，但是要买东西还是需要去实体店。电商UI设计的任务是直接在网上将商品信息展示在网页或手机App中，用户可以在线浏览商品信息并购买商品，这个过程涉及人与界面之间的交流互动。图1-2所示为传统超市促销海报与电商促销专题页面的设计对比。

电商UI设计可以让电商UI更有附加值，更具有信任感，因为消费者只能通过电商UI中的文字和图片了解商品，所以设计出色的电商UI能够增加消费者的信任感，是提高商品附加值和电商平台浏览量的重要手段，对电商品牌的树立起着重要作用。图1-3所示为设计出色的电商UI。

1.1.3 电商UI设计的重要性

作为视觉动物，人的第一印象对其认知会产生相当大的影响。同样，逛街购物也是如此，设计出色且独具特色的电商UI可以使人们的购物心情更舒畅，从而增强其购买欲。如果电商UI设计毫无特点，商品排放毫无秩序，消费者的购买欲也会大打折扣。

无论是电商网站还是电商App，都需要将UI设计得更加精美、个性，这样才能吸引消费者。图1-4所示为设计精美的电商促销界面。电商UI设计对商品销售的重要性主要表现在如下几个方面。

1.给人信任感

在网上购买商品，消费者都是通过电商UI获取商品相关信息的，所以更需要在美观上下功夫，特别是新的电商品牌或新开的网店，需要对界面进行精心的设计，从而吸引并留住消费者，而且精心设计的界面能够给人一种信任感。

2.有助于提升形象

商品固然重要，但也绝对不能忽视界面的设计。电商UI设计与实体店的装修一样，能够让消费者在视觉和心理上感受到店铺的用心，并且能够最大限度地提升电商品牌形象，有利于电商品牌的形成，从而提高浏览量。

3.提升购买概率

很多新开的店铺并不注重电商UI设计，界面中的商品分类混乱，商品描述也是简单的图片和文字，并且图片和文字没有经过艺术处理，这样的界面会给人很糟糕的购物体验。经过精心设计的电商UI能够给消费者留下深刻的印象，从而大幅提高消费者的购买概率。

4.增加消费者的停留时间

出色的电商UI设计会增加消费者的停留时间。美观、合适的电商UI设计，可以给消费者带来美感，使消费者在浏览界面时不疲劳，自然会更细心地浏览界面中的商品。好的商品在诱人的修饰衬托下，更容易被消费者接受，有利于促成商品销售。

1.1.4 电商的发展趋势

随着科技的发展、互联网和智能手机的普及，人们的生活习惯发生了很大变化，人们的日常生活越来越离不开手机。因此电商UI设计需要做出相应的改变，如在设计风格、界面尺寸等方面符合用户的使用习惯。

在进行电商UI设计时，需要根据其针对的设备采用不同的设计风格和表现形式。例如，在PC端的电商UI中需要设计一个商品列表，惯性思维都会在列表结束位置放置一个“查看更多”按钮，用户单击这个按钮可以查看更多商品，而在移动端的UI设计中可以省去这个按钮，因为用户习惯在移动界面中通过上下滑动或左右滑动界面来查看更多内容，所以需要在滑动界面的过程中加载更多商品信息。图1-5所示为移动端电商UI设计。

提示

据统计，目前电商平台中有80%～90%的订单是由移动端贡献的，甚至很多小电商平台已经放弃PC端，将精力集中在移动端平台上。也就是说，移动端才是电商未来的发展趋势。

1.1.5 电商设计师的要求

大型电商平台的设计师分工比较明确，往往只需熟练掌握Photoshop、Illustrator、CorelDRAW等设计软件的使用方法，主要专注于电商UI的视觉设计和创意，并不强制要求会切图和制作网页。对于店铺类的电商设计师，可能不仅需要会使用Photoshop、Illustrator、CorelDRAW等设计软件，还需要掌握网页制作的相关知识，往往既要实现界面的视觉设计，还需要进行切图，并且使用Dreamweaver将其制作成网页。此外，绘画对于电商设计师来说是非常加分的一项技能，虽然并不是必须要掌握的。

电商设计师除了需要掌握必备的软件技能，还需要掌握相关的设计理论知识，如色彩构成、平面构成、立体构成、文案创意、市场营销、用户体验等。商业设计需要在确定其活动目的的基础上进行合适的设计，要面对需求、面对消费者，所以会涉及以上知识点，其他方面还包括沟通能力、理解能力、生活阅历、人际关系等。