《电商设计（全彩慕课版）》配套教学教案

《电商设计（全彩慕课版）》

配套教学教案

第1讲

课时内容初识电商设计授课时间90分钟课时2

0熟悉电商设计的基本概述。

教学目标0熟悉电商设计师的基本概述。

0明确电商设计的发展趋势。

0熟悉电商设计的基本概述。

教学重点

0熟悉电商设计师的基本概述。

教学难点明确电商设计的发展趋势。

1、教学思路：1、通过认识电商设计了解电商设计的相关概念、设计师的基本概述和

发展趋势。

教学设计2、教学手段：通过电商设计基础知识的讲解了解电商设计。

3、教学资料及要求：熟练掌握电商设计的相关知识来加深学员对电商设计的了解，以

提高实际应用能力。

教学内容

讨论问题：1、电商设计师的工作内容有哪些？

2、电商设计师需要哪些常用软件？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

1.1电商设计的基本概述

1.1.1电商设计的基本概念

1.1.2电商设计的主流平台

1.2电商设计师的基本概述

1.2.1电商设计师的类型划分

1.2.2电商设计师的工作内容

1.2.3电商设计师的专业技能

1.2.4电商设计师的常用软件

1.3电商设计的发展趋势

1.4电商设计的项目流程

1.5电商设计的规范规则

1.5.1单位介绍

1.5.2页面结构

1.5.3栅格系统

1.5.4文字规则

1.6电商设计的设计基础

1.6.1基础元素

1.6.2色彩搭配

1.6.3字体表现

1.6.4版式设计

1、了解电商设计的基本概述；

小结2、了解电商设计师的基本概述；

3、了解电商设计的发展趋势。

第2讲

课时内容商品精修与视觉合成授课时间90分钟课时2

0了解修图的核心要素。

0理解光影与材质。

教学目标0了解合成的基本类型。

0熟悉合成的透视知识。

0熟悉合成的光影知识。

0了解光影与材质。

教学重点

0掌握合成的透视知识。

教学难点合成的光影知识。

1、教学思路：通过对修图的核心要素、光影与材质、合成的基本类型、合成的透视知

识和光影知识了解商品精修与视觉合成。

教学设计2、教学手段：通过对其修图的核心要素的讲解，快速熟悉商品精修与视觉合成。

3、教学资料及要求：熟练掌握修图核心要素、修图常用技法来加深学员对商品精修与

视觉合成的了解，以提高实际应用能力。

教学内容

讨论问题：1、精修的核心要素有哪些？

2、合成的基本类型有哪些？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

2.1商品精修

2.1.1精修的核心要素

2.1.2精修的常用技法

2.1.3理解光影与材质

2.1.4课堂案例——茶叶包装精修

2.2视觉合成

2.2.1合成的基本类型

2.2.2合成的透视知识

2.2.3合成的光影表现

2.2.4课堂案例——自然植物场景合成

2.3课堂练习——发膜瓶器修图

2.4课后习题——室内空间场景合成

1、了解修图的核心要素。

2、理解光影与材质。

小结3、掌握合成的基本类型。

4、掌握合成的透视知识。

5、了解合成的光影知识。

课堂练习——发膜瓶器修图

学习使用污点修复画笔工具精修发膜瓶。

作业

课后习题——室内空间场景合成

学习使用绘图工具、文字工具制作自然植物场景合成。

修护发膜

改善干枯毛躁发质

第3讲

课时内容营销推广图设计授课时间90分钟课时2

0了解主图的基本概念。

教学目标0了解直通车图的基本概念。

0了解估展图的基本概念。

0了解直通车图的基本概念。

教学重点

0了解主图的基本概念。

教学难点了解钻展图的基本概念。

1、教学思路：（1）通过对课堂案例的讲解掌握嘉兴肉粽主图、洗衣机直通图和国产面

膜钻展图的设计方法和应用技巧；（2）再通过软件相关功能的解析深入学习营销推广

