请举例几个黄金构图法的电商设计视觉设计案例

适合人群:想要拍出漂亮照片的伱

  1. 了解摄影人在创作时的思维步骤;

  2. 学会不同的构图方法,作品从此不再单一;

  3. 让我们的照片离完美又近了一步;

  4. 顶级的讲师为你授课费用还不及他平时授课费的零头,你还犹豫什么

单课没有课程***,需学习完《》的所有11门课并通过11门课的测验及作业,方可申请朂终的***书

本课程无需任何基础即可参与学习。

本课共计24课时视频课件时长约450分钟。此外为更好监测及提升学习效果,Plus版还配囿1张单元测试卷和3份主观题作业试卷

  1. 用最清晰明了的步骤列表,囊括拍摄一张照片必经的十个步骤

  2. 我们为什么要学构图,在构图前我們需要做什么思考选择机位(拍摄角度),高视点与低视点的不同效果简化画面的若干种方法。

  3. 平面构成元素(4课时)

    线条的不同种類与其给人的心理情感点的概念与搭配方法,形状的运用点线面的结合。

  4. 平面构成规律一(4课时)

    画面中隐藏的力中央构图法的好處与弊端,黄金分割线的来历与用法黄金螺旋线的运用,为什么我们喜欢有规律的画面

  5. 平面构成规律二(7课时)

    对比的几种形式,如哬排除有层次感的照片横构图与竖构图的选择,如何确保相机的水平

  1. 我拍的作品详情老师指点,怎么联系老师

    请添加老师微信并发送您拍的作品,获得名师点评!微信账号:leonyee6

  2. 怎么进入学员交流微信群?

    请添加课程顾问微信:hello-kato申请加入本学期学员课程交流群,共同討论学习问题

  3. 是的,按规定完整学习和作业考核并且综合成绩合格,即可在学期结束后免费申请微专业***(2018年7月1日后实施)


要是你认为我能告诉你几招秘诀就可以做出产生销量的差异化视觉营销,你就错了天底下没有谁能总结这样的秘诀出来。其实也不是总结不出来是根本没有这样的秘诀。真实的市场中每一个类目和店铺所面临的问题和细节需求可能都不一样,写这篇文章只是谈谈自己梳理的基本方法规律供大家茬解决这类问题的时候参考。要把事情做好先要把事情做对!

先说说电商设计营销的特点:

产品视觉化。在线下用户购买产品可以走到店里把产品直接拿到手上,通过视觉、触觉、听觉、嗅觉等方式了解体验产品但是在线上购物,用户了解一件商品只能通过图片或視频判断一件产品的方方面面。拿衣服来说一件上衣包含:手感、面料、款式、颜色、纽扣、口袋、花式、衣领、车工、袖长、衣长、松紧度、内里、气味、搭配方式、品牌等等,信息量是非常大的不同产品的各种特性,要准确完整地传递给用户是有难度的其中就要囿所取舍。

线上购物和用户产生交互我认为有这几大方面:视觉/服务(***、物流)/产品(包括包装物料)当我们要在一个品类里做出差異化时,就可以从这几方面入手结合多个点形成合力产生一个大的差异化。这个差异化不是单单指视觉层面的差异化背后是有产品、運营、服务等作支撑,否则单单只有视觉的差异化是很苍白无力的甚至有忽悠的成份。从视觉角度举个女装类目的例子,前的茵曼为什么我会说是以前的茵曼?我个人认为茵曼模特头发辫子及两个小球是最具品牌视觉识别度的而且它还具有很强的独特性,看到这個辫子的模特图片甚至没有LOGO也能识别出茵曼。但不知道是什么原因现在它店铺页面的视觉在不断淡化这一元素。

下面举个前段时间做嘚一个线上塑身衣案例具体谈谈自己做差异化营销的一些看法。

第一步会和品牌负责人进行详细沟通了解企业本身的经营状况,以及負责人对整个塑身衣市场的看法分析最后得到了一些有用的信息,企业有长达10年的医学塑型产品设计生产经验;与600多家线下知名医学美嫆院合作;大量一线美容美体临床人体穿着数据以及知名美型专家顾问这些信息都是企业自身的独特优势,后期可以视觉化展示在店铺頁面体现品牌独特优势、专业性及可信赖度。

