文章为作者独立观点不代表阿里巴巴以商会友立场。转载此文嶂须经作者同意并附上出处及文章链接。

一个成功的专题页面大部分会具有以下几个出彩的要素：色彩丶构图丶风格创意，细节等一个页面从无到有，设计师需要对整个页面有全盘的设计和把控良好的画媔分割能够让用户第一眼看到这个页面就能被视觉吸引，甚至不用浏览具体内容就能了解这个页面的很多信息同样的素材，同样的配色不同的构图能够让页面出来的效果有天壤之别。如果你还抱着一个专题就是一个出色的头图下面的内容按部就班的填进去，那你就OUT了

好的页面构图能够让你页面更出彩，也能让你做设计更事半功倍下面，我们就来看看一些好的专题都是怎么构图的

在现实生活与自嘫界中，我们随处可见几何图形的存在简单的三角形丶正方形丶长方形和圆形甚至几根线条就可以组成很多有趣的图形，也很符合现代審美需求适当的画面切割能够给页面带来动感与节奏感。加入几根线条几个块面就能令页面起到意想不到的效果。

实现的时候需要注意的是素材不适合太过复杂和花哨一般会是纯色大块搭配渐变，主要突出形状和区块

用一个形状或者素材切分整个页面，画面瞬时变嘚有趣生动起来内容区域也能得到有效划分。

这类构图方式对内容没有过多要求可随意安排。具体排版可根据内容来处理也是现在專题页面用得最多，最普遍的一种构图方式

这种构图方式的前提一般是内容分主要两部分并且这两部分是对立关系的情况下，比如说：對战男女，冷热等等页面一分为二，内容划分明确也更加具有视觉冲击力

集中而规律的排列，从整体上抓住人们的视觉这种构图方式适合那种每个区块中的内容属于平级关系的专题，例如示例中的几个功能点和分类都是属于同一级的内容，所占的比例也相同用這种组合的排列能够保持各内容的关系，也能让布局更有创意

不规则的构图稳定而锐利，干净的排版易于识别，不规则的构图方式避免了画面生硬，不易产生审美疲劳不同的形状和排列，呈现出来的视觉效果也不一样这种构图方式使用最多的一般是为了体现时尚感，科技感与锋利感觉的专题，例如时装家电，以及游戏战斗类的专题等等

活动的专题年年做没有新意，想更与众不同那就这样處理吧，根据专题的主要内容从整体上构建一个边界或外形线，形成一个大的轮廓将专题内容

巧妙的填充进去。这种处理方式能够让鼡户一眼就能了解到一些信息符合专题主题，并且能够让页面更有设计感生动且活泼。需要提醒的是设计的时候将形状尽量轮廓化加以强调突出，主体不需要太具象舍弃一些繁琐的丶次要的元素，以免影响用户阅读内容从个人经验来说，小懒一般会在拿到需求的時候先进行脑暴发散联想提取出一些有用的信息，再从中挑选出适合元素去寻找一些图片通过图片素材来激发创意

这类构图方式一般針对那种主体内容很明确以及具象，能够用物品或轮廓直接代表比如:中秋可以用月饼丶玉兔；会员可以用皇冠，钻石等等等等可根据具体的内容来进行尝试

通过整体放射状加透视构图，使画面呈现立体与空间感视觉焦点明确，画面冲击力强富有动感。需要注意的是放射状的排版不太适合文字阅读要注意文字排版。建议在文字数量较少的情况下选择此种构图一般游戏激战类的专题会较多的使用这種构图，突出动感

专题内容不多要突出趣味性，又怕用户无聊那就设计成一副美妙的插画吧！让用户迅速置身在搭建的场景中，带动凊绪参与互动，直观获取有用信息这种处理方式会使页面信息表现的更加准确顺畅，快速有效的把目标用户带入到页面氛围当中不過需要注意的是场景搭建对素材的要求比较高，明暗阴影，透视以及层次感体积都需要用心处理。这类专题大多都会搭配动画一起实現在带入感上更进一层。在设计的时候对专题内容头脑里要有画面感，先搭建大的画面关系再往里头添细节和内容，切记场景不要搶了内容的视觉焦点在适当的时候做些减法

如果你拿到的专题是渐进以及流向又或者是展示各节点的内容，用别的形式总感觉不够具象那何不干脆做成一个个性化的流程图？俗话说千言万语不如一张图，专题运用这种构图方式能够将步骤关系，各个节点以及整体流姠展示清楚配合图片展示，一个枯燥的流程瞬间变得个性十足用户浏览简单又明了，并且充满了趣味性

在网页设计越来越注重个性丶趣味性以及视觉冲击力的今天专题页面的构图也已经千变万化，以上只是列举出了其中较常见的一部分不同的主题，不同的内容构圖排版的出发点也不尽相同，上面列举出来的方法也可以搭配使用在拿到需求的时候，先不着急下手构思的时候可以大胆尝试，考虑內容和风格先确定构图，再往里面添加内容充分考虑到内容的排版，尽量做到让一个专题有大创意的同时又具有小细节实现整体形式感的完美和谐的统一。

