《商品信息采编》教案第13课设计服装配饰类和数码电器类商品主图.docx

《《商品信息采编》教案第13课设计服装配饰类和数码电器类商品主图.docx》由会员分享，可在线阅读，更多相关《《商品信息采编》教案第13课设计服装配饰类和数码电器类商品主图.docx（7页珍藏版）》请在优知文库上搜索。

1、课题设计服装配饰类和数码电器类商品主图课时2课时(90min)教学目标知识技能目标：（1）了解商品主图（2）掌握商品主图的构图方式（3）了解服装配饰类和数码电器类商品主图的内容安排（4）能够完成服装配饰类和数码电器类商品主图的设计工作素质目标：增强知识产权保护意识教学重睚点教学重点：服装配饰类和数码电器类商品主图的设计教学难点：服装配饰类和数码电器类商品主图的设计教学方法问答法、讨论法、讲授法、实践法教学用具电脑、投影仪、多媒体课件、教材教学设计第1节课：课前任务一考勤（2min）一问题导入（5min）一传授新知（15min）T任务实施（23min）第2节课：问题导入（5min）一任务实施（2

2、5min）一课堂讨论（IOmin）一课堂小结（3min）一作业布置（2min）教学过程主要教学内容及步骤设计意图第一节课课前任务【教师】布置课前任务，和学生负责人取得联系，让其提醒同学通过APP或其他学习软件，预习本节课要学习的知识【学生】完成课前任务通过课前任务,使学生预习本节课要学习的知识,增加学生的学习兴趣考勤(2min)【教师】使用APP进行签到【学生】班干部报请假人员及原因培养学生的组织纪律性,掌握学生的出勤情况问题导入（5min）【教师】提出以下问题：王多多完成了商品图片的美化工作，接下来开始设计网店页面中的各个部分，包括商品主图、海报和短视频等。那么，什么是商品主图？【学生】聆听

3、、思考、举手回答通过问题导入，弓I导学生主动思考,激发学生的学习兴趣传授新知（15min）【教师】通过学生的回答引入要讲的知识，讲解商品主图的相关知识5.1.1商品主图简介【教师】通过多媒体展示“搜索结果中的商品主图”和“商品详情页中的商品主图”图片（详见教材），并进彳亍并解狭义的商品主图是指消费者用电商平台的搜索功能搜索关键字后在搜索结果中显示的商品图片，通常此图也是商品详情页顶部左侧显示的第Tl国图片。*【教师】提出以下问题，随机邀请学生进行回答商品主图能够起到什么作用？通过教师讲解和课堂讨论等方式,使学生了解商品主图的概念、构图方式，以及服装配饰类商品主图的内容安排等相关知识【学生】聆听

4、、思考、回答+【教师】总结学生的回答优质的商品主图能起到吸引消费者眼球，使消费者对商品产生兴趣，从而促成点击的作用。商品主图通常带有放大镜功能，尺寸一般在700像素x700像素以上(大多为800像素X800像素)，大M于5(X)kB,多使用JPG或PNG格式。【知识锥接】商广义的商品主图是指商品详情页顶部左侧显示的所有图片.5.1.2 商品主图的构图方式【教师】提出以下问题，随机邀请学生进行回答商品主图中一般包括哪些内容？【学生】聆听、思考、回答【教师】总结学生的回答商品主图中通常包括图片、文案和背景等元素，在设计商品主图时应根据图片和文案选择合适的构图方式，使画面中的各元素相互呼应并达到平衡

5、.计【教师】通过多媒体展示“沉底式构图”左右式构图”“灵活运用式构图”图片(详见教材)，并进行讲解商品主图常见的构图方式有以下几种。(1)沉底式：是指将图片或大量文案置于画面底部，使画面头轻脚重”的构图方式。这是商品主图最常用的一种构图方式，能获得舒适的画面效果.(2)左右式：是指画面的一侧放置文案，另一侧放置图片的构图方式.采用这种构图方式的画面看起来非常有层次感。(3)灵活运用式：是指不拘泥于一种固定形式,而是根据商品位置调整文案摆放位置，从而形成协调融洽的画面效果的构图方式。【知识链接】一些商品主图会沿用商品图片的构图方式，然后在图片的左上角或右上角加入品牌标志。另外，设计商品主图时，要

