经过几年的发展，电子商务逐渐成熟，并形成了自己的模式和风格。但是对于电商的设计风格，大部分人还是停留在以货堆砌+文字信息+各种乱七八糟的初期效果。这两年各电商都非常重视设计，设计风格也逐渐走向简约甚至极简。这种变化是随着电子商务的不断发展而演变的，更加注重产品的质量。

下面从三个方面来说说如何做极简设计，每个方面都有一些具体的知识点。

我们来看看极简设计的案例:

这是锤子T1的页面设计。虽然很多人不喜欢老罗，但我觉得他对设计有一种完美主义的偏执。我觉得作为一个设计师，应该多向他学习。回到页面设计本身，我们来分析一下这个页面的设计。

一、极限布局
可能大家开始画画的时候都会接触学习构图，构图是布局设计的基础。然而，我们往往忽略了对构图和布局的终极追求。一般我们总说看着差不多舒服，但为了设计师能力的提升，需要更多的关注版面设计。

以下是一些布局设计技巧:

1.对齐——最基本也是最重要的

上图A、B、C是页面的重新布局，图D是原设计。虽然整体看起来还可以，但是我们还是可以直观的看到图A的构图有些头重脚轻，让人感觉中心更低；图B中的手机主体有一种挤压文案的感觉，让人感觉压抑；图C中手机和文案成90°角，让人感觉有阻碍感，不流畅；D图的设计很好的协调了主体图形与副本的关系，在由远及近的中间距离给人以深度感。整个画面的中间对齐可以最大程度的突出主体——手机。从锤子的网页设计中，我们可以观察到这种布局是中间对齐的，无论是水平还是垂直。

看几个中间对齐的例子:

上面的设计师也使用了中间对齐的方法。大写的V视觉冲击力很强，而左上角的Logo信息和右下角的信息变成了对角线形式，让人感觉画面非常平衡稳定。

小米2015年新品发布会的海报也在中间对齐，便于观众在中间关注“新年礼物”的重要信息。

以下插图为左右排版方法:

由此，我们总结了对齐布局的几个特点和功能:

一、视觉聚焦；
B .加强页面的统一性和组织性；
C，愿景的导向作用。

2.对比——让画面不再平凡

作为一种简单甚至极简的设计，对比非常重要，可以让人非常快速的阅读重要信息，也可以让版面设计有节奏感，让画面看起来不枯燥。

以上设计是小牛N1和一加三，典型的左右排版。右边是商品图片，左边是简单有用的基本文案信息。左右图大小和复制信息的对比要根据商品的属性来确定。比如一加手机，主要是体现手机的外观和质感，所以面积较大的两部手机都放置了最基本的复制信息(只有手机的名称、价格和购买按钮)。

上图是文案和商品的面积对比。

这种设计与一加和小牛相反，复印面积大，但我们的视觉中心还是手表，因为实物照片往往更吸引人，这就是反差。但是还有一个不知道大家能不能看出来的对比，就是文案中的对比，标题是大而粗的字体，而其他信息则是少量放进去的，这样就可以快速准确的看清楚标题的内容。另外，因为字体大小和粗细的变化，让人感觉有节奏。

3.有一个“气质”的空白

极简主义设计中的留白是很重要的，最典型的是MUJI设计，是把留白运用到当下设计的最好例子，但我觉得我们中国人才是留白的“祖先”，中国画就是一个很典型的例子。

下面我们来做个对比。我们从图片中删除了一些不必要的复杂背景和文案。主要目的是让产品主体和主要信息展示的更清晰、更明确。

做进一步的精简，增加空白空间，让产品和产品信息传达的更清晰。

以下是其他一些案例。我们可以试着自己分析一下，注意空格不一定是白的。

二、精致的色彩
在电子商务设计中，色彩控制非常重要。在某些情况下，颜色控制的质量直接影响页面的停留时间。一些没有经验的设计师常常在把握色彩上头疼。颜色脏，配色差，颜色使用过度是常见问题。在极简设计中，需要减去色彩，不断调整微妙的明度、饱和度和色彩的搭配。正是这些细节的调整，才会让极简设计更具吸引力。

2.1快速制作设计“色彩”的方法
在极简主义的页面中，色彩的使用往往非常谨慎，我们首先需要选择主色。

有几种选择颜色的方法:

一、黑、白、灰主色+亮色辅色

通过提取的颜色，我们可以看到在上面的页面设计中，黑色、白色和灰色是主要颜色，亮黄色是辅助颜色。虽然明黄色是辅助色，但人们往往第一眼就注意到明黄色，设计师选择明黄色作为折扣信息七折的字体颜色，也是强调折扣信息。

耐克和小牛电动车的页面设计的色彩选择都采用了这种方法，小牛在背景中使用了一些素黑、白色、灰色的图形元素，既丰富了画面，又不会让太多的色彩显得凌乱。

b、选择商品主色作为整个画面的主色

上图是Motox的网页设计。页面主色(背景色)采用手机后壳的颜色，可以突出产品颜色，给买家留下深刻印象。

耐克的设计也采用了这种方法。一般来说，厂家要退爆的时候都会为爆选一个颜色或者配色。耐克设计的页面也更好地展示了这款产品的独特之处，让人们在任何地方看到这种颜色都会想起耐克的鞋子。

C.不要使用超过3种颜色

通过以上案例，我们发现这些设计师不能使用三种以上的颜色，但作为极简设计，他们有时只用两种颜色，甚至只用黑、白、灰的变化来设计。

2.2看似复杂的配色其实很简单
在极简设计中，配色是需要非常用心的，因为当画面的配色简单的时候，即使稍微不协调也会放大很多，所以需要了解色彩的几个属性:色相、饱和度、明度，以及对比色、相似色等概念。

