Photoshop 美工基础与网店装修(微课版)(txt+pdf+epub+mobi电子书下载)


发布时间:2020-08-27 21:17:26

点击下载

作者:赵爱香 王爱芳 刘海明

出版社:人民邮电出版社有限公司

格式: AZW3, DOCX, EPUB, MOBI, PDF, TXT

Photoshop 美工基础与网店装修(微课版)

Photoshop 美工基础与网店装修(微课版)试读:

前言

Preface

一、本书的内容

本书包含9章,前面7章为基础知识,最后两章通过实战演练讲解网店开设与装修实训软件ITMC的使用。各章的具体内容和学习目标如下表所示。续表

二、本书的特点

本书主要有以下特点。

1.知识系统,结构合理

本书针对网店美工岗位,从网店美工认知入手,一步步深入地介绍网店美工所涉及的知识,由浅入深,层层深入。与此同时,本书按照“知识讲解+美工实战+课后练习”的方式进行讲解,让读者在学习基础知识的同时进行实战练习,从而加强对知识的理解与运用。

2.内容丰富,形式多样

书中的“经验之谈”小栏目是与内容相关的经验、技巧与提示,能帮助读者更好地梳理知识。此外,本书提供了配套的视频教学资料、素材和效果文件,读者直接扫描二维码即可获取。

3.结合大赛,实战性强

本书知识讲解与实例操作同步进行,所涉及的案例尽可能还原全国职业技能大赛电子商务赛项的要求,读者完成本书的学习后,不仅可以自行使用Photoshop完成店铺各个部分的设计,还可以对整个比赛的要求、比赛系统的形式等有一个整体的了解。

三、本书的作者

参与本书编写的相关人员有武汉软件工程职业学院的胡颖森、赵爱香、马明明,苏州经贸职业技术学院的刘桓,河南工业贸易职业学院的王爱芳,深圳市宝山技工学校的刘海明,郑州信息科技职业学院的张薇,广东民政职业技术学校的罗维佳、刘燕妮,广西生态工程职业技术学院的李松茂。

尽管编者在本书的编写与出版过程中力求精益求精,但由于水平有限,书中难免有错漏和不足之处,恳请广大读者批评指正。编者2019年1月第1章 网店美工与Photoshop CS6基础随着网络营销的发展壮大,网店美工人员的市场需求日益增大,网店美工人员要想在激烈的市场竞争中争得一席之地,需要对网店美工各种知识进行掌握与应用。除此之外,他们还需要对Photoshop的使用方法进行掌握,通过对Photoshop的熟练使用来提高商品的美观度。下面将对网店美工与Photoshop的基础知识进行讲解。本章要点

● 网店美工介绍

● Photoshop的基础知识1.1 认识网店美工

网店美工是网店运营过程中一个非常重要的职位,主要负责图像的美化、店铺的装修及页面的设计等工作。网店美工不但可让拍摄效果不够美观的商品图像恢复原来的色彩,还能让店铺更加美观、更能吸引顾客的驻留。下面将对网店美工的基础知识进行讲解。1.1.1 网店美工的工作范畴

与常见的美术工作者不同,网店美工主要负责网店的店面装修,以及商品图像的创意处理。与普通的美工相比,他们对平面设计与软件的要求更高,需要掌握更多的知识。下面对网店美工的工作范畴进行介绍。

● 店铺特色的创造:优秀的网店能给人留下良好的第一印象。目前网店中同类型的店铺繁多,若想在众多的店铺中脱颖而出,特色就变得十分重要。只有展示出属于自己的店铺特点,才能够吸引更多的顾客驻足并选取商品,从而增加交易。所以网店美工在美化商品时,创造出属于自己的店铺特色是成功的第一步。

● 商品的美化:使用相机拍摄出的商品照片是不能够直接上架的,为了体现商品的特色,对商品进行美化和修饰必不可少。但是需要谨记,网店美工不是单纯的艺术家,让顾客接受你的作品才是最重要的。

● 店铺的装修与设计:网店美工不单单是将图像处理出来再按照淘宝中自带的模块进行添加,一个好的网店美工不但需要掌握基本的技术方法,还要将所掌握的技术方法运用到店铺的装修中,抓住卖点促进顾客继续看下去,并通过与代码的结合使用,让顾客花最少的时间达到最好的效果。

