视觉营销三大要素——色彩、文字、版式课件

单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,PPT课件,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,08,机电,1,班,Electrical and Mechanical,My class one,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,第,一部分,Electrical and Mechanical,My class one, our home,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,第,二部分,Electrical and Mechanical,My class one, our home,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,第,三部分,Electrical and Mechanical,My class one, our home,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,班风展示,08,机电,1,班,Electrical and Mechanical,My class one,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,Chapter,03,视觉营销三大要素,色彩、文字、版式,1,PPT课件,Chapter 03 视觉营销三大要素1PPT课件,3.1,了解色彩的基本要点,3.4,文字的重要表现,3.5,版式布局对网页界面的影响,目录,总体概况,3.2,记忆中的色彩,3.3,常见配色方案,2,PPT课件,3.1 了解色彩的基本要点3.4 文字的重要表现3.5,3.1,了解色彩的基本要点,浏览众多的网店装修画面，可以发现这样的一个规律，我们首先会被店铺中的色彩所吸引，接着才会根据色彩的走向，对画面的主次进行逐一的了解，接下来本小节会对色彩的一些基础概念进行讲解，这些基础知识也是后期网店装修配色中的关键所在。,1,色彩的种,类,有彩色,有彩色指的是凡是带有某一种标准色倾向的色，光谱中的全部色都属于有彩色，有彩色以红、橙、黄、绿、蓝、紫为基本色，其中基本色之间不同量的混合，以及基本色与黑、白、灰之间的不同量组合，会产生成千上万的有彩色。,有彩色中的任何颜色都具有三大要素，即色相、明度、纯度，因此在图像的制作过程中，根据有彩色的特性，通过调整其色相、明度以及其纯度间的对比关系，或通过各色彩间面积调和，可搭配出色彩斑斓、变化无穷的网店装修画面效果。,（,无彩色,）,3,PPT课件,3.1 了解色彩的基本要点 浏览众多的网店装修画,3.1,了解色彩的基本要点,1,色彩的种,类,无彩色,在色彩的概念中，很多人都习惯把黑、白、灰排除在外，认为它们是没有颜色的，其实在色彩的秩序中，黑色、白色以及各种深浅不同的灰色系列，称为无彩色系。以这三种色调为主构成的画面也是别具一番风味的，在进行网店装修的配色中，为了追求某种意境或者氛围，有时也会使用无彩色来进行搭配。无彩色没有色相的种类，只能以明度的差异来区分，如下图所示，无彩色没有冷暖的色彩倾向，因此也被称为中性色。,无彩色中的黑色是所有色彩中最黑暗的色彩，通常能够给人以沉重的印象，而白色是无彩色中最容易受到环境影响的一个颜色，如果设计的画面中白色的成分越多，画面效果就越单纯。白色和黑色中间的灰色具有平凡、沉默的特征，也是很多时候网店装修中作为调节画面色彩的一种颜色，可以给人留下安全感和亲切感。,如左图所示为网店装修中设计的商品详情页面，其中通过将无彩色与有彩色进行结合，使其形成强烈的对比，突显出商品的特点，削弱辅助图像的内容，同时这样的配色也让整个画面更具设计感和艺术感。,4,PPT课件,3.1 了解色彩的基本要点 1 色彩的种类4PPT课件,3.1,了解色彩的基本要点,2,色彩三要素,色相,色相是色彩的最大特征，所谓色相是指能够比较确切地表示某种颜色色别的名称，也是各种颜色之间的区别，同样也是不同波长的色光被感觉的结果。,色相是由色彩的波长决定的，以红、橙、黄、绿、蓝、紫代表不同特性的色彩相貌，构成了色彩体系中的最基本色相，色相一般由纯色表示，如下图所示分别为色相的纯色块表现形式和色相间的渐变过渡形式。,在进行网店装修的配色中，选择不同的色相，会对画面整体的情感、氛围和风格等产生影响，如下图所示为两种不同色相搭配下的网店装修效果。,5,PPT课件,3.1 了解色彩的基本要点 2 色彩三要素5PPT课件,3.1,了解色彩的基本要点,2,色彩三要素,明度,明度是指颜色的深浅和明暗程度，任何色彩都存在明暗变化，明度适用于表现画面的立体感和空间感。,在网店装修的配色过程中，明度也是决定文字可读性和修饰素材实用性的重要元素，在设计画面整体印象不发生变动的前提下，维持色相、纯度不变，通过加大明度差距的方法可以增添画面的张弛感。同时，色彩的明暗程度也会随着光的明暗程度变化而变化，色彩的明度越高，图像的效果就越明亮、清晰；相反，明度越低，则图像的效果就越灰暗。,6,PPT课件,3.1 了解色彩的基本要点 2 色彩三要素6PPT课件,3.1,了解色彩的基本要点,2,色彩三要素,纯度,纯度通常是指色彩的鲜艳程度，也称为色彩的饱和度、彩度、鲜度、含灰度等，它是灰暗与鲜艳的对照，即同一种色相是相对鲜艳或灰暗的，纯度取决于该色中含色成分和消色成分的比例，其中灰色含量较少，饱和度值越大，图像的颜色就鲜艳。,通常我们把纯度分为不同的,9,个阶段，其中,1,3,阶段的饱和度为低饱和度；,4,6,阶段的饱和度为中饱和度；,7,9,阶段的饱和度为高饱和度，从饱和度的色阶阶段表中可以看到，饱和度越低，越趋于黑色，饱和度越高，色彩就越趋于纯色，具体如下图所示。,7,PPT课件,3.1 了解色彩的基本要点 2 色彩三要素7PPT课件,3.1,了解色彩的基本要点,3,色调的倾向,色调色相的倾向,色相对色调起着重要的作用，也可以说色相是决定色调最基本的因素，色调的变化主要取决于画面中设计元素本身色相的变化，我们所说的某个网店呈现为红色调、绿色调、蓝色调或者紫色调等，指的就是组成画面设计元素的固有色相，就是这些画面主导地位的颜色决定了画面的色调倾向。,8,PPT课件,3.1 了解色彩的基本要点 3 色调的倾向8PPT课件,3.1,了解色彩的基本要点,3,色调的倾向,色调明度的倾向,在确定了构成画面的基本色调之后，色彩明度的变化也会对画面造成极大的影响，通常我们所说的画面明亮或者暗淡，其实就是明度的变化赋予画面的不同明暗倾向，因此在对一个网店装修的画面进行构思设计时，采用不同的明度的色彩能够创造出丰富的色调变化。,9,PPT课件,3.1 了解色彩的基本要点 3 色调的倾向9PPT课件,3.1,了解色彩的基本要点,3,色调的倾向,色调纯度的倾向,纯度也是决定色调倾向不可或缺的因素，不同纯度的色彩所赋予的画面感觉也不同，我们常指的画面鲜艳度或昏暗均为色彩的纯度所决定的。就色彩的纯度倾向而言，高纯度色调和低纯度色调都能赋予画面极大的反差，给人不同的视觉印象，在网店装修中，色调纯度的倾向，一般会根据商品具体的色彩来决定。,10,PPT课件,3.1 了解色彩的基本要点 3 色调的倾向10PPT课件,3.2,记忆中的色彩,由于在社会环境中长期积累的认识、主观意向以及人类自身的生理反应，导致我们也对色彩会产生出一种习惯性的反应与心理暗示，就色彩的冷暖清新而言，可以将色调分为冷色调、暖色调。,色彩的冷暖感觉是色彩给予人类的一种视觉印象，在我们浏览网店装修画面的过程中，自热而然地就会产生一种直觉的冷暖感应，因此在配色中，要让画面色彩的冷暖感与商品和店铺的风格一致。,根据色彩温度的不同，可以把颜色大体上分为暖色和冷色，其中暖色是指红色、黄色、橙色等系列的颜色，能够给人以温暖的感觉；而冷色是指蓝色、绿色、紫色等系列的颜色，给人以冰冷的感觉。,在表现刺激、活泼、热情、开放等氛围时，可以选择暖色系；在表现冷清、镇静、清爽等氛围时，则可以选择冷色系，因此把握好色彩的冷暖就能搭配出不同情感的网店装修画面效果。,11,PPT课件,3.2 记忆中的色彩 由于在社会环境中长期积累,1,暖色系色彩的性格和表现,3.2,记忆中的色彩,如果在设计的网店装修画面中融入大量以红色、橙色为主的色调时，此时的画面会呈现出温暖、舒适的感觉，此类的配色通常被称为暖色调。暖色调可以赋予画面热烈、活泼之感，能够使人情绪高涨，通常被认为是提高血压及心跳率、刺激神经系统的色彩。从色彩本身的功能上来看，红色是对局兴奋作用的，同时也是最具热情和温暖的颜色。,对于追求温暖感的网店设计而言，暖色系常使人联想到火热的夏季、鲜红的植物、热闹的氛围等，当向右表现温暖的感觉时，选用暖色系，即可营造出强烈的火热氛围，给人热情、温暖的感觉。,色彩的温度心理感觉与色彩的明度有关，当色彩的明度最高时，温度感觉最高；当明度增高或者降低时，色彩的温度感会有主见减弱的感觉，如,右,图所示。,12,PPT课件,1 暖色系色彩的性格和表现3.2 记忆中的色彩,2,冷色系色彩的性格和表现,3.2,记忆中的色彩,当网店的装修画面中出现较多的以蓝色为主的冷色调时，画面会呈现出令人感觉寒意的氛围，可给人的心理造成寒冷、凉爽的感觉。,冷色系相对于暖色系具有压抑心理亢奋的技能，令人感觉到冰凉、沉静等意象。其中以蓝色最具清凉、冷静的作用，其它明度、纯度较低的冷色系也都具有使人感觉小计、镇静的作用。,冷色系除了可以让人感受到一种冷清、空荡的感觉，还可以让人感觉到如冰快般的寒冷、刺激的凉意，能够更形象地诠释出冷色配色所传达的意象。在网店装修的过程中，特别是在夏季，或者是表达一种价格低至极致的感觉，设计师通常都会使用蓝色这种冷色系的代表色彩进行配色，传递出浓浓的凉意，让顾客感同身受，以达到提升转化率的目的。,冷暖的关系是相对而言的，冷色系容易使人联想到白雪皑皑的冬季、湛蓝的湖泊和幽蓝的冰雪，以冷色为主后塍的冷色基调通常会给人造成寒冷、清爽、薄弱、收缩的印象，并且在色彩纯度和明度都很低的色调下，能够成行出比实际画面更加收缩的视觉效果。,色彩的纯度是影响色彩冷暖感的一个较大的因素，通常情况下，纯度越高的色彩，给人的寒冷感越强烈，如上图所示可以感受到这种变化所带来的视觉效果。,13,PPT课件,2 冷色系色彩的性格和表现3.2 记忆中的色彩 当网店的装,3.3,常见配色方案,从视觉的角度而言，我们最先感知的便是网店装修画面中的色彩，任何色彩都具备色相、明度和纯度三个基本要素，如何正确的运用常见的配色方案，是网店装修设计必备的技能。,1,对比配色在网店装修中的应用,色相对比,明度对比,纯度对比,面积对比,2,调和配色在网店装修中的应用,色相,色相一致的调和配色,明度一致的调和配色,纯度一致的调和配色,无彩色的调和配色,例：,（,色相对比,）,例：,（,明度一致的调和配色,）,14,PPT课件,3.3 常见配色方案 从视觉的角度而言，我们最先感,3.4,文字的重要表现,在网店装修画面中，文字的表现与商品展示同等重要，它可以对商品、活动、服务等信息进行及时的说明和指引，并且通过合理的设计和编排，让信息传递更加的准确。,1,常见的字体风格,线形,书法,手写体,规整,2,了解文字的编排准则,准确性,易读性,审美性,例：,（,线形,）,例：,（,审美性,）,15,PPT课件,3.4 文字的重要表现 在网店装修画面中，文字的表现,3.4,文字的重要表现,3,运用合理分割方式来安排文字,左图右文,左文右图,上文下图,上图下文,4,字体的创意设计,连体字让文字整体感增强,立体字表现出强烈的空间感,利用设计元素辅助文字的表现,例：,（,左文右图,）,例：,（,明度一致的调和配色,）,16,PPT课件,3.4 文字的重要表现例：（左文右图）例：（明度一致的调和,3.5,版式布局对网页界面的影响,运营网上店铺时，为了提高销售业绩，需要制作美观、适合商品的页面，利用图片或者文字说明等组成要素，通过将其美观地进行布局而更引人注目，并且由此提升顾客的购买率。将商品页面的组成要素进行合理的排布，以达到吸引顾客的目的就是装修设计的版式布局。,1,版式设计的形式法则,对称与均衡,节奏与韵律,对比与调和,虚实与留白,2,版式布局中图片的处理,缩放图片获得最佳的商品展示效果,利用裁剪提炼出图片的重点,3,了解版式布局中的视觉流程,曲线型的版面指向,单向型的版面指向,4,版式布局中的对齐方式,右对齐,左对齐,居中对齐,组合对齐,例：,（,曲线型的版面指向,）,17,PPT课件,3.5 版式布局对网页界面的影响运营网上店铺时，为了提高销,