logo

您所在位置网站首页 > 海量文档  > 理工科 > 机械/制造

Photoshop项目实践教程教学模块八.pptx 49页

本文档一共被下载: ,您可全文免费在线阅读后下载本文档。

  • 支付并下载
  • 收藏该文档
  • 百度一下本文档
  • 修改文档简介
全屏预览

下载提示

1.本站不保证该用户上传的文档完整性,不预览、不比对内容而直接下载产生的反悔问题本站不予受理。
2.该文档所得收入(下载+内容+预览三)归上传者、原创者。
3.登录后可充值,立即自动返金币,充值渠道很便利
教学模块八 动画和Web 页设计教学目标 本模块主要介绍Photoshop CS5中有关Web页图像设计的内容。通过本模块的学习,能够熟练掌握Web页设计的方式、方法。从切片应用到优化图像、动画制作,深入了解Photoshop在网页设计中的作用,并能够利用其强大的图形图像处理功能,制作出精美的网页模板及网页动画。教学模块八 动画和Web 页设计教学目标任务目标: 利用Photoshop的图像处理功能制作精美的Web页导航栏。任务说明: 本任务主要通过使用Photoshop图像处理,制作“花语网站导航栏效果”,效果图如图8-1-1所示。图8-1-1 导航栏效果完成过程:步骤1选择“文件”→“打开”命令打开素材文档中的图像文档“导航栏背景.jpg”(附赠光盘教学模块8﹨素材﹨导航栏背景.jpg)。步骤2新建图层1,按【Ctrl+A】键全选。单击前景色标,打开拾色器,设置前景色为R:32,G:157,B:38,按【Alt+Delete】键,为该图层填充颜色。图层效果如图8-1-2所示。图8-1-3 做矩形选区效果步骤4按【Delete】键后效果如图8-1-4所示。图8-1-4 删除后的效果步骤5按【Ctrl+D】键,取消选区。步骤6选择“文件”→“打开”命令打开素材文档中的图像文档“logo.png”(附赠光盘教学模块8﹨素材﹨logo.png)。步骤7 在该文档的“图层”面板中选择图层“logo”,鼠标“右击”该图层,在弹出的菜单中选择“复制图层”,弹出“复制图层”对话框。在目标文档中选择打开状态的文档“导航栏背景.jpg”,单击【确定】按钮。如图8-1-5所示。图8-1-5 复制导航栏背景图层 步骤8在Photoshop中的文档标签栏单击“导航栏背景.jpg”,切换到该图像,可以看到“logo”图层,出现在该图像的“图层”面板中。调整“logo”图层图像的位置,如图8-1-6所示。 步骤9在该文档“图层”面板中单击“创建新组”按钮 ,创建新组,为该组命名为“导航按钮”,如图8-1-7所示图8-1-6 调整logo位置图8-1-7 创建“导航按钮”组步骤10在该组中新建图层,命名图层为“按钮背景”。如图8-1-8所示。图8-1-8 创建“按钮背景”层图8-1-11所示 变换后的位置步骤14按【Ctrl】键并单击“按钮背景”图层缩略图,得到该层图像选区,按【Ctrl+Alt+Shift+T】键四次,得到四个复制后的圆角矩形,取消选区,调整该层图像位置,如图8-1-12所示。选择“视图”→“显示”→“参考线”命令,取消参考线的显示。图8-1-12 调整位置 步骤16分别输入“花语简介”、“花语构成”、“起源发展”、“节日花语”和“恭贺花语”。图层效果如图8-1-14所示,图像效果如图8-1-15所示。图8-1-15 图像效果图8-1-14 文字图层效果图8-1-16 横排文字参数设置步骤18输入网址信息,调整位置,效果如图8-1-17所示。图8-1-17 输入网址文字后效果 步骤19选择“文件”→“存储为”命令,将所得结果存储为“导航栏.psd”文件,这样我们就完成了花语网站导航栏的设计。效果图参看“附赠光盘教学模块8﹨素材﹨导航栏.jpg”。任务目标: 利用Photoshop的图像处理功能制作网页效果。任务说明: 本任务主要通过使用Photoshop图像处理,制作“花语网站主页效果”,效果图如图8-2-1所示。图8-2-1花语网站主页效果完成过程:步骤1选择“文件”→“打开”命令,打开素材文档中的图像文档“网页背景.jpg”(附赠光盘教学模块8﹨素材﹨网页背景.jpg)。步骤2选择“文件”→“存储为”命令,文件名为“花语主页.psd”。步骤3选择“文件”→“打开”命令,打开素材文档中的图像文档“导航栏.jpg”(附赠光盘教学模块8﹨素材﹨导航栏.jpg)。步骤4在“导航栏.jpg”文档的“图层”面板中选择背景图层,鼠标“右击”该图层,在弹出的菜单中选择“复制图层”,弹出“复制图层”对话框。在目标文档中选择打开状态的文档“花语主页.psd”,单击【确定】按钮。如图8-2-2所示。图8-2-2复制花语主页图层 步骤5在Photoshop中的文档标签栏单击“花语主页.psd”,切换到该图像,可以看到“背景副本”图层出现在该图像的“图层”面板中。将该层改名为“导航栏”,调整“导航栏”图层的图像位置调整到最上方,如图8-2-3所示。图8-2-3 调整导航栏到最上方步骤6 选择“文件”→“打开”命令,打开素材文档中的图像文档“图片1.png”(附赠光盘教学模块8﹨素材﹨图片1.png)。步骤7 在“图片1.png”图像中,按【Ctrl+A】键全选,选择“编辑”→“拷贝”命令,然后返回图像“花语主页.psd”,选择“编辑”→“粘贴”命

发表评论

请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码: 点击我更换图片

“原创力文档”前称为“文档投稿赚钱网”,本站为“文档C2C交易模式”,即用户上传的文档直接卖给(下载)用户,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有【成交的100%(原创)】。原创力文档是网络服务平台方,若您的权利被侵害,侵权客服QQ:3005833200 电话:19940600175 欢迎举报,上传者QQ群:784321556