● 活动页面的设计:网店平台会不定期举行各种促销活动。为了达到与众不同的效果,从竞争激烈的店铺页面中脱颖而出得到顾客的亲睐,活动策划十分重要。这时,优秀的网店美工更需要透彻理解活动,通过设计与装修店铺页面将活动意图传达给顾客,让顾客了解活动的内容、促销的力度,从而促进销量的提升。网店美工在设计时要保证契合活动主题、页面美观,拥有自己独特的亮点,可以让活动更加直观。

● 推广的了解与运用:推广就是将自己的商品、服务和技术等内容通过各种媒体让更多的顾客了解、接受,从而达到宣传与普及的目的。对网店美工来说,推广主要是通过图像将网店的商品、品牌和服务等传达给顾客,加深店铺在他们心中的印象,获得认同感。而网店推广因为推广活动与手段的不同,规格大小不一,文件大小有时也有很多限制,这就给网店美工人员提出了更多的要求。他们不仅需要在现有的标准下及时并有效地向顾客表达出设计的意图,还要体现商品的价值。同时,文案的编写也需要言之有据,让顾客能够快速理解,并对其产生深刻的印象。1.1.2 网店美工的技术要求

要成为一名合格的网店美工,首先需要有扎实的美术功底和良好的创造力,对美好的事物有一定的鉴赏能力;掌握最基本的图像处理与设计能力,能够熟练使用Photoshop、Dreamweaver等设计软件制作网店需要的内容。

其次,由于网店注重“商品”和“用户体验”,这就要求美工人员能够通过图像准确地向顾客表达出商品的特点并挖掘潜在顾客的需求,例如,如何通过图像、文字和色彩搭配表现出商品的独特性,让顾客感觉商品的与众不同;怎样从顾客的分析角度去思考;怎么提升图像的点击率和转化率,实现跨越技术层面来追求更高的转化率,引起顾客的购买欲望。这才是一个合格的网店美工应具备的所有技能。1.1.3 网店美工需注意的问题

网店美工除了掌握基本的软件操作外,还需要知道商品的信息、注意事项、卖点、劣势及让劣势变成优势的技巧等。能做到突出卖点,扬长避短,是成为一个合格网店美工的基本要求。下面对网店美工需注意的问题进行介绍。

● 保持思路清晰:在装修店铺和处理图像前,需要有一个明确的思路,即确定一个大框架,在该框架中标明店铺主要卖什么,商品有什么特点,可以选择哪些元素进行装修,让其不但可以吸引顾客的眼球,还能让商品真实地展现在顾客的面前。

● 掌握装修时机:在装修网店的过程中,网店美工还要抓住一定的时机(如“双11”促销、元旦促销等)对店铺进行装修,达到时机与装修相配合,从而促进商品的销售。

● 统一风格与形式:店铺装修不但要进行合理的色彩搭配,还要统一店铺和详情页的风格和形式,因此装修分类栏、店铺公告和背景音乐等项目时,统一风格和形式变得尤为重要。

● 做好前期准备:在淘宝网中,不是申请了某个活动后才开始进行商品的制作。一个活动往往需要提前1~2个月进行准备。因此活动前期应抓住时机,对活动的文字、图像进行制作,在活动来临前完成促销信息的整理。

● 突出主次:工作过程中,网店美工切记不要为了追求漂亮、美观的效果,而对网店进行过度的美化,无法突出商品图像,掩盖店铺的风格和商品的卖点,导致展现的效果适得其反。1.1.4 网店美工应掌握的设计要点

了解了岗位需求和技能后,网店美工还需要掌握设计要点,这样设计出的效果才能更加出彩。网店美工必须掌握的设计要点主要有色彩搭配,点、线、面三大基本设计元素和文字的编写3个方面,下面分别进行介绍。

1.色彩搭配

店铺的色彩与风格是浏览者进入店铺首先感受到的东西,因此色彩是做好店铺视觉营销的基础。很多卖家在装修店铺的时候,喜欢将一些酷炫的色块随意地堆砌到店铺里,让整个页面的色彩杂乱无比,给浏览者造成视觉疲劳。而好的色彩搭配不但能够让页面更具亲和力和感染力,而且还能提升浏览量。因此,在店铺装修时,色彩搭配尤为重要。(1)色彩的属性与对比