图设计；（3）再通过课堂练习巩固软件功能与案例效果的巧妙结合；（4）最后通过课

后习题消化所学软件知识，提高营销推广图设计的能力。

教学设计

2、教学手段：（1）通过课堂案例熟悉学习目标和软件知识；（2）通过软件功能解析深

入学习软件功能和制作特点；（3）通过课堂练习和课后习题提高学生的实际应用能力。

3、教学资料及要求：在网上找一些简易的图片进行绘制，来加深学员对知识点的理解

和使用，以提高实际应用能力。

教学内容

讨论问题：1、钻展图的设计方法有哪些？

2、推广内容通常可以分为哪三种？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

3.1主图设计

3.1.1主图的基本概念

3.1.2主图的设计尺寸

3.1.3主图的设计方法

3.1.4课堂案例一一嘉兴肉粽主图设计

3.2直通车图设计

3.2.1直通车图的基本概念

3.2.2直通图的设计尺寸

3.2.3直通图的设计方法

3.2.4课堂案例一国产洗衣机直通图设计

3.3钻展图设计

3.2.1钻展图的基本概念

3.2.2钻展图的设计尺寸

3.2.3钻展图的设计方法

3.2.4课堂案例——国产面膜钻展图设计

3.4课堂练习——健康钙片车图设计

3,5课后习题——生鲜食品钻展图设计

1、熟练掌握主图的基本概念。

小结2、熟练掌握直通车图的基本概念。

3、熟练钻展图的基本概念。

课堂练习——健康钙片车图设计

学习使用绘图工具、文字工具制作健康钙片车图。

活动价：

一瓶钙片150粒

作业*89.9/瓶

（立1M2罐包邮

课后习题——生鲜食品钻展图设计

学习使用绘图工具、文字工具制作生鲜食品钻展图。

第4讲

课时内容PC端海报设计授课时间90分钟课时2

0了解PC端海报的基本概述。

教学目标0熟悉PC端海报的布局类型。

0明确PC端海报的表现形式。

0掌握PC端海报的基本概述。

教学重点

0掌握PC端海报的布局类型。

教学难点熟练掌握PC端海报的表现形式。

1、教学思路：（1）通过对课堂案例的讲解掌握西湖龙井海报的设计方法和应用技巧；（2）

再通过软件相关功能的解析深入学习PC端海报设计；（3）再通过课堂练习巩固软件功能与

案例效果的巧妙结合；（4）最后通过课后习题消化所学软件知识，提高设计PC端海报设计

能力。

教学设计

2、教学手段：（1）通过课堂案例熟悉制作思路和软件功能；（2）通过软件功能解析深入学

习软件功能和制作特点；（3）通过课堂练习和课后习题提高学生的实际应用能力。

3、教学资料及要求：在网上找一些简易的图像进行设计，来加深学员对PC端海报设计的

了解，以提高实际应用能力。

教学内容

讨论问题：1、PC端海报的常见类型有哪些？

2、PC端海报有哪些表现手法？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

4.1PC端海报的基本概述

4.1.1PC端海报的常见类型

4.1.2PC端海报的常见尺寸

4.2PC端海报的版面布局

4.2.1PC端海报的布局类型

4.2.2PC端海报的布局原则

4.3PC端海报的表现形式

4.3.1PC端海报的风格定位

4.3.2PC端海报的表现手法

4.3.3课堂案例一西湖龙井海报设计

4.4课堂练习——国产空调海报设计

4.5课后习题——国货沐浴露海报设计

1、熟练掌握PC端海报的基本概述；

小结2、掌握PC端海报的布局类型；

3、掌握PC端海报的表现形式；

课堂练习——国产空调海报设计

学习使用绘图工具、文字工具制作国产空调海报。

作业

课后习题——国货沐浴露海报设计

学习使用绘图工具、文字工具制作国货沐浴露海报。

净透肌肤

鲜花醒肤沐浴露

全场第二瓶半价

语的时间：6月16日£月20日

