《网店美工与店铺装修》教案 第15课 PC端电子产品店铺装修（二）.docxVIP

PAGE2

PAGE2

PAGE1

PAGE1

课题

PC端电子产品店铺装修（二）

课时

2课时（90min）

教学目标

知识目标：

掌握PC端店铺详情页、主图视频的设计与制作方法

技能目标：

能够设计、制作PC端店铺详情页、主图视频

素质目标：

培养周到细致、全面系统的思维方式

教学重难点

教学重点：设计与制作店铺详情页和主图视频

教学难点：设计与制作店铺详情页和主图视频

教学方法

问答法、讨论法、讲授法、实践法

教学用具

电脑、投影仪、多媒体课件、教材

教学过程

主要教学内容及步骤

课前任务

【教师】布置课前任务，和学生负责人取得联系，让其提醒同学通过APP或其他学习软件，了解店铺详情页、主图视频的设计与制作的相关知识

【学生】完成课前任务

考勤

【教师】使用APP进行签到

【学生】按照老师要求签到

问题导入

【教师】提出以下问题

详情页中应包含哪些内容？

【学生】聆听、思考、回答

传授新知

【教师】通过大家的发言，引入新的知识点，讲解设计与制作平板详情页、主图视频的相关知识

9.2设计与制作平板详情页

【教师】组织学生扫码播放“设计与制作平板详情页”视频（详见教材），讲解商品详情页的设计技巧与制作方法

9.2.1设计平板详情页

【师生互动】

【教师】随机邀请学生回答问题：

设计详情页时需要注意哪些问题？

【学生】聆听、思考、回答

【教师】总结学生的回答

(1)内容安排。页头安排宣传内容，以吸引消费者驻足;接下来的五个版块均展示平板卖点，让消费者深入了解平板及其特点;最后一个版块展示平板详细信息，让消费者全面了解平板。

(2)配色分析。用白色作为背景颜色，用黑色作为文案颜色，让整个页面呈现出大气、简洁的效果。

(3)布局方式确定。采用层叠布局方式，可以增强画面的层次感。

【教师】通过展示“平板详情页效果”的图片（详见教材），讲解平板详情页效果

9.2.2制作平板详情页

1．制作宣传版块

【教师】示范并讲解制作宣传版块的相关操作

步骤1新建一个宽度为750像素，高度自定，分辨率为72像素/英寸，颜色模式为RGB颜色的文档，然后在图像编辑区上方置入素材文件夹中的“IMG_9793.jpg”文件，并将其旋转合适角度。

步骤2在素材文件下方添加文本并设置文本属性。

步骤3新建一个图层，在文本下方绘制一个宽度为750像素，高度为360像素的矩形选区，然后将其填充为浅灰色(#efefef)，接着打开素材文件夹中的“平板图标.psd”文件，并将图标复制到已绘制的浅灰色矩形上。

2．制作卖点版块

【教师】示范并讲解制作卖点版块的相关操作

步骤1置入素材文件夹中的“星空素材.jpg”文件，并移至浅灰色矩形下方。置入“平板.jpg”文件，将其进行抠图处理后，放在星空素材偏下位置。

步骤2新建一个图层，使用“多边形套索工具”在平板屏幕上绘制选区并为其填充白色。

步骤3复制星空素材，并将复制的图层移到绘制的白色选区图层上方，然后将光标移至两个图层之间，当光标呈状时单击创建剪贴蒙版，接着适当缩小复制的星空素材。

……步骤4~步骤8详见教材

3．制作商品信息版块

【教师】示范并讲解制作商品信息版块的相关操作

步骤1在儿童乐园下方添加文本并设置文本属性。

步骤2置入素材文件夹中的“IMG_9787.jpg”文件，然后在平板图片上添加描边宽度为1像素的灰色(#898989)装饰线。

步骤3新建一个图层，在上下两条装饰线靠近平板的一端各绘制一个灰色箭头。选中所有装饰线与箭头，按“Ctrl+E”组合键合并图层。

……步骤4~步骤6详见教材

4．切片

【教师】示范并讲解切片的相关操作

步骤1使用“切刀工具”在平板详情页上绘制要切片的区域并为其命名。

步骤2将切片存储到“images”文件夹中。

9.3设计与制作平板主图视频

【教师】组织学生扫码播放“设计与制作平板主图视频”（详见教材），练习与巩固商品短视频的设计与制作方法

9.3.1设计平板主图视频

【教师】让学生分组讨论平板主图视频的设计思路

【学生】讨论、由小组代表发表讨论结果

【教师】点评、总结各组的发言，讲解设计主图视频

本例首先导入视频素材，然后按照“展示平板外观→展示平板使用功能”的顺序对画面进行剪辑，并添加商品名称、广告解说等字幕，以便消费者全面、深入地了解平板，接着调整画面的亮度和色调，使画面效果更加明亮、通透，这有利于消费者获得良好的视觉体验，最后添加背景音乐并输出。

9.3.2制作平板主图视频

【师生互动】

【教师】随机邀请学生回答问题：

制作平板主图视频时需要注意哪些问题？简述一下操作步骤。

【学生】聆听、思考、回答

【教师】总结学生的回答

1．剪辑素材

【教师】示范并讲解剪辑素材的相关操