色彩由色相、明度及纯度3种属性构成。色相即各类色彩的视觉感受,如红、黄、绿、蓝等各种颜色;明度是眼睛对光源和物体表面明暗程度的感受,它取决于光线的强弱;纯度也称饱和度,是指色彩鲜艳度与浑浊度的感受。在搭配色彩时,经常需要用到一些色彩的对比,下面对常用的色彩对比分别进行介绍。

● 明度对比:利用色彩的明暗程度进行对比。恰当的明度对比可以产生光感、明快感和清晰感。通常情况下,明暗对比较强时,可以使页面清晰、锐利,不容易出现误差;而当明度对比较弱时,配色效果往往不佳,页面会显得柔和单薄、形象不够明朗。图1-1所示为不同明度对比的页面。

● 纯度对比:利用纯度的强弱形成对比。纯度较弱的对比画面视觉效果也较弱,适合长时间查看;纯度适中的对比画面视觉效果和谐、丰富,可以突显画面的主次;纯度较强的对比画面视觉效果鲜艳明朗、富有生机。图1-2所示为不同纯度对比的页面。图1-1 不同明度对比效果图1-2 不同纯度对比效果

● 色相对比:利用色相之间的差别形成对比。进行色相对比时需要考虑其他色相与主色相之间的关系,如原色对比、间色对比、补色对比和邻近色对比,以及最后需要表现的效果。其中,原色对比一般指红色、黄色和蓝色的对比;间色对比是指两种原色调配而成的颜色的对比,如红+黄=橙、红+蓝=紫等;补色对比是指色相环中的一个颜色与180°对角的颜色的对比;邻近色对比是指色相环上的色相在15°以内的颜色的对比。

● 冷暖色对比:从颜色给人带来的感官刺激考量,黄、橙和红等颜色给人带来温暖、热情及奔放的感觉,属于暖色调;蓝、蓝绿和紫给人带来凉爽、寒冷及低调的感觉,属于冷色调。图1-3所示为冷色调和暖色调页面的对比效果。图1-3 冷色调和暖色调的对比效果

● 色彩面积对比:各种色彩在画面中所占面积的大小不同,所呈现出来的对比效果也就不同。图1-4所示为在使用了大面积红色色调的页面中加入适当的蓝色,可以起到协调和平衡视觉的作用,使用小面积的蓝色还能起到强调促销文字、突出视觉中心的作用。(2)主色、辅助色与点缀色

网店美工在搭配店铺的页面色彩时并不是随心所欲的,而是需要遵循一定的比例与程序。网店装修配色的黄金比例为70:25:5,其中,主色色域占总版面的70%,辅助颜色占25%,而其他点缀性的颜色占5%。网店装修的配色程序为:首先根据店铺类目选择占用大面积的主色调,然后根据主色调合理搭配辅色与点缀色,用于突出页面的重点、平衡视觉效果。图1-5所示为主色、辅助色与点缀色的应用案例。图1-4 色彩面积对比效果图1-5 主色、辅助色与点缀色

在色彩搭配中,主色、辅助色与点缀色是3种不同功能的色彩,分别介绍如下。

● 主色:主色是页面中占用面积最大也是最受瞩目的色彩,它决定了整个店铺的风格。主色不宜过多,一般控制在1~3种,过多容易造成视觉疲劳。主色不是随意选择的,而是需要系统分析自己品牌受众人群的心理特征,找到受众群体中易于接受的色彩,如童装适合选择黄色、粉色和橙色等暖色调作为主色。

● 辅助色:辅助色占用面积略小于主色,用于烘托主色。合理应用辅助色,能丰富页面的色彩,使页面显示更加完整、美观。

● 点缀色:点缀色是指页面中面积小、色彩比较醒目的一种或多种颜色。合理应用点缀色,可以起到画龙点睛的作用,使页面主次更加分明、富有变化。

2.点、线、面三大基本设计元素

在网页中,合理利用图形元素,既丰富了网页的视觉效果,又生动地表现出了商品的信息,同时消除了纯粹的文字页面给人带来的呆板视觉感受。点、线、面是图形中最基本的三大要素。这三大要素的结合使用,能够构成丰富的视觉效果。

