网页美工篇电子课件 高教版 图形图像处理（Photoshop CC）.pptx

《网页美工篇电子课件 高教版 图形图像处理（Photoshop CC）.pptx》由会员分享，可在线阅读，更多相关《网页美工篇电子课件 高教版 图形图像处理（Photoshop CC）.pptx（17页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、0102网站首页设计网站主页设计 网页网页美工篇美工篇图形图像处理Photoshop CC能力目标l能将制作好的网页存储为方便网络浏览格式l能制作出网页的各种特效效果l能设计制作网页界面中的各种元素l能设计制作网站的主页和页面知识目标l了解网页设计的基本知识l掌握切片工具的使用l掌握标尺及辅助线的使用l掌握动画的制作方法l掌握网页中各种元素及特效的制作方法l掌握网页的布局和制作岗位目标l会使用Photoshop进行网站主页及页面的设计制作l会使用Photoshop进行界面各种元素的设计制作l会使用Photoshop进行动态广告的设计制作 教学教学 目标目标网页美工篇01 网站首页设计 项目背景

2、及要求 在进行设计之前，要对页面进行分析与规划。确定页面的色系、在进行设计之前，要对页面进行分析与规划。确定页面的色系、背景、构图，看是否符合电子商务网站的特点。还要看是否符合客户背景、构图，看是否符合电子商务网站的特点。还要看是否符合客户的爱好和需求。这些都需要使用的爱好和需求。这些都需要使用PhotoshopPhotoshop进行规划设计。具体设计进行规划设计。具体设计时，一般按时，一般按“由大到小，由整体到局部由大到小，由整体到局部”的顺序进行。的顺序进行。01 网站首页设计 项目分析 任务任务1 1 网页背景设计网页背景设计 任务任务2 2 导航条设计导航条设计 任务任务3 3 展示窗

3、设计展示窗设计 任务任务4 4 制作首页切片制作首页切片 制作步骤（略）01 网站首页设计 一、切片工具 “切片工具切片工具”可以将一个完整的图像切割成几部分。可以将一个完整的图像切割成几部分。“切切片工具片工具”主要用于分割图像。每分割一次图像就创建了一个带主要用于分割图像。每分割一次图像就创建了一个带标号的切片。标号的切片。二、切片选择工具 “切片选择工具切片选择工具”主要用于编辑切片主要用于编辑切片。知识百宝箱01 网站首页设计牛试小刀牛试小刀制作横幅广告制作横幅广告bannerbanner 制作效果 制作步骤（略）项目总结项目总结 本项目以电子商务网站首页的设计和banner横幅广告的

4、制作为主线，介绍了Photoshop在网页美工方面的应用。在制作网页时要充分利用Photoshop自身在图像处理方面的优势，最后能够设计制作出用其他设计工具无法达到效果的网页，当需要制作动态Logo或动态广告时，可以利用“时间轴”面板来方便地制作那些网上常用的各类广告。01 网站首页设计02 网站主页设计 项目背景及要求 在此网页的设计中我们可以在此网页的设计中我们可以先对页面进行初步规划，要与首先对页面进行初步规划，要与首页整体的风格相一致，又要与首页整体的风格相一致，又要与首页相区别。一般主页主要展示经页相区别。一般主页主要展示经营的商品，注重的是信息量，在营的商品，注重的是信息量，在尽可

5、能小的空间内发布主营的商尽可能小的空间内发布主营的商品。但也要注意结构搭配，避免品。但也要注意结构搭配，避免给顾客以拥挤的感觉。给顾客以拥挤的感觉。02 网站主页设计 项目分析 任务任务1 1 页面主体设计页面主体设计 任务任务2 2 页面细节的设计页面细节的设计 任务任务3 3 制作页面切片制作页面切片 制作步骤（略）02 网站主页设计 一、网络广告 网络广告是指利用网页上的广告横幅、文本及图片链接、多媒体等在互联网上刊登或发布广告，通过网络传递到互联网用户的一种高科技广告运作方式。1。分类 2。特点 3。计费方式 知识百宝箱02 网站主页设计二、动画及时间轴面板 1。什么是动画 动画就是在

6、一定时间内显示的一系列图像或帧。每一帧较前一帧都有轻微的变化，当连续、快速地显示这些帧时就会创造出运动的效果或其他变化的错觉。2。时间轴面板 知识百宝箱02 网站主页设计 三、创建动画 1。创建逐帧动画 2。创建过渡动画l创建位移过渡动画l创建不透明度过渡动画l创建效果过渡动画 3。创建照片切换动画 知识百宝箱02 网站主页设计牛试小刀牛试小刀设计设计制作制作小按钮小按钮 制作效果 制作步骤（略）项目总结项目总结 本项目以主页页面制作和按钮制作为主线，介绍了Photoshop在网页美工方面的另一个应用。在设计主页时要注重色彩的调整、版面的设计；使用Photoshop制作按钮可以综合运用渐变填充、图层样式及滤镜等工具，制作具有其自身特点的时尚美观的按钮。02 网站主页设计职业技能训练 一、试参照项目1制作电子商务网站“buy18”商务网站的首页。职业技能训练 二、使用Photoshop 的时间轴面板制作某公司宣传网页上的46860大小的横幅广告条（banner条）。职业技能训练 三、使用Photoshop CC制作按钮。