《制作水晶按钮》教案.docVIP

《制作水晶按钮》教案 课题名称 制作水晶按钮 建议课时 2课时（建议两节连堂） 教学目标 知识目标 1. 了解按钮的基本常识和设计原则； 2. 掌握按钮的制作方法； 3. 熟练应用图层样式。 能力目标 培养学生的动手实践能力和创新能力。 德育目标 业精于勤，荒于嬉；行成于思，毁于随。——韩愈 教学重点 掌握制作水晶按钮设计制作方法 教学难点 图层样式的设置 任务介绍 本任务是制作水晶按钮，如下图所示。 本任务主要学习水晶效果在按钮上的应用，以达到更加生动、有趣、诱人单击的效果。 教学过程 学生活动 教师活动 创设情境 融入情境，产生完成本任务的欲望。 创设一个真实的项目情境，激发学生完成本任务的兴趣。在本“任务情境”的基础上，使用投影，展现本任务完成效果图，激发学生兴趣与完成的欲望。 任务分析 学生小组讨论，如何完成任务。 向学生展示任务效果图，要求学生结合自身知识与技术储备，完成本任务还需要哪些知识与技术支持，找出自己不能完成的内容。 在学生讨论的基础，教师有针对性引导学生，将需要解决的问题收集、整理出来。 任务实施 参照教材中“任务实施”，尝试操作，实施任务。当遇到困难时，向老师或同学们进行请教。 学生在操作的过程中，教师要适时巡查，发现问题，引导学生解决。同时，鼓励小组同学之间相互帮助，积极交流，解决问题。 典型引导 解决问题 阅读教材，尝试操作，掌握新知。 引导学生参照教材的“知识准备”，了解按钮的基本常识、设计原则等理论知识。 展示评价 首先自评，然后小组评价。 教师点评，引导学生相互交流学习。 拓展探索 设计制作个人网站导航条。 教师根据实际情况，有针对性示范操作。评价作品，将评价结果反馈给学生。 附件： 任务实施步骤： 1．启动Photoshop CS5，选择 “文件”→“新建”菜单命令，新建一个大小为510×180像素，分辨率为72，颜色模式为RGB颜色，背景内容为白色的文件，并将其命名为“水晶按钮”，如题8-8所示。把背景填上黑色。 图8-8 新建文件 2．新建图层（Ctrl+Shift+N），将其命名为“大阴影”，如图8-9所示。 图8-9新建图层“大阴影” 3．绘制圆角矩形。选择“圆角矩形”工具，设置其半径18px，固定大小大小为361px×96px，如图7-10所示。按Ctrl+Enter键把路径转换为选区，选择矩形选框工具，选择从选区减去，把圆角矩形下面的圆角减去，如图7-11所示。并自下向上垂直填充从前景色（黑）到背景色（白）渐变色，效果如图7-12所示。 图8-10绘制圆角矩形 图8-11选区减去绘制大阴影 图8-12添加渐变 4．绘制背景图层。新建一个图层，将其命名为“背景”。然后按住ctrl点击大阴影图层缩略图获取该图层选区，设置前景色绿色（#003920），按Alt+Delete为“背景”层填充前景色，并向下移动3个像素，效果如图8-13所示。 图8-13 编辑阴影图层 5．制作按钮高光 （1）新建图层名为“上部分”，获取“阴影”图层选区，选择矩形选框工具，如图8-14所示，确认选项栏上选中的是“从选区减去”，将下半部分减去，效果如图8-14（a）、8-15（b）所示。 图7-14 设置矩形选框工具 图8-15(a) 减去选区，绘制上部分 图8-15(b) 上部分最终选区 （2）设置渐变叠加，在图层面板中双击“上部分”图层缩略图，设置其图层渐变叠加样式，如图8-16（a）、8-16（b）所示，填充效果如果8-16（c）。 图8-16（a）设置渐变叠加 图8-16（b）设置渐变条 图8-16（c） 填充效果 6．制作“下部分”效果。 （1）新建图层名为“下部分”，绘制椭圆选区，如图8-17所示。 图7-17 绘制椭圆选区 （2）选择从“选区减去”，减去效果如图8-18所示。选择选择“修改—羽化”菜单命令，羽化值为3，填充颜色为（#959c1b），效果如图8-19所示。 图8-18 减去选区 图8-19填充颜色 （3）设置图层样式。添加投影、斜面浮雕图层样式，投影参数如图8-20所示，斜面浮雕参数如图8-21所示图层样式，效果如图8-22所示。 , 图8-20投影参数 图8-21斜面浮雕参数 图8-22 图层样式效果 8．新建图层名为“底阴影”，选择椭圆选框工具，绘制椭圆选区，设置其羽化值为8，水平方向添加渐变（两端#6c6813，中间#d0c615），渐变设置如图8-23（a）所示，填充效果如图8-23（b）所示， 并将其置于阴影图层下方，效果如图8-24所示。 图8-23(a) 渐变设置 图8-23(b) 填充效果 图8-24 底阴影编辑 7．选择横排文字工具，输入文字“下载”，字符属性如图8-