● 点:点是可见的最小的形式单元,具有凝聚视觉的作用,可以使画面布局显得合理舒适、灵动且富有冲击力。点的表现形式丰富多样,既包含圆点、方点和三角点等规则的点,又包含锯齿点、雨点、泥点及墨点等不规则的点。图1-6的左图为点的表现之一,右图为文字周围的点元素,用于丰富画面,突出主题。图1-6 点

● 线:线在视觉形态中可以表现长度、宽度、位置、方向和性格,具有刚柔并济、优美和简洁的特点,经常用于渲染画面,引导、串联或分割画面元素。线分为水平线、垂直线、曲线和斜线。不同线的形态所表达的情感不同,水平线和垂直线单纯、大气、明确、庄严;曲线柔和流畅、优雅灵动;斜线具有很强的视觉冲击,可以展现活力四射。图1-7所示为斜线素材及直线在文本串联方面的应用。图1-7 线

● 面:点的放大即为面,线的分割产生各种比例的空间也可以称为面。面有长度、宽度、方向、位置和摆放角度等特性。在版面中,面具有组合信息、分割画面、平衡和丰富空间层次、烘托与深化主题的作用。利用面来设计美化时需要注意:面与面之间要通过不同的排列来进行灵活对比。图1-8所示为使用面元素(如云朵、圆形和矩形等)来装饰画面的效果。图1-8 面

3.文字的编写

可读性强、突出主题的文字能直观地向顾客介绍商品的详细信息,引导顾客完成商品的浏览与购买。在设计网店图像时,文字内容的设计及字体的选择都是有讲究的。文字内容要精练,充分体现表达的主题。有了文字内容之后,相应的字体选择也不能马虎。(1)字体的性格特征

不同的字体具有不同的性格特征,网店美工需要根据商品的特征来选择对应的字体。下面对淘宝网店铺常用字体的性格特征进行介绍。

● 宋体:宋体是店铺应用最广泛的字体,其笔画横细竖粗,起点与结束点有额外的装饰,其外形端庄秀美,具有浓厚的文艺气息,适合用于标题设计。系统默认的宋体纤细端美,但作为标题分量不足,而方正大标宋不仅具有宋体的秀美,还具备醒目性,因此经常被用于女性产品宣传图的设计。此外,书宋、大宋、中宋、仿宋和细仿宋等也属于常用的宋体。图1-9所示为宋体在女性护肤品海报中的应用效果。图1-9 宋体

经验之谈

在鲜花、珠宝配饰、女性用品、护肤品和化妆品等以女性消费者为主体的产品宣传图设计中,一般采用纤细秀美、时尚、线条流畅并且字形有粗细变化的字体,如宋体、方正中倩简体、方正纤黑简体、张海山悦线简体及方正兰亭黑简体等。

● 黑体:黑体笔画粗细一致,粗壮有力、突出醒目,具有强调的视觉感,宣传性强,常用于促销广告、导航条,或车、剃须刀、重金属、摇滚、竞技游戏及足球等男性消费者占主导地位的产品宣传图的设计。常见的黑体样式包括粗黑、大黑、中黑和雅黑等,如图1-10所示。

● 书法体:书法体包括楷体、叶根友毛笔行书、篆书体、隶书体、行书体和燕书体等。书法体具有古朴秀美、历史悠久的特征,常用于古玉、茶叶、笔墨和书籍等古典气息浓厚的店铺宣传,如图1-11所示。图1-10 黑体图1-11 书法体

● 美术体:店铺设计中还经常使用美术体,如汉仪娃娃篆简、方正胖娃简体、方正少儿简体和滕祥孔淼卡通简体等字体。这类字体具有活泼、可爱、肥圆、调皮的艺术特征,多用于零食、玩具、童装、点读机及卡通漫画等以儿童消费者为主体的产品宣传图设计中。此外,美术体还指将文本的笔画涂抹变形,或用花瓣、树枝等拼凑成各种图形化的字体,其装饰作用强,主要用于海报的设计,可有效提升店铺的艺术品位,如图1-12所示。图1-12 美术体(2)文字的布局技巧

在店铺页面的设计中,文字除了传达营销信息外,还是一种重要的视觉材料。文字的布局在画面空间、结构和韵律上都是很重要的因素。下面对常用的文字布局技巧进行介绍。

