网页设计与制作 教案（第4周）

课程名称：网页设计与制作主备人：审核人：第1页网页设计与制作教案（第4周）专业课程学习任务项目3：掌握网页中处理图像时的抠图技巧任务1掌握规则形状抠图任务2掌握简单背景抠图任务3掌握复杂图形抠图课时6教学对象授课时间设计者一、学习任务分析1．掌握网页中对图像的抠图方法。2．教材中的知识与案例均是从实际工作中精选而来，具有很强的应用性和示范作用。同时教材结构清晰、内容翔实、语言浅显易懂，并配以精美的素材图片。二、学情分析对于刚刚接触网页设计的学生，思想活跃，有探索新知识的强烈心理，专业课的学习，除需要一定专业基础外，还需要学生具有很强的技能操作能力，所以在本次课的讲授中，采用演示、引导、任务练习的方法，让学生了解所学的内容。三、学习目标知识目标：掌握在制作网页前为图像抠图的方法。能力目标：学会为规则图像进行抠图。学会为简单背景进行抠图。学会为复杂图形进行抠图。素质目标：不忘初心，坚持使命。在为图像进行抠图学习中，充分了解动手操作的重要性。四、教学策略重点难点：重点：快速对图像进行抠图；难点：掌握复杂图像的抠图方法。教学方法：演示与案例教学法。教学模式：分组讨论，集中点评，共同提高。五、教学环境及资源准备教学环境：多媒体实训室课前准备：1.对应本节课制作了相应的备课。2.认真设计教案、课件和教学过程。六、教学过程教学环节教学内容教师活动学生活动设计意图情景描述上课，同学们好！（相互问好！）7S管理组织教学。课前3分钟：你们是真正的女汉子，你们的辛劳和智慧，证明了巾帼可胜须眉。男儿当自强，相信男孩子都不甘在学习上示弱。复习提问：一、对于上节课中瑕疵图像修复都有哪些方法？7S管理组织教学、统计出勤；课前3分钟教育；进行复习提问，让学生进入思考状态。以小组为团体回答，并加分。使学生注意力集中积极思考，积极回答问题。7S管理形成习惯，巩固知识，增强团队意识。引导问题网页设计中的图像处理环节，抠图是一项不可避免的操作，无论是为单一的图像替换背景，还是为一系列的图像统一背景，这些都需要对图像本身进行抠图来完成。如果是制作网页中图像的合成广告就更少不了抠图了。为此，小艾想使用比较专业的软件对处理中的抠图进行处理，而同事凯程告诉她，Photoshop就是一个在抠图方面具有非常专业的抠图功能，在抠图方面可以将其分为规则形状抠图、简单背景抠图、复杂图形抠图、毛发抠图和半透明图像抠图等操作。接下来，大家可以跟随小艾一起走进Photoshop的抠图环节。大家可以在本节中了解各种抠图方法将拍摄的图像进行背景替换，使图像本身更加凸显，在网页视觉中引起买家的注意力，从而间接的增加销量。引出本节重点内容，注意培养学生的观察力和注意力。学生跟随老师的讲解和启发进入内容，积极思考。通过导入问题,让学生分小组思考。相关知识介绍任务1掌握规则形状抠图拍照后想将局部区域整体移动到自己喜欢的背景中，就要掌握控图的操作。为图片进行规则几何抠图可分为圆形与矩形。对于规则现状进行抠图时，常用的工具就是选区工具中的矩形选框工具和椭圆选框工具活动1掌握矩形抠图矩形抠图首先要进行选区的创建，在Photoshop中常用来创建矩形选区的工具有矩形选框工具，矩形选框工具使用方法是在图像中按住鼠标向对角拖动松开鼠标即可创建选区，如图所示，主要应用在对图像选区要求不太严格的图像中。活动2掌握正圆抠图正圆抠图首先要进行选区的创建，在Photoshop中常用来创建正圆选区的工具有椭圆选框工具，使用方法与矩形选框工具类似，如图所示。选区创建完毕后，将选区内的图像拖曳到新文档中即可完成抠图。任务2掌握简单背景抠图对于拍摄的照片进行抠图时，如果背景色是单色时，抠图时可以使用魔术橡皮擦，快速选择工具、对象选择工具和魔棒工具，以上的四种工具可以通过智能运算的方式进行图像的选取。活动1掌握魔术橡皮擦抠图使用魔术橡皮擦工具可以快速去掉图片的背景。该工具的使用方法非常简单，只要选择要清除的颜色范围，单击即可将其清除，删除背景色后的图片可以直接拖曳到新背景图片中，如图所示。活动2掌握快速选择工具抠图使用快速选择工具可以快速在图像中对需要选取的部分建立选区，使用方法非常简单，只要选择该工具后，使用指针在图像中拖动即可将鼠标经过的地方创建选区，选区创建完毕后，将选区内的图像拖曳到新文档中完成抠图，如图所示。活动3掌握对象选择工具抠图使用对象选择工具创建选区时，是非常方便的一个工具，在在需要选取的范围上大致创建一个选取范围，可以是矩形选区，也可以是不规则选区，松开鼠标后即可将需要的内容进行选择，选区创建完毕后可以将其进行色相的调整以此来改变色调，如图所示。活动4掌握魔术棒工具抠图使用魔棒工具能选取图像中颜色相同或相近的像素，像素之间可以是相连的也可以是不连续的。通常情况下使用魔棒工具可以快速创建图像颜色相近像素的选区，创建选区的方法非常简单，只要在图像中某个颜色像素上单击，系统便会自动以该选取点为样本创建选区，反选选区后可以移动图像到新背景中，如图所示。任务3掌握复杂图形抠图拍摄对象的类型不同形状也会有所不同，对于不规整形状的宝贝进行抠图时，就需要使用一些操作比较复杂的工具来完成，本小节为大家介绍一下磁性套索工具、多边形套索工具和钢笔工具在抠图时的使用方法。活动1掌握多边形套索工具抠图多边形套索工具通常用来创建较为精确的选区。创建选区的方法也非常简单，在不同位置上单击鼠标，即可将两点以直线的形式连接，起点与终点相交时单击即可得到选区，如图所示。活动2掌握磁性套索工具抠图磁性套索工具可以在图像中自动捕捉具有反差颜色的图像边缘，并以此来创建选区，此工具常用在背景复杂但边缘对比度较强烈的图像中。创建选区的方法也非常简单，在图像中选择起点后沿边缘拖动即可自动创建选区，如图所示。活动3掌握钢笔工具抠图使用钢笔工具可以精确地绘制出直线或光滑的曲线，还可以创建形状图层。该工具的使用方法也非常简单。只要在页面中选择一个点单击，再移动到下一点单击，就会创建直线路径；在下一点按下鼠标并拖动会创建曲线路径，按”Enter”键绘制的路径会形成不封闭的路径；在绘制路径的过程中，当起始点的锚点与终点的锚点相交时，鼠标指针会变成形状，此时单击鼠标，系统会将该路径创建成封闭路径。1创建路径使用钢笔工具可以绘制直线路径、曲线路径和封闭路径，在文档中选择钢笔工具后，在页面中选择起点单击移动到另一点后再单击，会得到如图3-28所示的直线路径；选择钢笔工具后，在页面中选择起点单击移动到另一点后按下鼠标拖动，会得到如图3-29所示曲线路径；在页面中选择起点单击移动到另一点后按下鼠标拖动，松开鼠标后拖动到起始点单击会得到如图所示封闭路径。2路径转换为选区通过钢笔工具创建的路径是不能直接进行抠图的，此时我们只要将创建的路径转换为选区，就可以应用移动工具将选区内的图像移动到新背景中完成抠图，在Photoshop中将路径转换为选区的方法很简单，可以是直接通过按Ctrl+Enter键将路径转换为选区；还可以通过“路径”面板中的“将路径作为选区载入”按钮将路径转换为选区；如果在Photoshop2022中可以直接在“属性栏”中单击“建立选区”按钮将路径转换为选区；或者在“弹出”菜单中执行“建立选区”命令，将路径转换为选区，如图所示。课件设疑，引起注意，牢牢抓住和吸引学生探究新知识的心理。讲练结合，突出实操能力培养。跟随老师进入思考分析状态。认真完成操作任务。通过课件引出问题，演示法和指导法，使学生掌握知识点。提高学生操作能力。分组讨论组织学生分小组讨论引导问题，保证人人有任务，人人有活干。评分项目评分指标标准分评分仪态举止是否得体0.5准备准备是否充分0.5语言声音是否洪亮、表达是否准确0.5小组配合组分工是否明确，配合是否默契0.5小计2分配小组长任务。通过引导问题，学生进行分析、思考。各个小组分配任务进行讨论问题。达到培养学生分工合作和查找资料能力。小组展示各小组派代表上黑板前展示自己小组引导问，由全班同学找出问题并由小组代表进行解答。展示并解答问题。学生展示讨论成果，回答问题。锻炼学生表达能力和仪表。锻炼学生表达能力和仪表。全班查找问题。课堂总结找最优秀小组讲解设计中的注意事项，并由教师点评总结设计注意事项，并分组点评各组优缺点。总结点评设计情况，并归纳知识点。学生总结所学知识，积极回答问题。学生掌握知识。布置作业一、练习钢笔工具为帽子进行抠图布置作业，并讲解具体要求。记录并在课下思考问题，主动学习。培养学生学习能力。便于下次课进行。七、教学评价设计通过小组自我评价、小组评价、教师评价完成对小组进行评价，教师和组长对成员进行评价，回答问题加1分；演示操作加