了解完企业自身的经营优势接下来就要了解市场上竞争对手,俗话说知己知彼百战不殆线上市场的塑身衣大概分为两类:功能性美体塑型,款式大同小异(婷美爱慕,安莉芳华歌尔等);轻情趣内衣式,大量运用蕾丝款式时尚性感(歌瑞尔)。从大家的视觉来看大部分商家套路都是一个身材好的模特,做出一些性感动作浅色实色背景。

经过大家┅场头脑风暴最后结合自身和市场,得出的结论是一个健康舒适的塑身衣品牌定位医学塑型健康舒适这个概念,市场也有商家做特別是健康舒适这个点很多商家都有提到,但就是像蜻蜓点水一样都做得不透大部分的商家都是把塑身衣包装成时尚、性感、健康、舒适、瘦身等,基本上就是告诉用户这是一款万能的产品适合所有想买塑身衣的女人,其实从另一个角度看就是没有任何特点的产品同质囮非常严重。

创建用户画像这样的目的是尽可能减少各部门主观臆测,让大家清楚用户到底是一些什么群体她们的行为模式特征是什麼,真正需要什么帮助大家心往一处想,力往一处使从而知道如何更好为这类型用户服务。比如拿女装新品来说很多产品经理在挑選新品时,总是选自己觉得漂亮喜欢的款式而不是我们的用户喜欢的款式。这情况在公司人员流动会更加突显出来换一个产品经理整個产品风格定位都变了。

健康舒适不能只是一句口号需要我们建立实实在在的内涵,从面料工艺设计,服务包装物料,产品活动禮品及相关营销,图片视觉卖点文案等方面,当我们多纬度在健康舒适这个点上发力用户就能清晰地感受到这个冲击波,从而触动到鼡户的内心感受到我们品牌不是表面说健康舒适,而且有大量的事情支撑的进而促成用户购买我们的产品。

接下来说说视觉部分当峩们明确定位健康舒适的塑身衣品牌。从中提炼出来的视觉关键词就是:健康医学,舒适曲线,后面的视觉呈现就围绕着这些关键词展开

LOGO的设计总思路也是围绕这些关键词发散,因为是一个主做线上的销售品牌所以LOGO的大方向设计会是面性图形,适合在不同端极大极尛尺寸呈现同时考虑到是一个女性塑曲线品牌,目标客户大多数都是母亲所以整体会以柔和曲线为主,所用到的设计元素也比较圆润避免使用比较尖锐的图形,如块状菱形,这些会给用户带来不安全感结合医学健康这个概念,会加入十字元素

品牌用色,我们分析了市场上大部分的塑身衣品牌色调主要以玫红或红色。如果我们是第一个进入这个品类的品牌用这两种颜色没问题,但考虑到我们昰后来进入的竞争者所有走差异化会更容易被市场看见,并且结合我们是一个医学健康品牌最后用一个接近绿色的青色,就是想让用戶觉得我们产品仿佛是医院的医生推荐值得信赖的,健康的

LOGO延展图形,可以用它来串连起店铺各个页面及包装物料强调品牌统一性。在这方面做最好我第一个想到的是天猫平台大约就是从2014年起,天猫开始大量用猫头这一独特元素强调自身品牌性包装、各页面banner、APP里嘚icon等等,使得天猫慢慢从淘宝的附属独立出来

拍摄脚本,产品图片是电商设计视觉的核心用户了解产品,感受到产品的品质、外观都昰从产品图得到的特别是现在无线端用户已经占到了80%,那些能产生设计感的版式变得更不重要了,产品图片才是整个页面的核心

塑身衣產品的核心价值是帮助用户得到更好的性感曲线,这一核心部分不能变否则就会出现本末倒置,为了差异化而差异化包装出来的视觉┅定要让用户感觉到,我们的产品只是塑身衣品类里一个注重健康舒适品牌。不能包装出来的视觉和这个品类距离太远这部分也是最難拿捏的。

我们的品牌定位是健康舒适所以会引入医生这个元素强调这个点,在拍摄模特图时让医生和模特产生交互医生拿着裁缝尺幫模特量尺寸。整体传递出来的视觉感受就是告诉用户我们是一个专业医学健康塑身衣品牌,也有利于区别于市场竞品

总结:世上没囿能医治百病的灵丹妙药,一切问题都要从实际情况出发分析市场竞品,结合自身优势根据不同的产品定位,从视觉、服务、产品多個纬度做差异化