● 字体的选用与变化:网店广告文案排版时,2~3种匹配度高的字体是最佳的视觉效果。字体过多会产生零乱而缺乏整体的感觉,容易分散顾客的注意力,使顾客产生视觉疲劳。在选择字体时,可考虑通过加粗、变细、拉长、压扁或调整行间距等操作来变化字体,产生丰富多彩的视觉效果。

● 文字格式的统一:在进行文字的编排时,需要统一文字格式,即文字的字体、粗细、大小和颜色在搭配组合上让顾客有一种关联的感觉,这样文字组合才不会显得松散杂乱。

● 文字的层次布局:在网店视觉营销设计中,文案的显示并非是简单的堆砌,而是有层次的,通常是按重要程度设置文本的显示级别,引导顾客浏览文案的顺序,此情况下首先展示的是该作品强调的重点。在进行文字的编排时,可利用字体、粗细、大小与颜色的对比来设计文字的显示级别。1.2 Photoshop CS6图像文件基础知识

Photoshop CS6是一款强大的平面设计与图像处理软件,使用它不但能让图像效果更加完美,还能制作出不同类型的海报、展示画及商品图像等,它是美工美化过程中的必备软件。下面对Photoshop软件的相应知识进行介绍,如像素和分辨率、位图和矢量图、图像的色彩模式和常用的图像辅助工具等。1.2.1 像素和分辨率

像素是构成位图图像的最小单位,是位图中的一个小方格。分辨率是指单位长度上的像素数目,单位通常为“像素/英寸”和“像素/厘米”。它们的组成方式决定了图像的数据量。

● 像素:像素是组成位图图像最基本的元素。每个像素在图像中都有自己的位置,并且包含了一定的颜色信息。单位面积上的像素越多,颜色信息越丰富,图像效果就越好,文件也会越大。图1-13所示的荷花即为图像分辨率为72像素/英寸下的效果和放大图像后的效果。放大后的图像中显示的每一个小方格就代表一个像素。

● 分辨率:图像中的分辨率指单位面积上的像素数量。分辨率的高低直接影响图像的效果。单位面积上的像素越多,分辨率越高,图像就越清晰,但所需的存储空间也就越大。图1-14所示为分辨率为72像素/英寸和300像素/英寸的区别。从中可以看出,低分辨率的图像较为模糊,高分辨率的图像更加清晰。图1-13 像素图1-14 分辨率1.2.2 位图和矢量图

位图和矢量图是图像的两种类型,是网店美工进行图形图像设计与处理时所必须了解和掌握的。理解这两种类型及两种类型之间的区别,有助于读者更好地学习和使用Photoshop CS6。

1.位图

位图也称点阵图或像素图,它由多个像素点构成,能够将灯光、透明度和深度等逼真地表现出来。将位图放大到一定程度后,即可看到位图是由一个个小方块组成的,这些小方块就是像素。位图的质量由分辨率决定,单位面积内的像素越多,分辨率越高,图像效果也就越好。但当位图放大到一定比例时,图像会变模糊。常见的位图格式有JPEG、PCX、BMP、PSD、PIC、GIF和TIFF等。图1-15所示为位图原图和放大500%的对比效果。图1-15 位图效果

2.矢量图

矢量图是用一系列计算机指令来描述和记录的图像,它由点、线、面等元素组成,所记录的对象主要包括几何形状、线条粗细和色彩等。矢量图常用于制作企业标识或插画,还可用于商业信纸或招贴广告,可随意缩放的特点使其可在任何打印设备上以高分辨率进行输出。与位图不同的是,矢量图的清晰度和光滑度不受图像缩放的影响。常见的矢量图格式有CDR、AI、WMF和EPS等。1.2.3 图像的色彩模式

在Photoshop CS6中,色彩模式决定着一幅电子图像以什么样的方式在计算机中显示或打印输出。常用的色彩模式包括位图模式、灰度模式、双色调模式、索引模式、RGB模式、CMYK模式、Lab模式和多通道模式等。用户只需打开图像文件,选择【图像】/【模式】命令,在打开的子菜单中选择对应的命令即可完成图像色彩模式的转换。下面将分别对不同色彩模式的含义进行介绍。