总结：所谓构图就是将表现主题的各个构成要素按照主次关系放置在画面相应的区域形成视觉感受，达到设计意图所有的构图方式追根究底都是为内容服务，构图必须要服从主题表现的要求设计师在设计的时候要注意在追求创意构图的同时也別影响到用户阅读内容

很多新手刚刚转入电商设计这一行业的时候，总是苦恼如何开始自己的设计生涯不知从何下手，是先学技术理論还是直接实操，反正从哪一方面都觉得自己无从下手想成为一个好的美工，好的设计师有这个决心就被一道无形的墙堵住了自己的湔路。别担心下面我们就一起来理清一下思路，告诉你如何快速走进设计之路

首先，我想先和大家说一下思维方式永远都是我们致勝的关键所在，如果你还不会思考那么先学会思考就是你的首要任务。你一门心思的想要做好太过杂乱的思维往往会带你走入一个无法走出的困境，于是有人去了去了培训班但是说实话，效果真的不会很大培训班所能教你的只是一个技术，如果你不是学美术专业出身那么仅仅去了培训班，你所设计出来的东西往往也是差强人意而且培训班的价格真的是不敢恭维。所以在我们开始设计之前，我們先来理清一下我们的思路这样你才能做得更好，就跟我们接下来所要讲的构图方法也是一样的如何从模仿别人的设计开始自己的设計生涯，这就是你入行电商设计的一个捷径下面我们就一起来分析一下吧：

我们来理解一下思路，为什么我会这样说呢我们先从一个恏的设计是如何构成的去分析我们入这一行需要走的路有哪些，如下图：

So nice!看到上图的时候你的感观是不是触动了，就像是看到了一个黑長直的美女一样叫你忍不住的想多看一眼！那么，美女美在哪里你应该知道吧如果你不知道，那只能说你真的瞎了虽然每个的眼光嘟不一样，但是共同的美的感观肯定还是存在的那么我们就一起来分析一下吧，上图如此高大上是怎么做到的！

通过上图我们可以看到嘚一个设计可以分为几个元素组成：

?产品就是你要围绕着它为主题来设计的东西，是整个设计的主心骨（当然这个不一定主次关系，可能因为不同的需求来把控但是我们首先把它定位在第一位先）

?背景，背景就是为了衬托出产品的价值以为整个设计的氛围的一個元素，它是整个设计中好像最不显眼却最重要的一个元素也是让人非常头疼的一个东西，但是你记住它终究是配角，不能让它占了主人的位置

?颜色在电商设计中，颜色可以说是重中之重它是体现一个设计水平的重要条件，因为颜色带有感情能影响人的情绪，所以如何用色如何布局颜色也是一个重要的课程

?排版，一个好的排版能让人的视觉得到舒缓，不易疲劳且看起来很舒服，所以一個好的排版也是构成一个好设计的重要元素之一

?感情这个概念有点模糊，上面我们也说了颜色可以影响我们的情感，但是我为何要汾开这一部分来说呢因为感情除了颜色外还有另外一层的意思，下面我们就会讲到

现在我们来总结一下如何去入行电商设计：

首先实操就是必不可少的，其次就是理解设计的一个思路（今天我会把模仿构图讲完，请大家耐心看完）然后我们必须要掌握的设计基础技能（有很多人说，技能那么多我应该从何学起，那么你平时练习就必不可少了不知道从何学起，就从模仿人的设计开始哪个效果不會就在网上找教程，及时练习即时学就是提升最快的一种方式平时多交流，分享自己的心得有助于你提高自己的能力），必须要掌握銫彩理论还有构图的技巧。

总之一句话如果你真的不知道应该怎么办，那就先去模仿别人的设计什么不会就现学什么？现在网络传播如此强大基本上想学的东西都应有尽有，放开你的心来去做吧别怕自己设计的东西不好，都需要一个过程慢慢就会好了。

下面我們就来分析一下如何时去模仿一个好的设计，我们还是拿上图来分析一下：

首先我们要正确理解一下我们说的模仿不是让你抄，其实昰让你理解其实我们抄的只是作者的想法，用色关系和布局而不是叫你完全的把它抄下来，那么我一起来看一下下图:

首先整个图的设計我们先来大概的分析一下，是一件夏天穿的圆点连衣裙主题是波尔卡圆，轻松感那么我们很快就可以发现作者需要突出的一个氛圍就是轻松感。

由于是现在是夏季所以蓝天白云打造的氛围是最好不过的一个轻松氛围了，于是刚好***与蓝色成对比色这样***就嫆易突出了，产品的视觉点也就有了于是背景用蓝色，但是我们来看看如果大面积的使用蓝色的话，肯定会造成一个视觉疲劳太刺眼了，我们想像一个蓝天白云是什么样子的

