Photoshop 7网页特效高级实例教程

1 photoshop 7/imageready 7新功能


lesson 0 photoshop 7版本的最大变化

网页制作功能的强化

全新绘图引擎和显示引擎的启用

图片修整功能的极大加强

图像文件管理


lesson 1 photoshop 7的效率强化界面

tool palette（工具面板）的超强升级：option bar（选项栏）

图层面板功能的强化


lesson 2 丰富多样的图层效果混合功能

图层样式功能的强化

layer style的运用过程


lesson 3 导入slice寻求图像最优化

slice tools，save for web


.lesson 4 为独立制作添加样式

preset manager（模板预设管理器）

save set


lesson 5 多种文字的变形、修整功能

text操作方式的变化

使用work path制作图案文本


lesson 6 其他改进功能

photoshop的有趣功能：liquify

psd文件的注释：notes tool


lesson 7 imageready 7的改进功能

image map tool

tween功能

match功能


2 活用实例轻松掌握photoshop 7


lesson 8 轻松制作相片库主页web photo gallery

把图像文件整理到超酷图片库主页中


lesson 9 web photo gallery的html源码编辑

web photo gallery的html源码编辑

html源码修正和结果确认


lesson 10 在完成的图片上粘贴附加页：notes tool（注释工具）

注释工具的功能和使用


lesson 11 按钮图像制作过程的简单化drawing shape tool，layer stele


lesson 12 添加样式预设模块集合（presets library）

设定preset manager

制作个性风格的预设模块

photoshop 7中提供的类型（笔刷）

photoshop 7中提供的类型（渐变）

photoshop 7中提供的类型（样式图案）

photoshop 7中提供的类型（样式）

photoshop 7中提供的类型（自定义图形）


lesson 13 在photoshop中进行网页图像优化save for web

layer based slice

save for web


lesson 14 网页图像样式图案的制作及运用

制作样式图案

使用layer style（图层样式）

运用offset（位移）

制作小星图案

保存为样式图案并运用于主体图像中


3 web graphic的photoshop


lesson 15 凹凸文字的立体效果

使用样式

运用warped text

photoshop 7的warped text style

样式面板的文本效果


lesson 16 透明像胶字体的凹凸效果

准备背景

输入文字

制作凹陷效果

对文字运用透明像胶效果


lesson 17 紫水晶效果

使用阳刻（凸出）

追加柔和边线

追加内部光泽效果

追加阴影效果


lesson 18 紫水晶效果的变形

使用阳刻（凸出）

追加柔和边线

使用透明效果

调整整体色感


lesson 19 黄金和搪瓷效果

柔和凸出效果

追加光滑效果

在文字中加入黄金质感


lesson 20 金属质感效果

给图像追加金属质感

完成背景图像

输入文字及运用skew

layer style的使用：使用stroke和bevel and emboss制作金属带效果

pattern overlay的使用

gradient overlay、color overlay、inner glow的使用

drop shadow的运用

保存样式

制作文字背景


lesson 21 plastic按钮

制作highlight

追加颜色

inner bevel的运用

追加透明阴影

追加阴影效果

保存新的样式模块

在sumbol（符号）中追加阴影效果

修整整体色感


lesson 22 利用路径工具制作插图

准备操作环境

制作碗的外观图形

制作碗底部分

制作阴影部分

制作碗口部分

绘制线状形态


lesson 23 利用satin创建不规则光源体

突出显示效果

使用图层样式编辑主图像

使用high light处理图像


lesson 24 搭配图像排列文字

制作图案图像

蒙版的使用和浮雕效果

背景图像映照在文字上的效果

使用图层样式


lesson 25 搭配图像排列文字

生成栅格

根据栅格设置文字

对文字使用建筑物外观的凹凸效果

填充文字颜色


lesson 26 group layer的丰富效果

制作图案图像

在图像中使用图案


lesson 27 通过图层样式表现柔和的浮雕效果


4 imageready的网页图像制作技巧


lesson 28 imageready的工作流程

第1阶段 编辑图片，制作按钮图片，网页版面设计等图像相关工作

第2阶段 区分图像区域和文字区域（slice tool）

第3阶段 设置各个图像区域的gif、jpg、png格式（optimize）

第4阶段 rollover图像操作（rollover），gif动画文件（animation），使用图像映射图（image map），设置文件名、链接以及区分文本区域（slice）

第5阶段 html预览（preview in ）保存html和图像文件（save optimized）


lesson 29 图像切片（slice）技巧

利用guides进行区域分割

生成切片区域

图像的优化

保存html文件和图片


lesson 30 制作gif动画

动画画面设置

设置播放次数

图像优化


lesson 31 灵活使用gif动画

使用移动clipping path位置的动画

使用移动layer mask位置的动画

使用spin action的动画

图像的优化


lesson 32 制作rollover按钮

区域分割

为分割的区域设置文件名

使用翻转状态

给按钮添加开关显示屏照明灯的效果

save optimized

制作显示屏的gif动画

gif动画与按钮功能的链接

背景图像插入和html页面的完成


lesson 33 灵活使用image map

使用“new layer based image map area”

使用圆形、多边形图像映射图工具

设定image map palette

html预览


5 网站设计


lesson 34 网页设计注意事项

html的重要性

图像文件夹的管理

web色彩

链接速度

站点结构


lesson 35 设计导航菜单

绘制外观

修改图形

绘制菜单图像

输入切片信息并制rollover图像

保存优化图像文件


lesson 36 利用microangelo 5制作图标

了解图标图像

了解microangelo 5

绘制轮廓

设置颜色

捕获放大的图像


lesson 37 使用dreamweaver完成主页制作

分隔切片区域

创建框架区域

插入翻转图像

插入主图像和文本

设置背景颜色

查看结果


r.s相关网站