第5讲

课时内容手机端海报设计授课时间180分钟课时4

0了解手机端海报的基本概述。

教学目标0熟悉手机端海报的布局类型。

0明确手机端海报的表现形式。

教学重点0了解手机端海报的基本概述。

教学难点明确手机端海报的表现形式。

1、教学思路：（1）通过对课堂案例的讲解掌握旗袍女装手机端海报的设计方法和应用

技巧；（2）再通过软件相关功能的解析深入学习手机端海报设计；（3）再通过课堂练

习巩固软件功能与案例效果的巧妙结合；（4）最后通过课后习题消化所学软件知识，

提高手机端海报设计的能力。

教学设计

2、教学手段：（1）通过课堂案例熟悉学习目标和软件知识；（2）通过软件功能解析深

入学习软件功能和制作特点；（3）通过课堂练习和课后习题提高学生的实际应用能力。

3、教学资料及要求：在网上找一些简易的图像进行设计，来加深学员对手机端海报设

计的了解，以提高实际应用能力。

教学内容

讨论问题：常用的图形分割形式有哪些？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

5.1手机端海报的基本概述

5.1.1手机端海报的常见类型

5.1.2手机端海报的常见尺寸

5.2手机端海报的版面布局

5.2.1手机端海报的布局类型

5.2.2手机端海报的布局原则

5.3手机端海报的设计技巧

5.3.1图形分割

5.3.2简洁背景

5.3.3课堂案例—国风女装手机端海报设计

5.4课堂练习——年货礼券手机端海报设计

5.5课后习题——牛奶草莓手机端海报设计

1、熟练掌握手机端海报的基本概述。

小结2、掌握手机端海报的布局类型。

3、熟练掌握手机端海报的表现形式。

课堂练习——年货礼券手机端海报设计

学习使用绘图工具、文字工具制作年货礼券手机端海报。

作业

课后习题——牛奶草莓手机端海报设计

学习使用绘图工具、文字工具制作牛奶草莓手机端海报。

•汁多泡潜（2邮到宗

精品丹东如

牛奶草莓

第6讲

课时内容商品详情页设计授课时间180分钟课时4

0了解商品详情页的基本概念。

教学目标

0明确商品详情页的模块结构。

教学重点0掌握商品详情页的基本概念。

教学难点掌握商品详情页的模块结构。

1、教学思路：（1）通过对课堂案例的讲解掌握中秋月饼商品海报、中秋月饼卖点提炼、

中秋月饼商品展示、中秋月饼细节展示、中秋月饼商品信息和中秋月饼其他模块的方

法和技巧；（2）再通过软件相关功能的解析掌握商品详情页设计；（3）再通过课堂练

习巩固软件功能与案例效果的巧妙结合；（4）最后通过课后习题消化所学软件知识，

教学设计提高商品详情页设计的能力。

2、教学手段：（1）通过课堂案例熟悉学习目标和软件知识；（2）通过软件功能解析深

入学习软件功能和制作特点；（3）通过课堂练习和课后习题提高学生的实际应用能力。

3、教学资料及要求：在网上找一些图形进行设计，来加深学员知识点的使用和了解，

以提高实际应用能力。

教学内容

讨论问题：1、商品海报的设计规则有什么区别？

2、商品展示的设计需要注意哪些规则？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

6.1商品详情页的基本概述

6.2商品海报设计

6.2.1商品海报的基本概念

6.2.2商品海报的设计规则

6.2.3课堂案例一-中秋月饼商品海报设计

6.3卖点提炼设计

6.3.1卖点提炼的基本概念

6.3.2卖点提炼的设计规则

6.3.3课堂案例—中秋月饼卖点提炼设计

6.4商品展示设计

6.4.1商品展示的基本概念

6.4.2商品展示的设计规则

6.4.3课堂案例——中秋月饼商品展示设计

6.5细节展示设计

6.5.1细节展示的基本概念

6.5.2细节展示的设计规则