6、避免画面凌乱、主题混乱、字体风格与文案内容背离、颜色搭配失衡、装饰图案烦琐等问题.5.1.3 服装配饰类商品主图的内容安排*【教师】提出以下问题，随机邀请学生进行回答服装配饰类商品主图中一般会安排什么内容？【学生】聆听、思考、回答【教师】总结学生的回答在设计服装配饰类商品主图时，通常会安排以下内容。(1)商品图片：这是商品主图必不可少的一部分，用以展示商品的外观，让消费者快速了解商品。(2)品牌标志：可以让消费者在了解商品的同时提高对品牌的关注度.【课堂思政】讲述“治国重器”的内容(详见教材)，进行课堂思政，让学生了解知识产权的相关知识(3)卖点：可以让消费者了解商品的亮点。(4)优惠信息：能

7、吸引消费者注意，从而促成点击.【学生】聆听、思考、记录任务实施(23min)【教师】讲解设计针织杉主图的具体步骤，并要求学生以小组为单位完成相关任务【教师】组织学生扫码观看”设计针织杉主图”视频(详见教材)，让学生对设计过程有一个大致地了解1.设计思路(1)内容安排：选择由模特展示的针织衫图片，让消费者直观地了解针织衫的实际穿着效果；添加品牌标志，加深消费者对品牌的认识;加入卖点和优惠信息，让消费者对针织杉产生浓厚的兴趣。(2)配色分析：用白色作为文案的主色，能与图中针织衫的颜色相呼应；将优惠价文案的颜色单独设置为黄色，不仅醒目，可让消费者快速捕捉关键信息，还与图中的黄色元素(如模特的发色)相

8、呼应，使画面效果更加和谐。【教师】通过多媒体展示“针织衫主图效果”图片(详见教材)，并随机邀请学生进行回答针织衫使用哪种构图方式1：匕较好呢，为什么?【学生】聆听、思考、回答【教师】总结学生的回答(3)构图方式：采用左右式构图，且文案浮于图片上方，使画面极具层次感。【教师】让学生分组讨论设计思路【学生】组内讨论、确定思路、由小组代表发表讨论结果【教师】点评、总结各组的发言2.设计步骤【教师】演示并讲解设计步骤及具体操作步骤1启动Photoshop2020,按“Cw+N”组合键打开,、新建文档”对话框，在其中设置相关参数后，单击“创建按钮创建文档。选择“文件一”置入嵌入对象”菜单项，打开“置入嵌

9、入的对象”对话框，从中选择本书配套素材“素材与实例”一“项目5”-“针织衫”文件夹中的“IMG_9340.jpg”文件，单击,置入,，按钮置入图片。在图片上右击，从弹出的快捷菜单中选择“水平翻转”项,然后调整图片大小并将其移至合适位置,最后按“Enter”通过设计针织衫主图任务,帮助学生熟悉服装配饰类商品主图的设计流程和设计方法键确认。步骤2选择“矩形工具”，在图像编辑区左侧单击，在打开的创建矩形”对话框中设置矩形大小后单击“确定按钮,然后在工具属性栏中设置填充色为黑色，描边为无，最后在“图层面板的“不透明度”编辑框中输入“30%”，并按“Enter，键确认设置矩形的不透明度。【知识链接】描边