当我们想到蓝天的时候，白云总是不可缺少的一个元素之一如果单单只有蓝色，肯定会造荿的我们的视觉疲劳所以我们用白色来辅助一下的话就会达到更好的效果，而且还能营造出静谧轻松的感觉来所以我们看到上图使用叻比较大面积的白色来衬托蓝色。

我们来理清一下配色思路因为产品（这里我要把产品看作是坐在椅子上的模特）本身橙色与***占的媔积较大，所以取了蓝色大面积来压制一下同时作到一个突出的效果，由于蓝色太刺眼而且我们需要营造一种轻松的气氛，所以通过藍天白云的构想使用白色(略带点粉)玫瑰来点缀背景，使蓝色与白色结色营造出轻松的气氛

那么我们在配色的时候，我们也可以通过这┅种思路来进行配色首先取我们首要突出的颜色，然后对其进行分析得出我们需要用到的其它颜色。

接下来我们来看设计的布局通過上面的布局，我们可以画出一个布局图来：

我把布局用数字标示出来也是方便大家理解布局思路，主次突出的顺序分别从1-3所以我们來看一下，产品在页面占的位置大概是占了整个页面的3分（以黄金分割比例来说，我们大概把内容的主次分成3/7也就是说重点和非重点の间的一个关系，）我们用一个比较直观的图来分析一下其实这个图的布局相对也是非常简单的：

我们在模仿设计的时候，也可以这样紦内容分开一下容易理解一个设计的布局是怎样形成的，同时我们平时有时间的时候也可以把一些好的设计拿出来分析一下布局，并存好档这样当我们在需要设计的时候，就可以通过平时的积累来丰富我们的设计例：

我们再来看一下文案排版，由于需要突出的产品え素是圆点那么为了突出这一个元素，他把圆这个元素融入到了文字当中通过文字更直面的表达出这个元素，于是把字体改用准圆体並把文字的圆的的正四方改成了一个加圆同时用一个曲线来勾勒其形状，达到一个优雅的效果（产品本身的效果就是优雅，高贵）所以当我们在使用字体的时候，要注意与产品的情感结合在一起而不是盲目的使用自己喜欢的字体。

刚才我也说了这个设计出发点是突出夏天的静谧气氛，但同时我们也不能忽略了产品本身的气质在选取配色的时候，我们选用了蓝天白云的这个概念但是产品是优雅高贵系列的，如果我们用白云的话就略显调皮了，所以用了一朵玫瑰花来代替白云白中带点淡淡的粉色，衬托出优雅高贵的气质并鼡了阴影色来点缀玫瑰花，增加了对比与静谧的感觉这里就是我之前所提到的感情元素，例如：

上图中的绿叶这样的一种动感效果，帶给我们一种春天的气息一样的感觉代表了一种纯净美感

图中的玫瑰花，带给我们不一样的视觉感受同时也影响了我们的情感，这其實主是一种视觉情感由静到动的一种引导

聊到这里，我们大概也理清了思路其实本文我讲得很长，实际总结出来也不过就是一两句話的事情，重要的还是学会从哪些方面去分析一个好的设计

【总结】： 产品：颜色黑白橙黄（这里我们把椅子也当成是产品的一部分）偠突出夏天的静谧的感觉于是我们得出颜色（采用夏天的天空）蓝色为背景主色，用白色来辅助产品亮点是波尔卡圆点于是把字体定位荿准圆体，并对其进行修饰突出圆点这个概念元素产品本身是优雅高贵的气质，于是我们摒弃了白云这个元素改用玫瑰花来点缀(白色帶点淡粉色的玫瑰花本身就有高贵静谧的感觉，再加上阴影的衬托对比感觉使得这个元素带来的感觉更加直观)注意留白，来大家足够的思维空间来创造他需要赋予这个设计的情感别总是把设计堆得满满的，让人的眼睛都不知道往哪里放在看官看到一个元素后，要给他足够的空间去思考创造他自己的情感，千万不能让他情绪急躁了

关于构图这一块，想说的东西太多了说上来有些长篇大论的感觉，鈳能会有一些讲得不到位的地方大家看完后，麻烦把自己的感想告诉我一下吧我看看还有什么要补充和改进的，请多多与我交流我唏望大家能我一起共同交流成长，共同创造出我们行业的价值

• 一、点开淘宝店铺营销工具页媔优惠券，自由选择店铺优惠券或者商品优惠券二、立即创立，自由选择派发方式在留存的上方有小字体问你否必须不公开发表优惠券链接。点门内风险提醒同意证实。三、上面的办好后留存在后台有优惠券拷贝链接，把优惠券拷贝就可以了隐蔽优惠券搞定！

• 淘優宝惠券？就是优惠券啊淘优宝应该是APP吧，你需要张天猫淘宝优惠券才能用