网店美工与视觉设计 （第二版）电子教案.doc

《网店美工与视觉设计》电子教案

PAGE

PAGE1

第1章认识网店美工

教学内容

一、了解网店美工

二、网店美工工作准备

三、网店美工工作流程

教学要求

【知识目标】

1.了解网店美工的工作范畴；

2.了解网店美工必备技能要求。

【技能目标】

1.掌握网店美工所需要软件的安装方法；

2.掌握网店美工需要做的准备工作。

【素养目标】

1.培养读者对网点美工相关内容的学习兴趣；

2.提升读者的职业素养。

教学重点

掌握网店美工的工作流程

教学难点

能够熟练地搜集素材、寻找设计参考。

教学方法

讲授法、练习法

课时数

4课时

教学内容

1.1了解网店美工

1.1.1网店美工的工作范畴

网店美工是随着电子商务的发展而产生的一种新职业，是淘宝、天猫、京东等一系列网店页面设计美化人员的统称，也是网店运营过程中一个非常重要的岗位。网店美工主要工作内容是对网店页面进行设计和美化，制作商品主图和详情页、设计各类活动海报、装修与美化店铺首页等。

1.1.2网店美工的技能要求

首先需要具备一定的平面构成知识，同时能够熟练使用Photoshop、Dreamweaver、Illustrator等设计应用软件。

其次，网店美工需要掌握一定的营销知识，了解消费者心理，能够通过图片、文字等视觉语言，表现出产品的独特卖点，让消费者感知到产品的优势。从运营的角度分析和思考问题，以提升设计作品的点击率和店铺转化率。

1.1.3资源下载平台

1.花瓣网2.站酷网3.千图网

1.2网店美工工作准备

1.2.1常用工作软件

1.AdobePhotoshop

2.AdobeDreamweaver

3.AdobeIllustrator

1.2.2常用字体安装

在选择字体的时候一定要注意字体的版权问题，避免不必要的纠纷，本文推荐两类免费商用字体，分别是思源字体和阿里巴巴普惠体。

除了上文中推荐的两类免费商用字体，如果需要下载更多的免费商用字体，可以通过“100”网站（/）进行下载。

字体的一般安装方法：打开电脑的C盘，选择windows文件夹，选择Fonts文件夹，把下载好的字体直接粘贴进来即可。

1.2.3素材库建设

素材库一般分为两个部分：灵感文件和素材文件。灵感文件，即对优秀设计案例、作品的收集，网店美工在开始自己的设计前，往往需要参考、研究这些案例，提高设计效率。素材文件，就是在设计过程中需要引用的已经处理好的图片、源文件、字体、特效等等。

1.3网店美工工作流程

1.3.1做好前期工作

网店美工接到设计任务时，应该先和店铺的相关人员进行沟通，了解店铺定位，熟悉店铺与商品，为设计工作做好准备。美工的前期沟通工作主要是和客户或者运营进行沟通。

1.3.2规划素材

设计中用到的素材可以通过素材网站来查找和收集，如前面提到的千图网、昵图网、花瓣网等。

1.3.3设计并制作美工作品

规划好素材后，可以使用相关处理软件来进行图片的美化处理，完成网店中各个页面的视觉设计。图片的制作和美化处理主要通过Photoshop软件来完成，视频素材则需要利用视频剪辑软件Premiere进行编辑。

对图片添加热点可以使用网页编辑软件Dreamweaver，也可以使用在线热点编辑工具。

图片制作完成后需要上传到图片空间，网店图片空间是在店铺中上传和发布照片的必要“中转站”。

归纳与

提高

本章主要介绍了网店美工入门的基础知识、工作准备、工作流程等，通过本章内容的学习，读者应该对网店美工的工作职能及工作技能有基本认识，掌握开展设计工作之前需要做的准备工作，明确美工的工作流程。

第2章商品图片的处理与美化

教学内容

一、商品图片尺寸的调整

二、修复图片颜色

三、商品图片的美化与修饰

四、抠图技巧

五、拍摄原图后期综合处理

教学要求

【知识目标】

1．了解商品图片的要求；

2．了解图片修饰的必要性；

3．掌握提高图片亮度与鲜艳度的方法；

4．掌握网店中常用的商品图片尺寸，以及调整、裁剪、校正图片的方法；

5．掌握处理图片污点、修复瑕疵以及虚化背景的方法；

6．掌握扣取不同类型的图片以及合成素材的方法。

【技能目标】

1．能够处理图片污点、修复瑕疵；

2．能够对商品图像进行抠图处理；

3．能够对偏暗、偏亮和偏色的图片进行调色；

4．能够调整商品图片尺寸。

【素养目标】

1.提高读者的商品图片后期处理能力；

2.培养读者对商品图片后期处理的创新能力。

教学重点

1．掌握调整色差的方法；

2．掌握不同类型图片的抠图方法；

3．掌握图片的修饰与美化的方法。

教学难点

调整色差的方法

教学方法

讲授法、练习法

课时数

6课时

教学内容

2.1Photoshop软件的基本操作

2.1.1认识Photoshop的工作界面

Photoshop的基础工作界面，包括了