《商品信息采编》教案第18课设计数码电器类和珠宝首饰类商品详情页.docx

课题设计数码电器类和珠宝首饰类商品详情页课时2课时(90min)教学目标知识技能目标：(1)了解数码电器类和珠宝首饰类商品详情页的模块安排(2)能够完成数码电器类和珠宝首饰类商品详情页的设计工作素质目标：感受中国传统手工艺的魅力，为留住手艺、传承匠心贡献一分力量教学重睚点教学重点：数码电器类和珠宝首饰类商品详情页的设计教学难点：数码电器类和珠宝首饰类商品详情页的设计教学方法问答法、讨论法、腿法、实践法教学用具电脑、投影仪、多媒体课件、教材教学设计第1节课：课前任务一考勤(2min)一问题导入(5min)T任务实施(28min)T课堂讨论(】()min)第2节课：问题导入(3min)一任务实施(27min)一课堂讨论(10min)一课堂小结(3min)一作业布置(2min)教学过程主要教学内容及步骤设计意图第一节课课前任努【教师】布置课前任务，和学生负责人取得联系，让其提醒同学通过APP或其他学习软件，预习本节课要学习的知识【学生】完成课前任务通过课前任务,使学生预习本节课要学习的知识,增加学生的学习兴趣考勤(2min)【教师】使用APP进行签到【学生】班干部报请假人员及原因培养学生的组织纪律性,掌握学生的出勤情况问题导入(5min)【教师】提出以下问题：数码电器类商品详情页中应安排些什么内容？【学生】聆听、思考、举手回答【教师】总结学生的回答数码电器类商品详情页中除了要安排宣传或促销、卖点等模块外，一些大件商品还会安排售后服务模块，让i肖费者买得放心、安心。【知识链接】一些网店还会在商品详情页安排一个用于展示营业许可的模块来提升消费者对品牌的信任度。通过问题导入，弓I导学生主动思考,激发学生的学习兴趣任务实施(28min)【教师】讲解设计移动硬盘详情页的具体步骤，并要求学生以小组为单位完成相关任务÷【教师】组织学生扫码观看“设计移动硬盘详情页”视频(详见教材)，让学生对设计过程有一个大致地了解通过设计移动硬盘详情页任务,帮助学生熟悉设计数码电器类商品详情页的流程和方法1 .设计思路（1）模块安排：页头安排宣传内容，以吸引消费者注意；接下来的三个模块均安耳醪动硬盘的卖点，让消费者深入了解移动硬盘及其特点；最后两个模块分别安扫暗动硬盘详细信息和套餐内容，让消费者全面了解移动硬盘。（2）配色分析：移动硬盘图片多为灰色调，采用白色背景和黑色、灰色文案，能打造具有高级感的画面效果，而一些图标、线条使用品牌标志颜色（红色），既可以引导消费者识别品牌，又可以丰富画面效果，为画面增添活力。【教师】提出以下问题，随机邀请学生进行回答移动硬盘详情页的布局方式应该使用哪一种布局？为什么？【学生】聆听、思考、回答【教师】总结学生的回答，井通过多媒体展示“移动硬盘详情页效果”图片（详见教材）（3）布局方式：采用层叠布局方式，可以增加画面的层次感。【教师】让学生分组讨论设计思路【学生】组内讨论、确定思路、由小组代表发表讨论结果【教师】点评、总结各组的发言2 .设计步骤1）制作宣传模块【教师】演示并讲解设计步骤及具体操作步骤1新建一个名为"移动硬盘详情页"，宽度为750像素，高度自定，分辨率为72像素/英寸,颜色模式为RGB模式的文档。步骤2置入本书配套素材"lMG_9759.jpg"文件，并调整其大小和位置，然后打开项目5中制作的"移动硬盘主图.p$d"文件，选中标志所在图层，将其复制到"移动硬盘详情页”文档中，最后在标志下方添加文本和矩形装饰。需要注意的是，移动硬盘图片有些发灰，需用CameraRaw滤镜调整其对比度（在“基本”设置项下的“对比度”编辑框中输入"40"）.步骤3用“椭圆工具"电制一个宽度为60像素、高度为60像素的正圆，然后设置其填充为无，描边色为红色，描边宽度为I像素，最后在其内部和下方添加文本.步骤4复制步骤2中制作的图标并修改内容，然后用"直线工具"在图标之间添加竖线.【小提示】需要注意的是，PhOtoShOP提供智能参考线，在移动对象时会自动显示，因此，移动复制的图标时要充分利用智能参考线，让图标之间间距相等。【学生】聆听、观看、理解、记忆【教师】让学生分组进行制作【学生】组内分工，根据本组的设计思路完成制作宣传模块任务【教师】巡堂辅导、答疑解惑2）制作卖点模块【教师】演示并讲解设计步骤及具体操作步骤1创建第一个卖点模块标题（后续大部分文本所用的字体样式、大小与此相同，以下不再赘述），然后在标题下方添加正文并放置本书配套素材"IMG_9766.jpg”文件.步骤2创建第二个卖点模块标题并添加矩形装饰，然后在标题下方添加正文，右侧放置本书配套素材"IMG_9538.jpg""IMG_9553.jpg"文件，并为移动硬盘标注尺寸，接着绘制一个宽度为682像素、高度为452像素的矩形，并设置其填充为无，描边色为浅灰色（#c9caca）,描边宽度为2像素，最后在矩形偏左上方放置本书配套素材"IMG_9772.jpg"文件。步骤3采用步骤I的方法制作卖点模块3.【学生】聆听、观看、理解、记忆【教师】让学生分组进行制作【学生】组内分工，根据本组的设计思路完成制作卖点模块任务【教师】巡堂辅导、答疑解惑3）制作商品信息和套餐模块【教师】演示并讲解设计步骤及具体操作步骤I绘制矩形装饰，并在其中添加本书配套素材"IMG_9545.jpg"文件和文本。步骤2用"直线工具"在文本"容量"和"尺寸"之间绘制直线，然后在工具属性栏设置描边色为浅灰色（#c9caca）,描边宽度为2像素，在"设置形状描边类型”下拉面板中选择虚线类型。步骤3复制步骤2中绘制的虚线装饰并移至其他文本之间。【小提示】如果虚线效果不理想，可单击”设置形状描边类型"下拉面板中的”更多选项”按钮,在打开的"描边”对话框中设置虚线的间隙。步骤4首先创建套餐模块标题，然后置入本书配套素材"IMG_9776.jpg"文件，接着用“直线工具"和"椭圆选框工具"绘制指示器，最后添加标注文本。至此，移动硬盘详情页制作完成。【学生】聆听、观看、理解、记忆【教师】让学生分组进行制作【学生】组内分工，根据本组的设计思路完成制作商品信息和套餐模块任务【教师】巡堂辅导、答疑解惑【学生】制作完成后，由小组代表展示本组设计的商品详情页图片【教师】与学生一起评选出最佳的商品详情页课堂讨论(10min)【教师】组织学生分组讨论音响详情页的设计思路参照以下提示梳理音响详情页的设计思路。(1)确定模块安排：确定音响详情页中安排哪些模块，并根据模块安排确定具体内容，包括图片和文案。需要注意的是，在卖点模块中可放置使用场景图及相关文案，以表现其可随处安放的特点。(2)确定配色方案：此款音响详情页的配色方案可参考移动硬盘详情页的配色方案.(3)确定布局方式：根据模块及模块中的元素安排选择合适的布局方式。【学生】组内讨论、确定思路、由小组代表发表讨论结果【教师】点评各组的发言通过小组讨论,帮助学生进一步巩固所学知识第二节课问题导入(3min)【教师】提出以下问题：珠宝首饰类商品详情页中应设计哪些模块？【学生】聆听、思考、举手回答【教师】总结学生的回答珠宝首饰类商品详情页中除了要安排宣传或促销、搭配、卖点等模块外，通常还会安排工艺和包装等模块，以展示商品的附加值.通过问题导入，弓I导学生主动思考，激发学生的学习兴趣任务实施(27min)【教师】讲解设计项链详情页的具体步骤，并要求学生以小组为单位完成相关任务÷【教师】组织学生扫码观看”设计项链详情页”视频(详见教材)，让学生对设计过程有一介大致地了解1.设计思路(1)模块安排：页头安排宣传内容，吸引消费者注意；接下来安排卖点模块，让消斐者了解项链的特点；最后两个模块分别展示项链佩戴效果和项链详细信息,让消费者全面、深入地了解项链.(2)配色分析：用白色作为背景颜色，用黑色和不同深浅的灰色作为文案颜色，能使整个页面呈现出干净、大气，又极具层次感的效果。此外，一些地方用蓝色线条和色块作装饰，能丰富页面色彩，避免画面显得单调。÷【教师】提出以下问题，随机邀请学生进行回答哪一种布局方式更适合项链详情页？*【学生】聆听、思考、回答÷【教师】总结学生的回答，并通过多媒体展示“项链详情页效果”图片(详通过设计项链详情页任务，帮助学生熟悉设计珠宝首饰类商品详情页的流程和方法见教材）（3）布局方式：采用层叠和错位布局方式，可以增强画面的层次感和动感.【教师】让学生分组讨论设计思路【学生】组内讨论、确定思路、由小组代表发表讨论结果【教师】点评、总结各组的发言2.设计步骤1）制作宣传模块【教师】演示并讲解设计步骤及具体操作步骤I新建一个名为“项链详情页"，宽度为750像素，高度自定，分辨率为72像素/英寸，颜色模式为RGB模式的文档。步骤2置入本书配套素材"IMG_9622.jpg"文件，然后将其转换为普通图层，接着用"矩形选框工具"框选图片底部多余背景，并按"Delete"键删除。框选图片顶部背景，并用变换工具调整所选区域的高度，最后按"Ctrl+D"组合键取消选区。步骤3在图片上添加文本。其中，mYOURETHEONLYONE"文本需添加下划线（单击"字符"面板底部的“下划线"按钮添加）。【学生】聆听、观看、理解、记忆【教师】让学生分组进行制作【学生】组内分工，根据本组的设计思路完成制作宣传模块任务【教师】巡堂辅导、答疑解惑2）制作卖点模块【教师】演示并讲解设计步骤及具体操作步骤1先创建卖点模块标题，然后新建一个图层，用“矩形选框工具"绘制一个宽度为664像素、高度为3像素的矩形选区，并为其填充浅灰色（#f5f5f5）,最后按"Qrl+D”组合键取消选区。步骤2首先新建一个图层，然后绘制一个宽度为345像素、高度为300像素的矩形选区，并为其填充浅蓝色（#eef4fe）,接着按"Cirl+D”组合键取消选区，最后拷贝矩形并移至合适的位置，为其填充白色、添加描边图层样式。步骤3置入本书配套素材"IMG_9581.jpg"文件（保证其在复制矩形图层的上方），按住“All"键的同时将光标移至该图层与复制矩形图层之间，当光标呈状时单击创建剪贴蒙版。步骤4在图片右侧添加文利口线条装饰，然后在文本左侧添加一个宽度为5像素、高度为85像素的浅蓝色（#eef4fe）矩形装饰。÷【教师】提出以下问题，随机邀请学生进行回答在PS软件中，复制图层有哪些方法？÷【学生】聆听、思考、回答+【教师】总结学生的回答步骤5复制两份步骤2至步骤4创建的图层，并调整位置、修改内容。【学生】聆听、观看、理解、记忆【教师】让学生分组曲询作【学生】组内分工，根据本组的设计思路完成制作卖点模块任务【教师】巡堂辅导、答疑解惑3)制作商品展示和商品信息模块【教师】演示并讲解设计步骤及具体操作步骤I复制卖点模块标题并修改内容。步骤2置入本书配套素材"IMG_7121.jpg""IMG_7122.jpg""IMG_7124.jpg"文件并放在合适的位置，然后用CameraRaw滤镜调整图片的影调和细节，使其与整体页面效果协调统一。步骤3在图片下方添加文本并设置其字体样式为"方正北魏楷书简体"，字体大小为T8点"，行距为"36点”.步骤4复制商品展示模块标题并修改内容.步骤5新建一个图层，然后绘制一个宽度为66像素、高度为2()像素的矩形选区，并为其填充蓝色(#69a3d8),最后在相应的位置添加文本。步骤6复制九份步骤5中创建的图层并修改内容。至此，项链详情页制作完成.【学生】聆听、观看、理解、记忆【教师】让学生分组进行制作【学生】组内分工，根据本组的设计思路完成制作商品展示和信息模块任务【教师】巡堂辅导、答疑解惑【学生】制作完成后，由小组代表展示本组设计的商品详情页图片【教师】与学生一起评选出最佳的商品详情页课堂讨论(10min)【教师】组织学生分组讨论手表详情页的设计思路参照以下提示梳理手表详情页的设计思路。(1)确定模块安排：确定手表详情页中安排哪些模块，并根据模块安排确定具体内容，包括图片和文案。(2)确定配色方案：该款手表的目标消费者为女性，因此配色可以亮色调、暖色调为主，使整个页面充满女性气息.(3)确定布局方式：根据模块及模块中的元素安排选择合适的布局方式。【学生】组内讨论、确定思路、由小组代表发表讨论结果通过小组讨论，帮助学生进一步巩固所学知识【教师】点评各组的发言课堂小结(3min)【教师】简要总结本节课的要点本节课学习了设计数码电器类和珠宝首饰类商品详情页的相关知识，同时通过具体的设计任务，帮助大家熟悉了这两类商品详情页的设计方法，希望大家在课下多加复习，巩固所学知识，能够完成数码电器类和珠宝首饰类商品详情页的设计工作。【学生】总结回顾知识点总结知识点，巩固学生对设计数码电器类和珠宝首饰类商品详情页相关知识的印象作业布置(2min)【教师】布置课后作业完成任务6.2和任务6.3中"任务实训的相关活动。【学生】完成课后任务通过课后作业复习巩固学到的知识，提高实际操作能力教学反思这节课整体节奏较好，但学生主动提问较少。教学中，教师应由传统的知识传授者转变为学生学习的组织者；教师要成为学生学习活动的引导者，而不再是主导者；教师应从"师道尊严"的架子中走出来，成为学生学习的参与者，师生合作学习，共同进步。