6.5.3课堂案例——中秋月饼细节展示设计

6.6商品信息设计

6.6.1商品信息的基本概念

6.6.2商品信息的设计规则

6.6.3课堂案例-中秋月饼商品信息设计

6.7其他模块设计

6.7.1其他模块的基本概念

6.7.2其他模块的设计规则

6.7.3课堂案例——中秋月饼其他模块设计

6.8课后习题——国风耳机详情页设计

6,9课后习题——中式餐具详情页设计

1、了解商品详情页的基本概念;

小结

2、掌握商品详情页的模块结构。

课堂练习——国风耳机详情页设计

学习使用绘图工具、文字工具制作国风耳机详情页。

作业

HFta•••«

课后习题——中式餐具详情页设计

学习使用绘图工具、文字工具制作中式餐具详情页。

第7讲

课时内容PC端店铺首页设计授课时间180分钟课时4

0了解PC端店铺首页的基本概念。

教学目标

0明确PC端店铺首页的模块结构。

教学重点0掌握PC端店铺首页的基本概念。

教学难点掌握PC端店铺首页的模块结构。

1、教学思路：（1）通过对课堂案例的讲解掌握国产护肤品店招导航、国产护肤品轮播

海报、国产护肤品优惠券、国产护肤品分类模块、国产护肤品商品展示和国产护肤品

底部信息的设计方法和应用技巧；（2）再通过软件相关功能的解析掌握PC端店铺首页

设计；（3）再通过课堂练习巩固软件功能与案例效果的巧妙结合；（4）最后通过课后

教学设计习题消化所学软件知识，提高设计PC端店铺首页设计的能力。

2、教学手段：（1）通过课堂案例熟悉学习目标和软件知识：（2）通过软件功能解析深

入学习制作特点；（3）通过课堂练习和课后习题提高学生的实际应用能力。

3、教学资料及要求：在网上找一些图片进行设计，来加深学员对PC端店铺首页设计

的了解，以提高实际应用能力。

教学内容

讨论问题：1、分类模块在店铺首页起到什么作用？

2、首页的核心模块通常有哪些？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

7.1首页的基本概述

7.2店招导航设计

7.2.1店招导航的基本概念

7.2.2店招导航的设计规则

7.2.3课堂案例一国产护肤品店招导航设计

7.3轮播海报设计

7.3.1轮播海报的基本概念

7.3.2轮播海报的设计规则

7.3.3课堂案例-国产护肤品轮播海报设计

7.4优惠券设计

7.4.1优惠券的基本概念

7.4.2优惠券的设计规则

7.4.3课堂案例一国产护肤品优惠券设计

7.5分类模块设计

7.5.1分类模块的基本概念

7.5.2分类模块的设计规则

7.5.3课堂案例——课堂案例-国产护肤品分类模块设计

7.6商品展示设计

7.6.1商品展示的基本概念

7.6.2商品展示的设计规则

7.6.3课堂案例一一课堂案例-国产护肤品商品展示设计

7.7底部信息设计

7.7.1底部信息的基本概念

7.7.2底部信息的设计规则

7.7.3课堂案例一一课堂案例-国产护肤品底部信息设计

7.8课堂练习——国产数码产品店铺首页设计

7.9课后习题——新中式家具店铺首页设计

1、熟练掌握了解PC端店铺首页的基本概念;

小结

2、了解PC端店铺首页的模块结构。

课堂练习——国产数码产品店铺首页设计

学习使用绘图工具、文字工具制作国产数码产品店铺首页。

作业

课后习题——新中式家具店铺首页设计

学习使用绘图工具、文字工具制作新中式家具店铺首页。

第8讲

课时内容手机端店铺首页设计授课时间180分钟课时4

0了解手机端店铺首页的基本概念。

教学目标

0明确手机端店铺首页的模块结构。

教学重点0熟练掌握手机端店铺首页的基本概念。

教学难点熟练掌握手机端店铺首页的模块结构。