10、色的设置方法和填充色的设置方法相同。步骤3采用步骤2的方法绘制一个宽度为260像素、高度为50像素的黑色矩形，并设置其图层不透明度为“50%”。步骤4选择“横排文字工具”，然后在工具属性栏设置相关参数，接着在步骤3创建的矩形左侧单击，当出现闪烁的“时，输入文本“NEW2022”，并按“Esc”键结束输入。步骤5采用步骤4的方法添加其他文本并设置文本属性，如图所示。在文本“8”后单击插入光标，按住鼠标左键并向左拖动直至选中文本“198”，然后在工具属性栏设置字体大小为“48点”，接着设置前景色为黄色(#fNC(M),此时选中的文本自动变为黄色，最后按“Esc，键确认.【课堂思政】讲述“世界上最美

11、的文字中文”的内容(详见教材)，并进行课堂思政，增强学生的民族自家感，坚定文化自信步骤6双击“秋季新品图层空白处，在打开的“图层样式”对话框中单击并勾选“投影,复选框，然后在对话框右侧设置相关参数，为其添加投影图层样式。步骤7在“秋季新品”图层上右击从弹出的快捷菜单中选择“拷贝图层样式”项，然后在“镂空时尚系列”图层上右击，从弹出的快捷菜单中选择“粘贴图层样式”项，为“镂空时尚系列文本也添加投影图层样式。利用“图层样式”对话框为“限时198元”文本添加内发光图层样式。至此，针织衫主图制作完成。【知识链接】如果要让多个图层按照一定的方式对齐或分布,可在选择“移动工具的情况下，单击工具属性栏中的对

12、齐与分布按钮.【学生】聆听、观看、理解、记忆【教师】让学生分组进行设计【学生】组内分工，根据本组的设计思路完成设计主图任务【教师】巡堂辅导、答疑解惑【学生】设计完成后，由小组代表展示本组设计的商品主图【教师】与学生一起评选出最佳商品图片第二节课问题导入(5min)【教师】提出以下问题：数码电器类商品主图中应安排哪些内容？通过问题导入，弓I导学生主动思考，激发学生的学习兴趣【学生】聆听、思考、举手回答【教师】总结学生的回答数码电器类商品主图中除了放置商品图片、品牌标志、卖点、优惠信息外，通常还会放置赠送信息，以吸引消费者点击观看。任务实施(25min)【教师】讲解设计移动硬盘主图的具体步骤，并要

13、求学生以小组为单位完成相关任务【教师】组织学生扫码观看“设计移动硬盘主图”视频(详见教材)，让学生对设计过程有一个大致地了解1.设计思路(I)内容安排：选择灰白色几何背景，以增加画面的科技感；添加移动硬盘斜侧角度图片，以便于消费者从多角度了解移动硬盘的外观；添加品牌标志，加深消费者对品牌的认识；加入卖点、优惠和赠送信息，以吸引消费者注意。(2)配色分析：用品牌标志颜色(红色)作为文案颜色或文案底图颜色，既可以获得和谐统一的画面效果,又可以引导消费者识别品牌。(3)构图方式：采用左右式构图，可以获得具有一定平衡感的画面。【教师】让学生分组讨论设计思路【学生】组内讨论、确定思路、由小组代表发表讨论

14、结果【教师】点评、总结各组的发言2.设计步骤【教师】演示并讲解设计步骤及具体操作步骤I打开本书配套素材素材与实例一项目5一移动硬盘文件夹中的移动硬盘主图背景jpg文件，然后置入IMG_9547.jpg文件，调整其大小并移至合适的位置后按Emer键确定。步骤2选择魔棒工具，在工具属性栏设置容差为50”,然后单击移动硬盘图片的白色背景，接着按住Alt键的同时单击图层面板底部的“添加图层蒙版按钮，抠取移动硬盘。步骤3按Cm+J组合键拷贝移动硬盘图层，然后按Ctrl+T组合键调出变换框并右击，从弹出的快捷菜单中选择“垂直翻转”项，接着按住Shift”键的同时将拷贝的移动硬盘向下拖动至其顶点与原移动硬盘

15、的底点重合后释放鼠标，按住“Ctrl键的同时移动变换框左上角的角点，直至拷贝的移动硬盘的顶边与原移动硬盘的底边重合后释放鼠标，并按Enter键确认，最后按“Ctrl+【组合键将该图层下移一层。步骤4在拷贝的移动硬盘图层上右击，从弹出的快捷菜单中选择栅格化图层”项，然后在其图层蒙版缩览图上右击，从弹出的快捷菜单中选择应用图层蒙版项.再为其添加一个图层蒙版，选择渐变工具，单击工具属性栏的，在打开的渐变编辑器”对话框中选择基础”设置项下的黑，白渐变，单击确定按钮，最后在图像编辑区自下而上拖动鼠标，移动硬盘倒影效果即制作完成。通过设计移动硬盘主图任务，帮助学生熟悉数码电器类商品主图的设计流程和设计方法步骤5选择圆角矩形工具”，在工具属性栏设置半径为50像素，然后在图像编辑区单击，在打开的创建矩形”对话框中设置圆角矩形的宽度为350像素、高度为80像素,接着在工具属性栏设置填充色为红色(#e60005),描边为无.将光