极简设计中还有几种配色方法:

a、统一亮度和饱和度；

下图的明度和饱和度非常协调，颜色既不太亮也不太暗。虽然是不同的颜色，但整个画面也很和谐统一。现在来分析一下图片的颜色。

我们来看看。上面四个圆圈中的颜色是从图片中提取出来的，下面四个图片是颜色的位置和参数。我们主要看颜色的位置，也就是每张图片中圆圈的位置。我们可以看到图中有两行，是这四种颜色的明度。我们可以看到绿色和橙色的明度位置非常相似，黄色和深蓝色的明度位置也非常相似。绿色和橙色占据了整个画面的广阔区域，所以整个画面看起来非常相似。饱和度越高，越接近调色板的右上角。我们可以看到，除了深蓝色，其他三种颜色都处于较高的饱和度位置，彼此接近。

你可以尝试这两种设计，自己解构配色的亮度和饱和度。而且我觉得设计师认真理解色彩是非常必要的。

b、控制色彩层次；

所谓的色阶还是用小牛电动车的地图来分析，把所有的颜色都提取出来之后就可以看到圆圈里的颜色了。

这样，我们就可以很容易地看到色彩层次。灰色系统有7级，红色系统有4级。也正是因为这个层次，整个设计非常丰富，有立体感，不至于太“平”。

三、精致字体
文字在电子商务设计中的地位极其重要，它承载着直观的信息传播的目的，比如活动页面上的折扣信息、产品推广页面上的卖点信息、产品的优惠价格、文案内容的性能等。极简设计中，字体的选择比较讲究。

1.选择符合整体设计风格的字体

字体也有自己的外观，性格，风格。当字体的风格与设计完美结合时，会给整个设计增加很多。

以上两张图是《值得买什么》的闪屏页面。让我们仔细观察一下眼镜、相机和字体的关系。眼镜和相机的款式都很复古，有民国的感觉。所以设计师选择了仿古字体搭配图案，给人非常统一的感觉，加上绝妙的临摹，会给人一种民国的景象，也可以称之为带入感。如果把图中的字体改成很现代的艺术字呢？

改变字体后，我们可以看到，虽然每种字体本身看起来都很好，但与图片放在一起感觉非常糟糕，立即失去了文案和图片想要传达的“匠人”感。

英语的选择也是一样。看上图，英文动物版画的意思是动物图案。你会发现右边的女性身材应该是穿着裙子的，所以我猜这是一个卖女装的Banner，属于比较成熟的那种(从模特的身材就能看出来)。所以在选择字体的时候，要选择精致柔和的字体，而不是黑色加粗的字体。

我们来看看下图。是不是感觉差很多？

我们来看几组图片，试着自己分析一下。

2.选择字体结构简单的字体

这几年出现了一些结构复杂，字形极度夸张的字体，我觉得应该尽量少用或者不用。字体是一个很专业的范畴，很多设计师对一些字体控制不好。无论是普通的电商设计还是极简设计，最好使用形状结构相对简单的字体。

这个设计可以看出，整个设计主要是由人物组成的。英语和汉语都使用字形非常简单的字体。另外字体的大小和粗细让画面很有节奏感，不会感觉到所有的字符。由此，我们可以得出另一种理论。在某些情况下，字体不仅是信息传递的载体，也是一种艺术形象。

这里有一本反面教材:

这里先不说这个特别设计的构图和色彩，只说文字。除了9.9元明显突出卖点，其他基本字都很乱，字体变得认不出来了。所以，提醒大家在无法掌握字体的情况下，不要自行修改甚至设计字体。

让我们看看现在竞相模仿的苹果:

苹果是“牛”，为自己的产品设计了一套字体。一开始有人说各种丑，但因为简单易用，被大多数人接受和称赞。这是快速发展的社会最需要的，尤其是电子商务行业。

自带6种粗细字体，满足一般需求

3.“牛”的中文字体

这里说的中文字体“伟大”，不仅仅是因为我是中国人，还因为我们可以数清中国有多少种字体，每种字体都有自己的历史背景，比如隶书，平民不能用，魏碑就是专门刻在碑上的字体。此外，汉语也是唯一一种已经成为艺术的语言——书法。可能有人会觉得中文字体或者书法字体看起来很旧，不现代。让我们用例子来证明这是错误的。

以上页面是真实的功夫设计。很明显，中国书法字体是作为一个艺术形象来传达和表达的，并结合了一些相关的元素(辣椒、调料、蔬菜、粮食等)。)突出“味道”这个主题，很容易看出是美食一页。

英文也可以设计成书法风格，比较紧张，更符合勇士的感觉。

小米电饭煲的“新国货”也采用了书法字体，让平淡的页面活了起来，这种字体也透露出了制造新国货的“野心”。

总结
其实极简设计是设计发展的必然结果，是一个优化的过程，就是做减法，删除不必要的干扰信息传递的元素，保留最基本最有用的东西。我的教程还具体从排版、颜色、字体三个方面讲解了如何做极简设计，这些也适用于一般电子商务的设计。归根结底，好的设计的基本原则是不会变的。

汇总目录

1.终极布局

1.1对位——最基本但最重要的
1.2对比——让画面不再平凡
1.3“气质”留白

2.精致的颜色

2.1让设计快速“上色”的方法

a、黑、白、灰主色+亮色辅助色
B、选择商品主色作为全图主色
C、不要使用3色以上

2.2看似复杂的配色其实很简单

一、统一亮度和饱和度
B、控制色阶

3.精致的字体

3.1选用符合整体设计风格的字体
3.2选用字形结构简单的字体
3.3“牛叉”的中文字体