● 位图模式:位图模式是由黑、白两种颜色来表示图像的颜色模式,适合制作艺术样式或用于创作单色图形。彩色图像模式转换为该模式后,颜色信息将会丢失,只保留亮度信息。只有处于灰度模式下的图像才能转换为位图模式。图1-16所示即为位图模式下图像的显示效果。

● 灰度模式:在灰度模式图像中,每个像素都有一个0(黑色)~255(白色)之间的亮度值。当彩色图像转换为灰度模式时,将删除图像中的色相及饱和度,只保留亮度与暗度,得到纯正的黑白图像。图1-17所示即为将图像转换为灰度模式前后的显示效果。图1-16 位图模式图1-17 灰度模式

● 双色调模式:双色调模式是用灰度油墨或彩色油墨来渲染灰度图像的模式。双色调模式采用两种彩色油墨来创建由双色调、三色调及四色调混合色阶组成的图像。在此模式中,最多可向灰度图像中添加4种颜色。图1-18所示即为双色调效果。

● 索引模式:索引模式指系统预先定义好一个含有256种典型颜色的颜色对照表,当图像转换为索引模式时,系统会将图像的所有色彩映射到颜色对照表中。图像的所有颜色都将在它的图像文件中定义。当打开该文件时,构成该图像的具体颜色的索引值都将被装载,然后根据颜色对照表找到最终的颜色值。图1-19所示即为索引模式下图像的显示效果。图1-18 双色调模式图1-19 索引模式

● RGB模式:RGB模式由红、绿、蓝3种颜色按不同的比例混合而成,又称真彩色模式,是Photoshop默认的模式,也是最为常见的一种色彩模式。在Photoshop中,除非有特殊要求会使用某种色彩模式,一般情况下都采用RGB模式。这种模式下可使用Photoshop中的所有工具和命令,其他模式则会受到相应的限制。图1-20所示即为RGB模式下图像的显示效果。

● CMYK模式:CMYK模式是印刷时使用的一种颜色模式,主要由Cyan(青)、Magenta (洋红)、Yellow(黄)和Black(黑)4种颜色组成。为了避免和RGB三基色中的Blue (蓝色)混淆,其中的黑色用K表示。若在RGB模式下制作的图像需要印刷,则必须将其转换为CMYK模式。图1-21所示即为CMYK模式下图像的显示效果。图1-20 RGB模式图1-21 CMYK模式

● Lab模式:Lab模式由RGB三基色转换而来,它将明暗和颜色数据信息分别存储在不同位置。修改图像的亮度并不会影响图像的颜色,调整图像的颜色同样也不会破坏图像的亮度,这是Lab模式在调色中的优势。在Lab模式中,L指明度,表示图像的亮度,如果只调整明暗、清晰度,可只调整L通道;a表示由绿色到红色的光谱变化;b表示由蓝色到黄色的光谱变化。图1-22所示即为Lab模式下图像的显示效果。

● 多通道模式:在多通道模式下图像包含了多种灰阶通道。将图像转换为多通道模式后,系统将根据原图像产生一定数目的新通道,每个通道均由256级灰阶组成。在进行特殊打印时,多通道模式的作用尤为显著。图1-23所示即为多通道模式下图像的显示效果。图1-22 Lab模式1.2.4 图像辅助工具图1-23 多通道模式

Photoshop CS6中提供了多个辅助用户处理图像的工具,它们大多位于“视图”菜单中。这些工具对图像不起任何编辑作用,仅用于测量或定位图像,使图像处理更精确,并提高用户的工作效率。下面将具体介绍Photoshop CS6中辅助工具的使用方法。

1.标尺

标尺是参考线的基础,只需选择【视图】/【标尺】命令(见图1-24)或按【Ctrl+R】组合键,即可在打开的图像文件左侧边缘和顶部显示或隐藏标尺。通过标尺可查看图像的宽度和高度。标尺x轴和y轴的O点坐标在左上角,在标尺左上角的相交处按住鼠标左键不放,当光标变为形状时拖动到图像中的任意位置,释放鼠标左键,此时拖动到的目标位置即为标尺的x轴和y轴的相交处,如图1-25所示。图1-24 标尺

试读结束[说明:试读内容隐藏了图片]

下载完整电子书


相关推荐

最新文章


© 2020 txtepub下载