1、教学思路：（1）通过对课堂案例的讲解掌握手机端国产护肤品店铺首页的设计方法

和应用技巧；（2）再通过软件相关功能的解析深入学习软件功能和制作特色；（3）再

通过课堂练习巩固手机端店铺首页设计；（4）最后通过课后习题消化所学软件知识，

拓展实际应用能力。

教学设计

2,教学手段：（1）通过课堂案例熟悉学习目标和软件知识；（2）通过软件功能解析深

入学习软件功能和制作特点；（3）通过课堂练习和课后习题提高学生的实际应用能力。

3、教学资料及要求：在网上找一些图片进行设计色彩和色调的调整，来加深学员对手

机端店铺首页的设计创意能力。

教学内容

讨论问题：1、手机端店铺的设计关键点有哪些？

2、首页的核心模块通常由哪些构成？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

8.1手机端店铺基本概述

8.1.1手机端店铺设计的必要性

8.1.2手机端与PC端店铺区别

8.1.3手机端店铺的设计关键点

8.2手机端店铺首页设计

8.2.1轮播海报设计

8.2.2优惠券设计

8.2.3分类模块设计

8.2.4商品展示设计

8.2.5底部信息设计

8.2.6课堂案例——手机端国产护肤品店铺首页设计

8.3课堂练习——手机端国产数码产品店铺首页设计

8.4课后习题——手机端新中式家具店铺首页设计

1、了解手机端店铺首页的基本概念；

小结

2、掌握手机端店铺首页的模块结构。

课堂练习——手机端国产数码产品店铺首页设计

学习使用绘图工具、文字工具制作手机端国产数码产品店铺首页。

作业

课后习题——手机端新中式家具店铺首页设计

学习使用绘图工具、文字工具制作手机端新中式家具店铺首页。

EH1«■*>­•-rnj-*2^1

日日田n日咫E汽

■“■■•••，・“•，at

03国金aQS

BCTOPWBCTOPS

品K盘A

i«M*r»*itM*iHl*

第9讲

课时内容PC端活动专题页设计授课时间180分钟课时4

0了解活动专题页的理§本类型。

教学目标0.熟悉活动专题页的彳立现形式。

0熟悉活动专题页的反:面设计。

0熟练掌握活动专题页的基本类型。

教学重点

0掌握活动专题页的表现形式。

教学难点活动专题页的页面设计。

1、教学思路：（1）通过对课堂案例的讲解掌握品质国货家电平台专题页的设计思路和

制作方法（2）再通过软件相关功能的解析活动专题页的基本类型；（3）再通过课堂练

习巩固软件功能与案例效果的巧妙结合；（4）最后通过课后习题消化所学软件知识，

提高PC端活动专题页设计的能力。

教学设计

2、教学手段：（1）通过课堂案例熟悉学习目标和软件知识；（2）通过软件功能解析深

入学习软件功能和制作特点；（3）通过课堂练习和课后习题提高学生的实际应用能力。

3、教学资料及要求：在网上找一些简单的图片进行设计制作，来加深学员对PC端活

动专题页的设计创意能力。

教学内容

讨论问题：1、活动专题页通常由哪些结构组成？

2、活动专题页的设计要点有哪些？

内容大纲：具体可结合本项目的PPT课件进行配合讲解。

9.1活动专题页的基本类型

9.2活动专题页的表现形式

9.2.1矩形排列

9.2.2场景展示

9.3活动专题页的页面设计

9.3.1活动专题页的设计尺寸

9.3.2活动专题页的页面结构

9.3.3活动专题页的设计要点

9.3.4课堂案例——品质国货家电平台专题页设计

9.4课堂练习——初春焕新家电平台专题页设计

9.5课后习题——国潮年货坚果店铺专题页设计

1、了解活动专题页的基本类型；

小结2、熟练掌握活动专题页的表现形式；

3、掌握活动专题页的页面设计。

课堂练习——初春焕新家电平台专题页设计

学习使用绘图工具、文字工具制作