1、第四周,网页制作与网站设计教程,淮安信息职业技术学院计算机科学与工程系 网页制作与网站设计课程组制,第三章Photoshop网页设计基础 Photoshop蒙版、路径的使用 网页设计与制作课程讲义,网页制作与网站设计教程,本章要点,蒙版简介 蒙版的实例应用 路径简介 “钢笔工具”选项栏 绘制直线路径的方法 绘制曲线路径的方法 添加锚点的方法 、删除锚点的方法 、转换锚点的方法 路径调板的使用方法 使用填充路径 路径使用实例-制作网站顶部效果图,网页设计与制作教程,Photoshop蒙版的使用,蒙版简介,蒙版是一种遮盖工具,就像是在图像上用来保护图像的一种层“膜”,可以分离和保护图像的局部区域。
2、如果要对图像的部分区域进行编辑,就可以使用蒙板把不需要的部分屏蔽起来。,表明蒙版和该图层处于链接状态,给当前图层添加一个新的矢量蒙版,图层蒙版缩略图,网页制作与网站设计教程,网页设计与制作教程,Photoshop蒙版的使用,蒙版的实例应用,演示Photoshop蒙版的实例,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,路径简介,路径这个概念相对比较容易理解,所谓路径,在屏幕上表现为一些不可打印的、不活动的矢量形状,可以通过路径进行描边或填充等操作来获得图形。可以使用前景色描画路径,从而在图像或图层上创建一个永久的效果;但路径通常被用作选择的基础,它可以进行精确定位和
3、调整;路径比较适用于不规则的、难以使用其它工具的进行选择的区域。,未选中的锚点,选中的锚点,方向点,方向线,方向线,角点,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,认识“钢笔工具”选项栏,形状图层,路径,填充像素,路径组合方式,“形状图层”,如果选择工具选项栏上的“形状工具”选项,将在新的图层上绘制矢量图形。 “路径” ,如果选择“路径”选项,绘制的将是路径。 “填充像素” ,如果选择“填充像素”选项,将在当前层绘制前景色填充的矢量图形。 由于要绘制的是路径,所以应该选择“路径”选项。,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,绘
4、制直线路径的方法,1)将钢笔工具定位在直线段的起点并单击,以定义第一个锚点。 2)在直线段的终点再次单击,或按住Shift键再单击将该线段的角度限制在45度角的倍数。 注意:绘制过程中,最后一个锚点总是实心方形,表示处于选中状态,继续添加锚点时,以前定义的锚点会变成空心方形。如果选中了“自动添加/删除”复选框选项,则单击现有点可将其删除。,绘制曲线路径的方法,演示,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,添加锚点的方法,从工具箱中选择“添加锚点工具” ,并将指针放在要添加锚点的路径上(指针旁会出现加号) 如果要添加锚点但不更改线段的形状,只要单击一下路径即可。
5、如果要添加锚点并更改线段的形状,则需要用拖移的方法以定义锚点的方向线。,删除锚点的方法,从工具箱中选择“删除锚点工具” ,并将指针放在要删除锚点的路径上(指针旁会出现加号)。 删除锚点,单击锚点将其删除,路径的形状重新调整以适合其余的锚点;或者拖移锚点将其删除,线段的形状随之改变。,演示,演示,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,转换锚点的方法,如果要将角点转换成平滑点,请向角点外拖移,使方向线出现。,如果要将平滑点转换为带有方向线的角点,一定要能够看到方向线,然后拖移方向点,使方向线断开。,网页制作与网站设计教程,网页设计与制作教程,Photoshop路
6、径的使用,选择路径的方法,路径选择工具,路径选择工具,演示路径选择工具,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,路径调板的使用方法,用画笔描边路径,用前景色填充路径,用前景色填充路径,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,使用路径描边,通过实例演示路径描边,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,使用填充路径,通过实例演示路径填充工具,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,路径使用实例-制作网站顶部效果图,创建路径,填充路径,网页制作与网站设计教程,网页设
7、计与制作教程,Photoshop路径的使用,路径使用实例-制作网站顶部效果图,添加图片,设置混合模式 添加模板,网页制作与网站设计教程,网页设计与制作教程,Photoshop路径的使用,路径使用实例-制作网站顶部效果图,演示本实例,网页制作与网站设计教程,网页设计与制作教程,本章小结,蒙版简介 蒙版的实例应用 路径简介 “钢笔工具”选项栏 绘制直线路径的方法 绘制曲线路径的方法 添加锚点的方法 、删除锚点的方法 、转换锚点的方法 路径调板的使用方法 使用填充路径 路径使用实例-制作网站顶部效果图,网页制作与网站设计教程,网页设计与制作教程,本章习题,如何理解Photoshop中的蒙版的概念? 如何理解Photoshop中的路径的概念? 利用图3-71和图3-72制作效果如图3-76所示的效果。 使用路径工具是绘制中央电视台CCTV的标志。,网页制作与网站设计教程,谢谢大家!,网页设计与制作教程,网页制作与网站设计教程,