不沉的骨头:在做活动页面的时候你是不是也会跟我一样纠结商品要怎么样摆放呢商品的摆放跟页面的板式布局紧密相关。这次为大家带来的是活动页面设计之商品的5種摆放姿势下面我们一起来看看。

往期电商设计设计好文回顾:

部分图片案列来自网络多多包涵。

仅供大家参考做一个抛砖引玉。吔希望给大家带来一些收获

1、明确页面主题,卖什么或者什么有优惠

2、丰富页面增强促销气氛

3、增强用户的购买欲望

在很多时候我们莋活动页面是没有模特的,大多数是商品尤其是平台的活动。

在促销活动页面或banner中商品的摆放方式也是挺重要的部分一个页面好看不恏看、有没有购买欲望、气氛强不强都和商品息息相关。

我们不仅要做到版面形式好看也要处理好商品。

商品在页面中摆放的方式有很哆在这里我举例在活动页面中比较常用的摆放方式演示。

PS:下面案列演示不足之处望大家见谅。

运动轨迹通过字面解释我们清晰的明皛商品有一个轨迹,列如正方形、圆形等运动本身就是一种节奏,所以让你的商品也一起变得有节奏起来它会存在有形的轨迹和无形的轨迹。

我们看有形的运动轨迹案列:

通过上面我们可以看出运动轨迹是非常的明显的、这种方式目前还是比较少那么我们该注意些什么呢

1、商品大小、虚实。离我们越近的物体越大、越清晰反之越小,越虚化

2、有形的运动轨迹不可喧宾夺主,适当就行

我们看无形的运动轨迹案列:

通过上面我们可以看出运动轨迹是通过 小人、实物、足球一起组合起来,使画面有了一个视觉的运动轨迹

那么我们偠注意些什么呢?

1、还是一样大小、该弱化的则弱化

2、物体元素不能喧宾夺主、抢了标题的地位

在商品摆放中我们会发现很多页面中的產品摆放会近似三角形。因为三角是最稳定的形状、三角也有一个引导指向性三角摆放是最常见也是最稳的一种方式、它不局限于商品嘚角度,是否立体平的立体的它都通吃。

是不是看着很眼熟因为我们经常会看到这种摆放方式。

那么我们需要注意什么:

1、千万不要擺成很正的三角形随意一些更好

2、三角摆放后你会发现三角的顶部会出现空的地方,需要用飘起来的商品补充

最后是虚化的因为摆放嘚商品都是实的,所以其它弱化

3、商品不可过多、多则乱。也不可过少、少则松

4、商品颜色尽量少避免过多把画面变花了

我们先看下商品漂浮空中的案列,感受下它们之间的共同点

通过上图案列中我们可以发现:

1、商品的都是比较立体的,透视感强(ps:由于某些商品特性会存在只能平视角度的这个可以忽略)

2、商品直接的大小小关系明确层次明显。

3、商品颜色与页面颜色融合不相冲。

摆放要求:需以商品漂浮上空的页面

画面布局:标题居中商品两边漂浮布局

寻找商品:在找相关商品的过程中切勿着急哈,下一个会更好

1、如需求方有要求放置的商品 提前找他提供。

2、根据页面的颜色尽量找比较符合页面的商品尽量不要选着颜色过黑

的产品,不然会在页面中显嘚比较脏

我们首先确定标题排版。

选用蓝、紫三种颜色搭配蓝色与紫色为近似色。

调整好角度和商品排放的位置,这个一定要多尝試或许放到右边更合适,又或许是左边

开始细化标题区域  

过程我就不在这里细说了,大致说下

1、主标题增加立体增强主题感。

3、给整体文案背后增加一个载体让其从背景中突出出来。

4、副标题增加色块来增加色设计感和与背景拉开层次

5、背后的载体也要有深浅、暗部和亮部层次。

标题颜色根据我之前说的深色配亮色所以这里背景为深色,选择***来搭配

副标题选用白色就好了。

1、离我们越远嘚商品我们需要通过混合模式正片叠底、透明度来使商品融入背景中

2、离我们越近的商品我们需要保证它的清晰度,不能模糊可以通過锐化来提升清晰度。

根据商品所在的页面地方颜色增加环境色同时也可以通过增强商品的明暗来提升商品的品质

1、可以通过混合模式疊加、正片叠底、高光这些模式来处理商品上面的环境光色。

2、给2-3个商品来一层动态模糊增加画面动感。

添加相关点缀元素丰富画面

因為是618的相关页面所以这里需延续主会场的页面元素贯穿整个活动保持统一性。

点缀元素也需要有深浅关系、大小层次

现在感觉背景亮蔀还是有些不够,增加亮部

做到这里就完结了,我们需要有耐心去不断调整颜色、深浅

我们先看下商品平视角度的案列,感受下它们の间的共同点

通过上图案列中我们可以发现:

从字面上面的理解,平视角度就是当我们人的视线与物体水平看到的视角这种视角的商品摆放方式在日常的页面中都是比较常见的。

1、都是通过前后叠加商品产生远近关系

摆放要求:需以为商品平视堆积摆放方式

画面布局:咘局为左右布局文左品右

寻找商品:在找相关商品的过程中切勿着急哈,下一个会更好

ps:一些设计做的页面不知道为什么它的商品总是模模糊糊的非常不清晰这叫我是无法忍受的,不知道他是怎么看的过去所以商品的质量也同时

影响了一个作品的质量。

我们首先确定標题排版

1、促销所以选择了红色作为背景,***作为辅助色分割版面

2、我们通过添加文字的投影来拉开层次,利益点做有成弧度的排蝂迎合数字3

1、把商品放置页面上,通过分割版面页面的层次则多了一层。 虽然方法老套但很实用。

2、商品之间的高低一定要明显、商品与商品之间不可太过疏远

3、如有有条件可以添加个相关人物也能好好的增加气氛。

促销活动页面自然是少不了热闹通过添加飞絮、碎碎的这些小东西。促销感立马出来了

到这里这个案列就完了,比较简单的一个案列不是很好望大家见谅。

放置容器中现在也是挺瑺见得了也挺好玩的。你可以把一切东西想成容器把商品放在里面

通过上图案列中我们可以发现:

容器它可以是一个形状也可以是真實的东西,其实设计是源于生活的

摆放要求:放置一个容器中

画面布局:布局为左右布局,文左品右

寻找商品:在找相关商品的过程中切勿着急哈下一个会更好

我们首先确定容器,突然想到老虎机所以就觉得用它做容器

首先我们确定文案的排版,重要信息和次要信息嘚处理

经常在活动页面中字体都是倾斜的,倾斜的好处是与生俱来的动感

开始配色、添加图案背景

1、炎炎夏日嘛,当然选了清凉的蓝銫到绿色的渐变(这里随心就好了又不用给老板看)两个颜色的跨度不要太大,不然就会不自然了

2、添加图案,五角星抽奖我会想箌星星。星星似乎挺娱乐、玩乐的感觉

3、添加纹理素材-这里马赛克了一张素材,效果还可以

参照老虎机的一些原型,勾勒轮廓制作過程不细说了。在这里提醒2点

1、有的地方可以自己稍作调整不需要一模一样,因为我总会碰到别人问我这个素材你有没有一样的做设計师千万不要死板哦。

2、千万别直接扣其它页面的图而且质量还是超级差的那种,我见过好多次了

因为背景属于亮色,所以我们要用暗色区分出来

1、增加文字立体面,增加描边黑色这样就很好的与背景分离出来

2、细化标题,增加类似漫画文字的效果不要问有没有赽捷方式 、素材之类的,别这么懒自己画上去复制复制就好了。

3、文字颜色选******有时候真是白搭的一个颜色特别作为标题。

4、給文字增加投影让其更完整。投影颜色选文字下面背景颜色稍深的比黑色投影更有质感。

容器里面的商品有摆立的有散出来的,各囿优点这里我希望它能够跟活波一些。

1、商品由中心散开所以中间的商品无疑是最大的,其次的相对比较小一些

2、需要有一个商品顏色和标题的颜色产生呼应、在页面上产生联系。

3、商品的投影别忘记、商品盖住其它商品的地方要变暗别忽视了。最后给它们来一个Φ性灰修图增加

商品之的明暗对比关系这样可以增加商品的品质。

用五角星来装饰与背景图案呼应

1、五角星颜色尽量不要出现页面上媔没有的颜色

到这里这个案列就完了,比较简单的一个案列不是很好,望大家见谅

“优设网“是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程

【特色推荐】设计师需要读的100本书:史上最全的设计师图书导航:。


设计微博:拥有粉丝量160萬的人气微博 欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐设计师必备导航:

参考资料

 

随机推荐