购买
下载掌阅APP,畅读海量书库
立即打开
畅读海量书库
扫码下载掌阅APP

第一节
Photoshop基础

图像处理软件的功能,除对图像尺寸、分辨率、颜色的调整外,还包括对场景的修饰、对人物面貌的修容等,具有很强的实践性和应用性。掌握其使用与设计技法是从事平面广告设计、包装设计、装饰设计、排版编辑、网页制作、图文印刷、动漫和游戏制作等工作的必备基础技能。在界面设计领域,视觉设计师主要根据前期产品经理及开发团队提供的低保真交互稿,绘制出界面所需要的图标、按钮、文字、图片和色彩等视觉元素,并标注好相应的尺寸信息,再交给前端开发团队完善视觉界面。这过程中涉及的设计稿件和切图标注,可利用Photoshop在图像处理方面的强大功能处理。

一、Photoshop软件基础

1.Photoshop概述及作用

Photoshop软件(如图2-1-1所示)是Adobe公司旗下一款应用广泛的图像处理软件,简称为Ps。其主要处理对象是由一个个像素组成的位图图像,也就是日常在图库、网站、数码相机中得到的各类图片。通过Photoshop,可以对已有的图片进行修正、再创造。此外,Photoshop还可以利用其自带的工具及各类插件,结合数位板进行漫画和插画的创作。

虽然Photoshop功能非常强大,应用也非常广泛,但是在实际工作中,人们一般不会使用它进行排版,原因有三:一是Photoshop在运行中占用内存较大,若排版版面过多或版面过大的文件,会造成计算机运行缓慢;二是Photoshop处理的是像素组成的位图,对一些细节部位的处理,如较小文字区域,处理完后将其放大会变得模糊,印刷效果不够清晰;三是Photoshop图层排布并不直观,在进行版面元素调配的时候会很不方便。因此,在实际排版工作中,常是先利用Photoshop制作底图,再把底图导入排版软件中添加其他细节元素。

图2-1-1 Photoshop CC 2019

2.Photoshop基础界面介绍

(1)新建文档

启动Photoshop后会显示“主页”工作区,如图2-1-2所示,它包含“新建”与“打开”两个命令按钮。

图2-1-2 “主页”工作区

单击“新建”按钮即可进入“新建文档”面板,创建一个新的psd文件,如图2-1-3所示。在“新建文档”面板最上方菜单栏中可根据所要制作的图像选择类型,如照片、打印、图稿和插画、We b、移动设备、胶片和视频,再在类型中选择具体的尺寸,也可以在右边的“预设详细信息”中手动设置制作文件所需的参数。最后,单击“创建”按钮。

图2-1-3 “新建文档”面板

“预设详细信息”中各项参数说明如下:

●宽度和高度:指定文档的尺寸,在“宽度”的下拉列表菜单中选择单位。

●方向:指定文档的页面方向为纵向或横向。

●画板:如果希望文档中包含画板,则选择此项。Photoshop会在创建文档时添加一个画板。

●分辨率:指定位图图像中细节的精细度,以像素/英寸或像素/厘米为单位。

●颜色模式:指定文档的颜色模式。通过改变颜色模式,可以将选定的新文档配置文件的默认内容转化为一种新颜色。值得注意的是,当设置为CMYK颜色模式时,保险起见,通常会把宽度和高度各增加3mm,以防止印刷后裁切时把重要信息裁掉。

●背景内容:指定文档的背景颜色。

在创建了一个文件后,再次启动Photoshop时,在“主页”工作区会以图标或者列表方式显示最近打开的文档,如图2-1-4所示。可以自定义设置最近打开的文件数,只需要在“编辑”→“首选项”→“文件处理”中设置“近期文件列表包含”的数值。如果想要清除所有的最近文档,只需要在“文件”→“最近打开文件”中点击“清除最近的文件列表”。

在创建一个新文件以后,界面就变成了图像处理的操作界面,如图2-1-5所示。该界面基本上分为四大区域,分别是菜单栏、工具栏、功能面板和工作区。

图2-1-4 “主页”工作区中的“最近使用项”

图2-1-5 图像处理的操作界面

1—菜单栏 2—工具栏 3—功能面板 4—工作区

(2)菜单栏

处于操作界面最上方的是菜单栏,包含文件、编辑、图像、图层、文字、选择、滤镜、3D、视图、窗口和帮助等菜单。Photoshop中所有的操作和调节命令及功能面板开关都能在相应的菜单中找到。下面逐一介绍一下每个菜单的作用。

1)“文件”菜单控制的是作图文件,主要功能有“新建”“打开”“存储”“存储为”“导出”“打印”等,如图2-1-6所示。可以在“文件”菜单中直接选择某项功能,也可以使用每项功能的快捷键。

●“新建”的快捷键是<Ctrl+N>,单击这个命令选项可以建立新的指定文档。

●“存储”的快捷键<Ctrl+S>要牢牢记住。在作图过程中应不时保存文件,以防遇到特殊情况,导致做好的作品丢失。如果遇到程序卡顿或闪退的情况,版本较新的Photoshop可以自动恢复文件,设置方法:可以在“编辑”→“首选项”→“文件处理”中的“文件存储选项”进行相应设置,如图2-1-7所示。

图2-1-6 “文件”菜单

●“存储为”与“存储”不同,“存储”是在原来的文档基础上存储,而“存储为”则是将所操作文档另存为一个新文档。

图2-1-7 “文件存储选项”设置

●“导出”与“存储”“存储为”略有不同。当需要将文档导出为png文件时,需要将图层背景关闭。遇到较大文件时,使用“存储”功能会花很长时间且文件很大、发送困难,若对图片品质要求不高,可将其导出为低品质图片或者“Web所用格式(旧版)”以进行预览和发送。

2)使用“编辑”菜单可以对某一图层、某一区域进行操作,也可以设定一些软件基本参数。

●还原的快捷键是<Ctrl+Z>,在当前操作失误的时候可执行该命令。

●剪切(快捷键<Ctrl+X>)、拷贝(快捷键<Ctrl+C>)、粘贴(快捷键<Ctrl+V>)也很常用,应记住其对应的快捷键。这一组快捷键几乎在任何软件上都适用。

●“填充”的功能是,当建立一个新的图层以后,可对其进行色彩或图案设置。可以用快捷键<Ctrl+Delete>进行填充,但要注意的是,默认填充的色彩是背景色。“填充”设置如图2-1-8所示。

●“操控变形”“透视变形”“自由变换”和“变换”可以统一使用快捷键<Ctrl+T>。在Photoshop中,通过这几个操作命令可以将图片进行变形或者翻转。在将图片置入样机模板中时,通常会使用这些命令。“编辑”→“变换”菜单如图2-1-9所示。

图2-1-8 “填充”设置

●通过“首选项”可以更改界面外观色彩、参考线色彩、光标效果等,如图2-1-10所示。Photoshop在工作的时候会产生临时文件,因为软件在运行的过程中会产生大量的数据,要把数据暂时存在硬盘上。一般情况下,“暂存盘”默认设置为第一个驱动器,对于Windows系统来说,就是C盘。但是Photoshop在处理图层过多、比较大的文件时,缓存文件有可能会把这个驱动器装满,软件会提示暂存盘已满,命令无法执行。如果C盘空闲空间不够大,C盘变满会导致系统运行卡顿,这时就要改变暂存盘的位置,推荐取消选择C盘,转而选择其他空闲空间比较大的驱动器,比如D盘,如图2-1-11所示。

图2-1-9 “编辑”→“变换”菜单

图2-1-10 “编辑”→“首选项”菜单

图2-1-11 “暂存盘”设置

3)“图像”菜单非常重要,在工作中极其常用。

●通过“模式”可以修改文件的色彩模式,包括常见的RGB颜色模式和CMYK颜色模式等,如图2-1-12所示。

●“调整”的子菜单中有修改图片色彩的各种命令,在调色时特别常用,如图2-1-13所示。下面重点介绍“色阶”和“曲线”。

图2-1-12 “图像”→“模式”菜单

图2-1-13 “图像”→“调整”菜单

“色阶”命令主要用于调整图像的阴影、中间调和高光的强度级别,矫正色调范围和色彩平衡。在“色阶”对话框的“输入色阶”中,阴影滑块位于色阶值“0”处时对应的像素是纯黑色,如果向右移动阴影滑块,则Photoshop会将当前阴影滑块位置的像素值映射为色阶值“0”,即滑块所在位置左侧都为黑色;高光滑块位于色阶值“255”处时对应的像素是纯白色,若向左移动高光滑块,则滑块所在位置右侧都会变为白色;中间调滑块位于色阶值“128”处,主要用于调整图像中的灰度系数,可以改变灰色调中间范围的强度值,但不会明显改变高光和阴影。“输出色阶”的两个滑块主要用于限定图像的亮度范围,拖动暗部滑块时,左侧的色调都会映射为滑块当前位置的灰色,图像中最暗的色调将不再为黑色,而是变为灰色;拖动白色滑块的作用与拖动暗部滑块的相反。

曲线分为RGB曲线和CMYK曲线,通过“曲线”对话框中的“通道”进行选择。调整RGB曲线可改变图像亮度,调整CMYK曲线可改变印刷时油墨量。

RGB曲线:RGB曲线的横坐标是原来的亮度,纵坐标是调整后的亮度。光(亮度)的取值范围是0~255。在未调整时,曲线是呈45°倾斜的直线,线上任何一点的横坐标值和纵坐标值都相等,这意味着调整前的亮度和调整后的亮度一样。如果把线上的一点往上拖动,曲线的纵坐标值大于横坐标值,调整后的亮度就大于原来的亮度,即图像亮度增加了,如图2-1-14所示。

CMYK曲线:CMYK曲线的横坐标是原来的油墨量,纵坐标是调整后的油墨量,取值范围是0~100%,如图2-1-15所示。油墨量是网点面积覆盖率,是单位面积的承印物被油墨覆盖的百分比。油墨覆盖得越多,颜色越深。

图2-1-14 RGB曲线

图2-1-15 CMYK曲线

“曲线”命令。单击“调整/曲线”命令,打开“曲线”对话框。“曲线”对话框显示所调整的点的“输入”和“输出”的值,也就是横坐标值和纵坐标值。曲线下面的两个滑块表示曲线的明暗方向,如在RGB颜色模式下,黑滑块在左边,白滑块在右边,表示左边暗,右边亮。

●通过“图像大小”可以修改图片的尺寸和分辨率等参数,如图2-1-16所示。

●通过“画布大小”可以修改“纸面”大小。需要注意的是,“图像大小”和“画布大小”都可以修改“纸面”的大小,区别在于,“图像大小”修改的是整个图像中的所有物体的尺寸,包括“纸面”的大小,而“画布大小”修改的只是画布(“纸面”的尺寸),修改后文件中的物体大小不变。

图2-1-16 “图像大小”对话框

●通过“图像旋转”可以顺时针或逆时针旋转图像,也可以对图像进行左右翻转和上下翻转等操作。

4)“图层”菜单如图2-1-17所示。由于其中的大部分功能可以通过“图层”面板实现,比如“新建”“复制图层”“删除”“重命名图层”“图层蒙版”“图层编组”“锁定图层”“合并图层”等,因此“图层”菜单不常用。

5)“文字”菜单(如图2-1-18所示)中的大部分功能可以通过“字符”面板和“段落”面板实现,因此也不常用。

6)“选择”菜单中的功能主要针对选区,主要功能有“全部”“取消选择”“反选”“色彩范围”“主体”“选择并遮住”“选取相似”“载入选区”和“存储选区”等,如图2-1-19所示。

图2-1-17 “图层”菜单

图2-1-18 “文字”菜单

图2-1-19 “选择”菜单

●“色彩范围”是比较好用的一个功能,用吸管单击取样颜色,就可以选取同种颜色的区域,从而提高作图效率。“色彩范围”对话框如图2-1-20所示。另外,取消选区可以使用快捷键<Ctrl+D>进行操作。

●“主体”功能是在较新的几个版本的软件中才出现的,通过它可以直接选中画面中的主体物,将其从背景中抽出,操作非常简便。但需要注意,图像主体与背景的差异不能太小,否则计算机无法正确识别。

图2-1-20 “色彩范围”对话框

●“选择并遮住”具有强大的去背景功能,可以抠出毛发等细节。旧版软件无此项功能。

7)“滤镜”菜单中的功能可以针对某个图层,对其表现形态进行修改以实现特殊效果。

●“Camera Raw滤镜”是一款调色“神器”,功能强大,可实现非常多的效果,如图2-1-21所示。

●“液化”可以使图层上的物体变形,得到类似于“揉”出来的效果,可以实现“大眼”、瘦脸等效果。

图2-1-21 Camera Raw滤镜

●可以将从“3D”到“其他”归为一类功能,具体效果可以试验了解。其中,“模糊”中的“高斯模糊”是比较常用的功能;当设计师需要设计出动感效果的图例时,可以利用“动感模糊”。“滤镜”→“模糊”菜单如图2-1-22所示。

8)“视图”菜单如图2-1-23所示,可以对工作区的辅助功能进行设定。常用的命令有“显示”“标尺”“对齐”“锁定参考线”等。在实际操作中,“对齐”功能可以方便地使一个物体跟另外一个物体自动对齐。另外,在作图的时候,可以使用参考线给物体定位,这就用到了“锁定参考线”。

图2-1-22 “滤镜”→“模糊”菜单

9)“窗口”菜单如图2-1-24所示。其中,“排列”用于设定工作区中多个作图文件的排列方式;通过“工作区”可以设定在界面中出现哪些功能区,一旦在应用软件过程中某个功能区消失了,就可以从这里找回;菜单中间最大的这部分区域是面板区(从“3D”到“字形”),需要使用哪个面板时可以在这里直接单击以将之调出。

10)“帮助”菜单不常用,主要功能有“登录”“Photoshop帮助”“Photoshop教程”等。

Photoshop常用菜单的快捷键见表2-1-1。

图2-1-23 “视图”菜单

图2-1-24 “窗口”菜单

表2-1-1 Photoshop常用菜单的快捷键

(3)工具栏

界面最左侧的一列是工具栏,或称工具条,放置的是可以通过鼠标在画面中直接使用的各种工具,如选框工具组、画笔工具组、橡皮擦工具组、裁剪工具组、图章工具组、文字工具组等,如图2-1-25所示。

图2-1-25 工具栏

也可以通过“...”,在打开的对话框中根据自己的习惯自定义工具栏,如图2-1-26所示。应该说工具栏就像画画时用的笔袋,通过其中的各种工具就可以在画面中进行创造了。

1)选择工具。

在Photoshop中,对图像进行编辑与修改时,先要使用选择工具来选中要修改的图像区域。可以基于大小、形状和颜色来创建选区,针对不同的对象使用合适的选择工具将有利于提高工作效率。另外,建立选区也可以通过按住<Ctrl>键的同时单击“图层”面板中的相应图层缩略图 的方式实现。需要选择对象时,结合菜单栏中的“选择”进行操作也是一种方式。

图2-1-26 自定义工具栏

●套索工具组,包括“套索工具”“多边形套索工具”“磁性套索工具”。套索工具组用于制作不规则的选区。使用“套索工具”可以直接在画面上自由绘制选区,按住鼠标左键拖动鼠标将画出黑线轨迹,松开鼠标即可使轨迹闭合,形成选区。使用“多边形套索工具”可以以逐点单击的方式建立直线线段围合的多边形选区,当选区闭合时,光标右下角会出现一个小圈圈。在单击绘制选区的过程中,结合<Backspace>(后退)键可以取消上一个绘点;直接双击,或者按<Enter>键,则就地封闭选区。可以使用<Alt>键实现“多边形套索工具”和“套索工具”的切换,从而绘制多边形和自由线结合的选区。“磁性套索工具”有智能识别边缘的功能。在图像的边缘单击一下,然后沿着边缘慢慢拖动鼠标,轨迹线会自动找到附近对比强烈的边缘点,当返回最开始的地方时,单击即可闭合轨迹,完成选区绘制。拖动鼠标的时候要尽量缓慢一些,这样会识别得更细致。

●“魔棒工具”适用于选择颜色范围,尤其适用于选择被完全不同的颜色所包围的颜色相似的区域。和其他选择工具一样,创建初始选区后,可向选区中添加区域或将某区域从选区中删去。决定魔棒工具灵敏度的参数是属性栏中的“容差”,如图2-1-27所示,它指定了选取的像素的类似程度,其默认值为32,表示选择与指定值相差不超过32的颜色范围。在使用“魔棒工具”的过程中,可根据图像的颜色范围和变化程度调整“容差”值。

图2-1-27 “魔棒工具”的“容差”

“快速选择工具”与“魔棒工具”功能相似,区别在于,“魔棒工具”适合用于选择颜色比较纯净的同类区域,“快速选择工具”适合用于选择较为复杂的对象。

使用选择工具时,根据不同的需求,选择合适的工具,或者结合使用多种工具。

2)裁剪和切片工具。

●“裁剪工具”的功能是可以自由地对图像进行裁剪。

●“切片工具”,在UI设计中,使用“切片工具”可以快速制作界面规范模板,如图2-1-28和图2-1-29所示。通过使用“切片工具”可将图形或页面划分为若干相互紧密衔接的部分,并对每个部分应用不同的压缩和交互设置。在导出时,利用“存储为Web和设备所用格式”对话框,可在将文件存储为一些网页兼容的格式之前,预览不同的优化设置并调整颜色调板、透明度和品质设置。当然,“切片工具”最大的优点是提高图片的下载速度,减轻网络负担。

图2-1-28 网页切片

图2-1-29 移动应用切片

3)图框工具。

此工具相当于剪切蒙版,设计师可以自由建立一个形状,如图2-1-30所示,然后把图片拖进形状内,图片即仅展示为形状范围内的部分,如图2-1-31所示。

4)吸管工具。

利用“吸管工具”,单击画布中的任一色彩,在工具栏的前景色中将会显示出所吸取的色彩,如图2-1-32所示。

图2-1-30 建立图框

图2-1-31 完成效果

5)修复及画笔工具。

●“画笔工具”的大小及软硬程度可以在属性栏中调整。当需要用到Photoshop手绘时,可根据需求选择不同的画笔进行绘画,如图2-1-33所示。使用“画笔工具”时,当光标显示为一个圆圈时,说明当前画笔为普通的圆点画笔。圆圈的大小代表当前画笔的直径大小。如果选择了异形画笔,光标就会变成相应的预览形状。可以通过快捷键<[>和<]>(左、右方括号)逐步调节画笔直径的大小,左方括号代表变小,右方括号代表变大;还可以通过快捷键<Shift+[>和<Shift+]>逐步调节画笔的硬度,左方括号代表变软,右方括号代表变硬。

图2-1-32 吸取颜色

●“仿制图章工具”可将图像的一部分绘制到同一图像的另一部分,也可以将一个图层的一部分绘制到另一个图层。通过“仿制图章工具”可以复制对象,通过复制来修饰类似区域,或者添加重复元素。选择此工具后,按住<Alt>键单击所要复制的区域,松开<Alt>键即可复制。

●“修复画笔工具”可修复画面中的污点。“修复画笔工具”与“仿制图章工具”用法一样,按住<Alt>键拾取仿制源,使用仿制源进行修复。和“仿制图章工具”不同的是,“修复画笔工具”可将仿制源的纹理、光照情况、透明度和阴影与所修复的区域进行智能匹配,达到完美融入图像的效果。

图2-1-33 画笔属性

●使用“渐变工具”创作多种样式的渐变效果。“渐变工具”的使用方法是在目标区域单击并拖拽,拖拽的方向即为渐变的方向。按住鼠标左键拖拽的时候显示轨迹线,松开鼠标左键后,渐变效果就会被填充到画面中。

●“减淡工具”可以使相应区域颜色变浅,“加深工具”则相反。

●“海绵工具”可以增减图像饱和度。

6)绘图和文字工具。

绘图和文字工具,与Illustrator中的大致相同,可根据需求选择使用。需要注意的是,使用文字工具时,当拖动鼠标选出一个范围时,文字可以自动形成段落格式,如图2-1-34所示。

图2-1-34 文字段落

7)导航工具。

使用“工具”可以放大或缩小视图,按住<Z>键和鼠标左键,向左或向右移动鼠标即可放大或缩小视图。另外,按住<Alt>键,滑动鼠标滑轮也可以放大或缩小视图。还有一种方法是,按<Ctrl++>组合键或者<Ctrl+->组合键放大或缩小视图。

8)前景色及后景色。

前景色图层与后景色图层可以自由切换,通常后景色是作为文档的最底层画面。

(4)功能面板

工作区右侧的就是功能面板区,主要作用是对画面中的物体进行参数操作。面板不只有一种,针对不同的物体、不同的操作需求会有不同的面板,如图2-1-35所示。可以通过“窗口”菜单,选择显示哪一个面板,还可以拖拽面板上方的标签,对面板进行自由组合。

1)“历史记录”面板如图2-1-36所示。当操作失误后,可以在这里找到想要返回到的操作步骤。可以更改预设的记录次数值,在计算机配置足够好的情况下,记录次数值越高越好。

2)“调整”面板如图2-1-37所示。通过该功能面板可以对图像的亮度、对比度、色阶等进行修改,因此可以方便设计师快速进行调色。

图2-1-35 功能面板

图2-1-36 “历史记录”面板

3)“图层”面板如图2-1-38所示。简单来说,图层就是图像的层次。“图层”面板相当于Photoshop功能的基石,下面来详细介绍一下图层的相关知识。

①图层的基本概念。

图层是Photoshop的核心功能。图层除了承载图像内容,图层样式(如图2-1-39所示)、混合模式、蒙版、滤镜、文字、3D和调色等功能都要依托图层而存在。简单来说,它就像是堆叠的透明胶片。设计师可以通过图层画面的透明区域看到下面图层的内容,还可以更改图层的“不透明度”。每个Photoshop文件包含一个或多个图层。操作图层类似于在多张透明胶片上排列图像、文本或其他对象,可以编辑、删除和调整每个透明胶片的位置,而不会影响其他透明胶片,且当这些透明胶片叠在一起时,整个合成图像就会显示出来。

图2-1-37 “调整”面板

图2-1-38 “图层”面板

②图层的类型。

在Photoshop中可以创建多种类型的图层,如普通图层、背景图层、智能对象图层、调整图层、填充图层、视频图层、矢量蒙版图层、3D图层、文字图层、图框图层等,其功能、用途及在“图层”面板中的显示状态有所不同。下面介绍几种常见类型的图层。

●背景图层:新建文档时创建的图层,它始终位于面板的最下层,名称为“背景”。

图2-1-39 图层样式

●中性色图层:填充中性色并预设混合模式的特殊图层,可用于承载滤镜或在上面绘画。

●链接图层:保持链接状态的多个图层,当两个图层进行链接的时候,这两个图层中的内容会保持一致的移动、拉伸等状态。

●智能对象图层:含有智能对象的图层。智能对象图形的特点是不会根据图片大小的变化而改变精度。在设计过程中,如果需要将图片进行放大或缩小,尽量将之变为智能对象的图层状态,再进行调整。

●调整图层:可以调整图像的亮度、色彩平衡等,但不会改变像素值,而且可以重复编辑。

●填充图层:填充了纯色、渐变效果或图案的特殊图层,新建的图层是没有背景色的,这个时候可以利用快捷键<Ctrl+Delete>进行填充,或者通过菜单栏的“编辑”→“填充”进行填充。

●图层蒙版图层:添加了图层蒙版的图层。蒙版可以控制图像的显示范围。利用“画笔工具”,当前景色为黑色时,涂抹图像可以将所涂抹范围遮盖;再将前景色改为白色,涂抹图像可以将所涂抹范围重新显示出来。

●矢量蒙版图层:添加了矢量形状的蒙版图层。

●图层样式图层:添加了图层样式的图层。通过图层样式可以快速创建特效,如投影、发光和浮雕效果等。

●文字图层:使用文字工具输入文字时创建的图层。

●视频图层:包含视频文件帧的图层。

●图层组:用来组织和管理图层,以便于查找和编辑图层,类似于文件夹功能。

③创建图层。

Photoshop中创建图层的方式有很多,包括在“图层”面板中创建、在编辑图像的过程中创建、使用命令创建等。

选择菜单栏中的“窗口”→“图层”,打开“图层”面板。单击面板底部的“新建图层”按钮 ,即可在当前图层上方新建一个图层,新建的图层会自动成为当前图层。如果要在当前图层的下面新建图层,可以按住<Ctrl>键的同时单击“新建图层”按钮。如果要在创建图层的同时设置其属性,如名称、颜色、混合模式和不透明度等,可选择菜单栏中的“图层”→“新建”→“图层”,或按住<Alt>键并单击“新建图层”按钮,打开“新建图层”对话框进行设置。

在“图层”面板中,每个图层都会以含有名称和缩略图的条目形式显示,单击左侧的眼睛图标可以隐藏或显示图层,这是查看特定图层内容的有效方式;如果图层条目中出现了锁定图标,表示图层受到保护,不能编辑,如图2-1-40所示。

图2-1-40 图层锁定

以“新建文档”方式创建图像时,无论选择什么颜色的背景,“图层”面板中最底端的图层名都为“背景”,每个图像文档只能有一个背景图层,且默认为锁定状态。

如果要对背景图层进行编辑,须将其转换为常规图层,方法是:双击“图层”面板中的“背景”图层,或选择菜单栏中的“图层”→“新建”→“背景图层”,打开“新建图层”对话框,在其中将图层重命名并设置其他图层选项,然后单击“确定”按钮。

如果要将常规图层转换为背景图层,可在选中要转换的图层后,选择菜单栏中的“图层”→“新建”→“图层背景”。

在图像编辑过程中,如果创建了选区,先按快捷键<Ctrl+C>,再按快捷键<Ctrl+V>可以复制粘贴选中的图像并创建一个新的图层;如果打开了多个文档,使用移动工具将一个图层拖至另外的文档中,可将其复制到目标文档中,同时创建一个新的图层。需要注意的是,以上方法都是以复制的方式来创建新的图层,如果这种操作是在两个打印尺寸或分辨率不同的文档之间进行的,图像在复制前后的视觉显示大小会有变化。例如,在相同打印尺寸的情况下,若源图像的分辨率小于目标图像的分辨率,则图像复制到目标图像后会显得比原来小。

④图层编辑与调整。

如果要使用绘图工具和滤镜工具编辑文字图层、形状图层、矢量蒙版图层或智能对象图层等包含矢量数据的图层,需要先将其栅格化,让图层中的内容转化为光栅图像,然后才能进行相应的编辑。具体操作方法是:选中要栅格化的图层,选择菜单栏中的“图层”→“栅格化”。

a.过滤显示。

通过图层过滤功能可以快速找到相应类型的图层,如图2-1-41所示。例如,单击 ,图层列表就只显示文字图层。关闭图层过滤的开关,则会显示所有图层。

b.设定“不透明度”和“填充”。

图2-1-41 图层过滤控制项

“图层”面板中的“不透明度”和“填充”十分类似:“不透明度”是针对整个图层的,包括添加的图层样式;而“填充”只是针对填充的颜色,不会对图层样式效果起作用,如图2-1-42所示。

c.复制图层。

图2-1-42 “不透明度”和“填充”

在“图层”菜单中选择“复制图层”即可复制图层。

使用快捷键复制图层:按住<Alt>键,在图层列表上拖拽某个图层,当光标变成双箭头时,松开鼠标左键,此时图层就被复制了一份。如果按住<Alt>键在画面上进行拖拽,也可以实现复制图层,而且鼠标最终所停的位置,就是复制后图层内容的位置。

在图层编辑中,还有一种复制图层的方式——将需要复制的图层拖拽到“新建图层”按钮上 。复制后的新图层会自动被放置在源图层的上方,并且与原来的位置重叠。也可以用<Ctrl+J>快捷键来复制图层。不过,这样的操作结果看上去像是复制图层,其实这是一个新建图层的过程,其对应的命令可以在“图层”菜单中的“新建”中找到,叫作“通过拷贝的图层”,意思是通过对目标图层的拷贝,新建一个和目标图层一样的图层。

d.链接图层。

在多图层文档中,如果要同时处理多个图层中的图像,如同时移动、应用变换或者创建剪贴蒙版,可将这些图层链接在一起再进行操作。在“图层”面板中选中要建立链接的图层,单击“链接图层”按钮 ,或者选择菜单栏中的“图层”→“链接图层”即可。如果要取消链接,可以选中其中要取消链接的图层,再单击 按钮。

e.排列与分布图层。

在“图层”面板中,图层是以创建的先后顺序堆叠排列的。按住鼠标左键拖动图层可以调整图层的堆叠顺序,从而改变图层内容显示的前后关系,总体显示效果也会相应改变。也可以选中某个图层,选择菜单栏中的“图层”→“排列”,从子菜单中选择“置为顶层”“前移一层”“后移一层”“置为底层”或“反向”来调节该图层的排列顺序。

如果在包含多图层的文档中要进行图层对齐与分布调整,可在“图层”面板中选中它们,然后在菜单栏中“图层”菜单中的“对齐”和“分布”的子菜单中选择要对齐与分布的方式。如果所选图层与其他图层已链接,则可以对齐与之链接的所有图层。

在对齐图层过程中,如果使用的是“移动工具” ,可以直接通过属性栏中的按钮 快速对齐或分布选中的图层。

f.图层合并与编组。

Photoshop运行时图层、图层组和图层样式都需要占用一定的计算机内存,如果将相同属性的图层合并,或者将没有用处的图层删除,可以减小文件的大小,释放内存空间。而且,对于多图层文件来说,图层数量变少后既方便管理,又可以快速找到需要的图层。

当文档中的两个或多个图层不再需要单独编辑,要将它们合并为一个图层时,可在“图层”面板中选中它们,然后选择菜单栏中的“图层”→“合并图层”。合并后的图层将使用最上面一个图层的名称。“向下合并图层”与“合并可见图层”的操作方式类似,“拼合图像”会将所有图层都拼合到“背景”图层中,如果其中有某个图层是隐藏的图层,则会弹出提示询问是否删除隐藏的图层。

一般合并图层都是减少图层数量,但还有一种图层合并的形式却会增加图层数量,这就是“盖印图层”。它是一种比较特殊的图层合并方法,可以将多个图层中的图像内容合并到一个新的图层中,同时保持其他图层完好无损,其快捷键是<Ctrl+Alt+E>。

在复杂的图像文件中,图层的数量往往很多且不能直接合并,这个时候就有必要采用图层组来组织和管理图层。它的作用类似于文件夹,将图层按照类别放在不同的组中后,当收起图层组时,在“图层”面板中就只显示图层组的名称。图层组可以像普通图层一样移动、复制、链接、对齐和分布,甚至可以合并以减小文件的大小。

创建图层组可直接单击“图层”面板中的“创建新组”按钮 ,这样将创建一个空的图层组。如果想要在创建图层组时设置组的名称、颜色、混合模式和不透明度等属性,可选择菜单栏中的“图层”→“新建”→“组”,在打开的“新建组”对话框中进行设置。

创建图层组后就可以在“图层”面板中将选中图层拖入其中,也可以展开图层组将其中某个图层移出。当然,也可以直接选中要编组的几个图层,选择菜单栏中的“图层”→“图层编组”,或者按快捷键<Ctrl+G>来进行编组。对编组不满意,要取消图层编组,但保留图层时,可以选择菜单栏中的“图层”→“取消图层编组”。如果在删除图层组的同时不保留组中的图层,可以直接将图层组拖拽到“图层”面板中的“删除图层”按钮 上。

g.调整图层样式。

图层样式也叫作图层效果,它可以为图层中的图像添加投影、发光、浮雕和描边等效果,创建具有真实质感的水晶、玻璃、金属和纹理特效。各种图层样式可以随时修改、隐藏或删除,使用方便灵活且不会对图层中的图像造成任何破坏。为图层添加图层样式时可选择菜单栏中的“图层”→“图层样式”,在子菜单中选择并打开到相应效果的设置对话框进行详细参数的设置;也可以在“图层”面板底部单击“添加图层样式”图标 ,在弹出的菜单中选择,或直接在“图层”面板中双击要添加图层样式的图层,打开“图层样式”对话框,如图2-1-43所示。

图2-1-43 “图层样式”对话框

添加图层样式后会在图层下方显示相应样式的名称,它与普通图层一样可通过单击“眼睛”图标来控制效果的可见性。如果要删除一种效果,可以把它拖拽到“图层”面板中的“删除图层”按钮 上。

在“图层”面板中,按住<Alt>键,将添加过图层样式的图层下的具体效果拖至其他图层名称上,可以将前者的样式效果复制给后者。

图2-1-44 “色板”面板

4)“色板”面板如图2-1-44所示。在进行设计时,可以将常用的色彩添加到“色板”面板里,方便下次直接使用。此项功能可以大大提高设计效率。

5)“通道”面板如图2-1-45所示。“通道”功能用得不多,通常在进行人像磨皮时,利用单个通道进行优化。“通道”另外一个比较强大的功能是可以快速去色,在进行一些单色或双色海报设计时,通常会利用通道对图片进行改造。

图2-1-45 “通道”面板

(5)工作区

整个视图界面中间的白色画布所在区域就是工作区了,所操作的图层都可以在这里得到展示,如图2-1-46所示。在工作区的上边缘可以看到作品标签,显示作品名称、预览比例、色彩模式等信息。可以利用工具栏中的“抓手工具”和“缩放工具”对工作区进行放大、缩小、平移等操作。当然,也可以按住<Space>键的同时按住鼠标左键拖拽来实现平移,按住<Alt>键配合鼠标滑轮前后滚动实现放大和缩小。

图2-1-46 工作区

【练习】使用选择工具和“钢笔工具”制作简单的水晶图标。

Step01 打开Photoshop后,在菜单栏中选择“文件”→“新建”,打开“新建文档”对话框。由于本次练习是为移动设备做设计,所以选择上方的“移动设备”选项卡,在该选项卡下选择“iPhone X(1125×2436像素@72ppi)”。选中该项后,右侧的详细设置部分会自动设置单位为“像素”,“分辨率”为“72像素/英寸”,“方向”为“纵向”,“颜色模式”为“RGB颜色”。检查所有设置无误后单击右下方的“创建”按钮,文件就创建完成了,如图2-1-47所示。

图2-1-47 创建文件

Step02 找到“图层”面板,单击面板下方的“创建新图层”按钮,创建一个新图层,如图2-1-48所示。

图2-1-48 创建新图层

确保该新建图层处于被选中状态,选择“矩形选框工具”组中的“椭圆选框工具”,按住<Shift>键以锁定高宽比,在任意位置单击,并拖拽出一个高(H)和宽(W)皆为128像素的圆形选区;然后先松开鼠标左键,再松开<Shift>键。效果如图2-1-49所示。

图2-1-49 建立圆形选区

Step03 选择“渐变工具”,单击界面上方属性栏上的色条打开“渐变编辑器”,如图2-1-50所示。双击“渐变编辑器”中色条下方左侧的滑块,打开“拾色器”对话框,选择一种浅蓝色(参数如图2-1-51所示),单击“确定”按钮。再双击“渐变编辑器”中色条下方右侧的滑块,打开“拾色器”对话框,选择一种深蓝色(参数如图2-1-52所示),单击“确定”按钮。单击“渐变编辑器”右上角的“确定”按钮,这样从浅到深的蓝色渐变色就设置好了。

图2-1-50 “渐变编辑器”

图2-1-51 浅蓝色色值设定

图2-1-52 深蓝色色值设定

Step04 按住<Shift>键以锁定渐变的方向,按住鼠标左键在圆形选区中从顶部向下拖拽到底部,然后松开鼠标左键,蓝色渐变色即填充完毕。效果如图2-1-53所示。然后按快捷键<Ctrl+D>,取消选区。

图2-1-53 填充蓝色渐变色

Step05 再新建一个图层,用“椭圆选框工具”创建一个椭圆形选区,如图2-1-54所示。

图2-1-54 创建椭圆形选区

选择“渐变工具”,打开“渐变编辑器”。这次做一个颜色从纯白色到纯白色的渐变效果,但是“不透明度”的渐变是从100%到0。“不透明度”的渐变通过调整“渐变编辑器”中色条上方左右滑块,如图2-1-55所示。

图2-1-55 渐变设置

Step06 按住<Shift>键以锁定渐变的方向,按住鼠标左键在椭圆形选区中从顶部向下拖拽到底部,松开鼠标左键,渐变色即填充完毕。效果如图2-1-56所示。然后,按快捷键<Ctrl+D>,取消选区,并使用“移动工具”将椭圆形移动到合适位置,高光就做好了。如果大小不合适,可按快捷键<Ctrl+T>后进行调整。

图2-1-56 填充渐变色

Step07 选择刚才做好的高光,按<Alt>键的同时按住鼠标左键并拖动高光,即可复制该图层。按快捷键<Ctrl+T>,然后将之旋转180°并放在下方,即做出反光效果,如图2-1-57所示。

图2-1-57 复制图层并进行调整

Step08 按快捷键<Ctrl+T>,然后把反光部分放大一些,并按数字键<6>,把反光部分的“不透明度”降低到60%。如果需要,再适当调整一下高光区的大小。效果如图2-1-58所示。

图2-1-58 调整效果

Step09 为了让图标显得更立体,可以为其添加投影。在“图层”面板中选中下方的圆形的图层,在该图层右侧双击,打开“图层样式”对话框,单击选中“投影”,为其设置一个深蓝色投影。其他参数设置如图2-1-59所示。

图2-1-59 设置“图层样式”

Step10 下面开始制作图标上的图案,这里设计了一本打开的书。选择“钢笔工具”,绘制如图2-1-60所示的书籍的左半边。在绘制时需要注意,在画面中单击会建立角点,在画面中单击并拖拽可建立圆弧点。(建立的时候可不用理会图形是否准确、美观。)

图2-1-60 绘制半边书籍

Step11 在属性栏中修改该图形“填充”颜色为白色,“描边”为“无颜色”,然后使用“路径选择工具”组中的“直接选择工具”,修改路径上的点,使其更美观。效果如图2-1-61所示。

图2-1-61 调整路径

Step12 修改完毕后选中该图层,按快捷键<Ctrl+J>复制图层,在新图层选择菜单栏中的“编辑”→“变换”→“水平翻转”以翻转图形,并将其放在合适的位置上。至此,水晶图标就做好了,如图2-1-62所示。

图2-1-62 完成设计

二、Photoshop进阶知识与应用

1.图像分辨率与尺寸

图像分辨率指图像中存储的信息量,是图像内每英寸有多少个像素点,分辨率的单位为ppi(Pixels Per Inch)。分辨率可以从显示分辨率与图像分辨率两个方向来分类。显示分辨率(屏幕分辨率)可反映屏幕图像的精密度,是指显示器屏幕所能显示的像素有多少。由于屏幕上的点、线和面都是由像素组成的,显示器屏幕可显示的像素越多,画面就越精细,同样大小的屏幕区域内能显示的信息也越多,所以分辨率是非常重要的性能指标之一。可以把整个图像想象成一个大型的棋盘,而分辨率的表示方式就是所有经线和纬线交叉点的数目。显示分辨率一定的情况下,显示屏越小图像越清晰;反之,显示屏大小固定时,显示分辨率越高图像越清晰。图像分辨率含义更趋近于分辨率本身的定义。

描述分辨率的单位有dpi(点/英寸)、lpi(线/英寸)和ppi(像素/英寸)。其中,lpi是描述光学分辨率的尺度的。虽然dpi和ppi也属于分辨率范畴的单位,但是它们的含义与lpi不同。lpi与dpi无法换算,只能凭经验估算。ppi和dpi的应用领域也存在区别:从技术角度说,“像素”只存在于电子产品显示领域,而“点”只出现于打印或印刷领域。

图像尺寸的长度与宽度是以像素为单位的(有的是以厘米为单位)。像素与分辨率是数码影像最基本的单位,每个像素就是一个小点,而不同颜色的点(像素)聚集起来就成为一幅图像。

图像分辨率越高,所需像素就越多,比如,分辨率为640像素×480像素的图像大概需要31万像素,2048像素×1536像素的图像则需要高达314万像素。图像分辨率和输出时的成像大小及放大比例有关,分辨率越高,成像尺寸越大,放大比例越高。

在Photoshop中打开一张图像,如图2-1-63所示。选择菜单栏中的“图像”→“图像大小”,如图2-1-64所示。在打开的“图像大小”对话框中,可以设置或修改图像大小与分辨率,如图2-1-65所示。

在平面设计中,图像的分辨率以ppi来度量,它和图像的宽、高尺寸一起决定了图像文件的大小及图像质量。比如,一幅图像宽8英寸、高6英寸,分辨率为100像素/英寸(ppi),如果保持图像文件的大小不变,也就是总的像素数不变,将分辨率降为50像素/英寸(ppi),在宽高比不变的情况下,图像的宽将变为16英寸、高将变为12英寸。打印输出变化前后的两幅图,可以发现,后者的幅面是前者的4倍,而且图像质量下降了许多。那么,让变化前后的两幅图在计算机显示器屏幕上显示会出现什么现象呢?比如,在显示器分辨率为800像素×600像素的屏幕上显示时,可以发现,这两幅图的画面尺寸一样,画面质量也没有区别。对于计算机的显示系统来说,一幅图的分辨率(ppi)值是没有意义的,起作用的是这幅图像所包含的总的像素数,也就是前面所讲的另一种分辨率表示方法:水平方向的像素数×竖直方向的像素数。这种分辨率表示方法同时也表示了图像显示时的宽、高尺寸。前面所讲的ppi值变化前后的两幅图,它们总的像素数都是800×600个,因此在显示时,两幅图像分辨率相同、幅面相同。

图2-1-63 打开图像

图2-1-64 “图像大小”

图2-1-65 修改图像大小和分辨率

2.图像的颜色模式

在Photoshop中,要查看图像的颜色模式或要在各种颜色模式之间进行转换,可选择菜单栏中的“图像”→“模式”。

(1)RGB颜色模式

RGB颜色模式是工业界的一种颜色标准,又称“真彩色模式”,一般用于图像处理,是设计人员最熟悉的颜色模式。它是将红色(Red)、绿色(Green)、蓝色(Blue)3种基本颜色相互叠加得到各种颜色的方法,R、G、B分别代表红、绿、蓝三个色光通道的颜色,几乎可配置出几乎人类视觉所能感知的所有颜色,RGB是目前运用最广泛的颜色模式之一。Photoshop中RGB颜色模式的“颜色”面板如图2-1-66所示。

图2-1-66 Photoshop“颜色”面板(RGB颜色模式)

(2)CMYK颜色模式

CMYK颜色模式是一种印刷模式。当阳光照射到一个物体上时,这个物体将吸收一部分光线,并将剩下的光线反射,反射的光线颜色就是人们所看见的物体颜色。这是一种减色色彩模式,不但人们看物体的颜色时涉及这种模式,在纸上印刷时应用的也是这种模式。

C、M、Y、K分别代表印刷上用的4种颜色,C代表青色(Cyan),M代表洋红色(Magenta),Y代表黄色(Yellow),K代表关键版(Key plate),也就是黑色。因为在实际应用中青色、洋红色和黄色很难叠加形成真正的黑色,所以才引入了K(黑色)。黑色的作用是强化暗调,加深暗部色彩。Photoshop中CMYK颜色模式的“颜色”面板如图2-1-67所示。

(3)HSB颜色模式

图2-1-67 Photoshop“颜色”面板(CMYK颜色模式)

图2-1-68 Photoshop“颜色”面板(HSB颜色模式)

H(Hue)表示色相(色度),S(Saturation)表示饱和度,B(Brightness)表示亮度。平常表述颜色时,一般用的就是HSB颜色模式,因为人眼看到的就是色相、饱和度和明度。一般在进行界面设计时,设计师们也喜欢使用HSB颜色模式调色,因为通过它可以很方便地使色彩统一为一个色调。Photoshop中HSB颜色模式的“颜色”面板如图2-1-68所示。

H(色相):在0°~360°的标准色相环上,色相是按角度区分的。在通常情况下,色相是由颜色名称标识的,如红色、绿色或橙色。

S(饱和度):它是颜色的强度或纯度。饱和度表示色相中颜色成分所占的比例,用0(灰色)~100%(完全饱和)的百分比来度量。在标准色相环上饱和度是从中心逐渐向边缘递增的。

B(亮度):它是颜色的相对明暗程度,通常是用0(黑)~100%(白)的百分比来度量的。

(4)Lab颜色模式

Lab颜色模式是由国际照明委员会(CIE)于1976年发布的一种色彩模式。RGB颜色模式是一种加色模式,CMYK颜色模式是一种印刷减色模式,而Lab颜色模式既不依赖光线,也不依赖颜料,它是CIE确定的一个理论上包括了人眼可以看见的所有色彩的色彩模式。

Lab颜色模式所定义的色彩最多且与光线及设备无关。而且Lab颜色模式在转换成CMYK颜色模式时色彩不会丢失或被替换。因此,最佳避免色彩损失的方法是:应用Lab颜色模式编辑图像,再将之转换为CMYK颜色模式打印输出。将RGB颜色模式转换成CMYK颜色模式时,Photoshop将自动将RGB颜色模式转换为Lab颜色模式,再转换为CMYK颜色模式。

在表达色彩范围方面,处于第一位的是Lab颜色模式,第二位的是RGB颜色模式,第三位是CMYK颜色模式。

Lab颜色模式的好处在于它弥补了RGB颜色模式和CMYK颜色模式的不足。RGB颜色模式在蓝色与绿色之间的过渡色太多,绿色与红色之间的过渡色又太少;CMYK颜色模式在编辑处理图片的过程中损失的色彩很多;Lab颜色模式在这些方面都有所补偿。但是要注意,在Photoshop中很多功能都不能用Lab颜色模式。

3.Photoshop软件中常用的存储图像方式

Photoshop软件中常用的存储图像方式见表2-1-2。

表2-1-2 Photoshop软件中常用的存储图像方式

(续)

4.强大的去背景功能——选择并遮住

选择矩形选框工具组、套索工具组或魔棒工具组时,在属性栏中便会出现“选择并遮住”选项,如图2-1-69所示。“选择并遮住”的工作区分为工具栏、属性栏、“属性”面板,如图2-1-70所示。

图2-1-69 “选择并遮住”选项

图2-1-70 “选择并遮住”工作区

(1)工具

1)快速选择工具 :当单击或单击并拖动要选择的区域时,会根据颜色和纹理相似性进行快速选择。所选的选区不需要很精确,因为“快速选择工具”会自动且直观地创建边框。为了获得更加轻松的操作体验,在使用快速选择工具时,请单击“选择主体”;只需单击一次即可自动选择图像中最突出的主体。

2)调整边缘画笔工具 :精确调整边缘的边界区域。例如,轻刷柔化区域(如头发或毛皮)以向选区中加入精妙的细节。要更改画笔的大小,按<[>或<]>键。

3)画笔工具 :使用“快速选择工具”(或其他选择工具)对目标区域先进行粗略选择,然后使用“调整边缘画笔工具”对其进行调整。接下来,使用“画笔工具”来完成或清理细节。使用“画笔工具”可按照两种简便的方式微调选区:在添加模式下,绘制想要选择的区域;或者,在减去模式下,绘制不想选择的区域。

4)套索工具 :手绘选区边框。使用此工具,可以创建精确的选区。

5)多边形套索工具 :绘制选区边框的直边线段。使用此工具,可以绘制直线或自由选区。通过鼠标右键单击“套索工具”时,可以从快捷菜单中选择此工具。

6)抓手工具 :使用此工具可快速拖动画布。还可以在使用任何其他工具时,按住<Space>键来快速切换到“抓手工具”。

7)缩放工具 :用于缩放和阅览图像。

(2)选区

1)添加或减去:添加或删减调整区域。如有必要,请调整画笔大小。

2)对所有图层取样:根据所有图层,而非仅是当前选定的图层来创建选区。

3)选择主体:单击选择图像中的主体。

4)调整细线:只需单击一下,即可轻松查找和调整难以选择的头发等。与“对象识别”结合使用可获得最佳效果。

(3)调整选区

在“选择并遮住”工作区的“属性”面板中调整选区。具体可调整的设置如下所示。

1)视图模式设置。

●视图:从“视图”下拉菜单中,为选区选择一种视图模式,如图2-1-71所示。

洋葱皮:选区显示为动画样式的洋葱皮结构。

图2-1-71 “视图”下拉菜单

闪烁虚线:选区边框显示为闪烁虚线。

叠加:选区显示为透明颜色叠加,未选中区域显示为叠加颜色,默认颜色为红色。

黑底:将选区置于黑色背景上。

白底:选区置于白色背景上。

黑白:选区显示为黑白蒙版。

图层:选区周围变成透明区域。

●显示边缘:显示调整区域。

●显示原稿:显示原始选区。

●高品质预览:此选项可能会影响性能。选中此选项后,在处理图像时,按住鼠标左键(向下滑动)可以查看更高分辨率的预览效果。取消选中此选项后,即使向下滑动鼠标,显示的也是更低分辨率的预览。

●透明度/不透明度:为“视图模式”设置透明度/不透明度。

2)调整模式。

●设置“边缘检测”“调整细线”和“调整边缘画笔工具”所用的边缘调整方法。

●颜色识别:对于简单背景或对比强烈的背景适合选择此模式。

●对象识别:选取复杂背景上的毛发或毛皮等时适用此模式。

3)“边缘检测”设置。

“边缘检测”设置项如图2-1-72所示。

●半径:确定发生边缘调整的选区边框的大小。对较尖锐的边缘使用较小的半径,对较柔和的边缘使用较大的半径。

●智能半径:允许选区边缘出现宽度可变的调整区域。如果选区是涉及头发和肩膀的人物肖像,此选项会十分有用。在边缘趋向一致的人物肖像中,可能需要为头发设置比肩膀更大的调整区域。

图2-1-72 设置“边缘检测”

4)“全局调整”设置。

“全局调整”设置项如图2-1-73所示。

●平滑:减少选区边框中的不规则区域(山峰和低谷),以创建较平滑的轮廓。

●羽化:模糊选区与周围像素之间的过渡效果。

●对比度:增大对比度时,沿选区边框柔和边缘的过渡会变得不连贯。通常情况下,使用“智能半径”并结合其他调整工具效果会更好。

图2-1-73 设置“全局调整”

●移动边缘:负值表示向内移动柔化边缘的边框,正值表示向外移动边框。向内移动这些边框有助于从选区边缘移去不想要的背景颜色。

图2-1-74 设置“输出设置”

5)“输出设置”设置。

“输出设置”设置项如图2-1-74所示。

●净化颜色:将边的颜色替换为附近完全选中的像素的颜色。颜色替换的强度与选区边缘的软化度是成比例的。调整滑块位置以更改净化量。默认值为100%(最大强度)。由于此功能更改了像素颜色,因此它需要被输出到新图层或文档中。建议保留原始图层,这样可以在需要时恢复到原始状态。

●输出到:决定调整后的选区成为当前图层上的选区或蒙版,还是生成一个新图层或文档。

5.图层混合模式

图层混合模式用于控制上下图层中图像的混合效果,在设置混合模式的同时通常还需要调节图层的不透明度,以使画面的效果更理想。

图层混合模式的使用方法非常简单,只需要将不同的图层按一定的顺序排列,选择要设置混合模式的图层,单击“图层”面板中的“正常”以打开下拉列表,如图2-1-75所示。在弹出的27种图层混合模式中选择合适的混合模式即可,如图2-1-76所示。每种混合模式的具体含义如下所式。

●正常:上方图层完全遮盖下方图层。

●溶解:如果上方图像具有柔和的半透明边缘,选择该选项,可创建像素点状效果。

●变暗:以上方图层中较暗像素代替下方图层中与之对应的较亮像素,且以下方图层中的较暗区域代替上方图层中的较亮区域,因此,叠加后整体图像呈暗色调。

●正片叠底:上方图层及下方图层中较暗的像素合成图像效果。

●颜色加深:通常用于创建非常暗的阴影效果。

●线性加深:选择此模式时,察看每一个颜色通道的颜色信息,压暗所有通道的基色,并通过提高其他颜色的亮度来反映混合颜色。此模式对白色无效。

●深色:可以依据图像的饱和度,用当前图层中的颜色,直接覆盖下方图层中的暗调区域颜色。

图2-1-75 图层混合模式

图2-1-76 27种图层混合模式

●变亮:与“变暗”模式相反,以上方图层中较亮像素代替下方图层中与之对应的较暗像素,且以下方图层中的较亮区域代替上方图层中的较暗区域,因此,叠加后整体图像呈亮色调。

●滤色:与“正片叠底”模式相反,在整体效果上显示由上方图层及下方图层像素值中较亮的像素合成图像效果,通常能够得到一种漂白图像中颜色的效果。

●颜色减淡:可以生成非常亮的合成效果。其原理为,上方图层的像素值与下方图层的像素值以一定的算法相加。此模式通常被用来创建光源中心点极亮的效果。

●线性减淡(添加):加亮所有通道的基色,并通过降低其他颜色的亮度来反映混合颜色。此模式对黑色无效。

●浅色:与“深色”模式刚好相反,选择此模式时,可以依据图像的饱和度,用当前图层中的颜色,直接覆盖下方图层中的高光区域颜色。

●叠加:图像最终的效果取决于下方图层,但上方图层的明暗对比效果也将直接影响整体效果。叠加后,下方图层的亮度区与阴影区仍被保留。

●柔光:使颜色变亮或变暗,具体取决于混合色。如果上方图层的像素比50%灰色亮,则图像变亮;反之,图像变暗。

●强光:产生的叠加效果与“柔光”模式的类似,但其加亮与变暗的程度较柔光模式大许多。

●亮光:如果混合色比50%灰度亮,会通过降低对比度来加亮图像;反之,通过提高对比度来使图像变暗。

●线性光:如果混合色比50%灰度亮,会通过提高对比度来加亮图像;反之,通过降低对比度来使图像变暗。

●点光:通过置换颜色像素来混合图像。如果混合色比50%灰度亮,比原图像暗的像索会被置换,而比原图像亮的像素无变化;反之,比原图像亮的像素会被置换,而比原图像暗的像素无变化。

●实色混合:可创建一种具有较硬的边缘的图像效果,类似于多块实色混合。

●差值:可从上方图层中减去下方图层相应处像素的颜色值。此模式通常使图像变暗并取得反相效果。

●排除:可创建一种与“差值”模式相似,但对比度较低的效果。

●减去:使用上方图层中亮调的图像隐藏下方的内容。

●划分:可以在上方图层中加上下方图层相应处像素的颜色值,通常用于使图像变亮。

●色相:最终图像的像素值由下方图层亮度值和饱和度值及上方图层的色相值构成。

●饱和度:最终图像的像素值由下方图层亮度值和色相值及上方图层的饱和度值构成。

●颜色:最终图像的像素值由下方图层的亮度值及上方图层的色相和饱和度值构成。

●明度:最终图像的像素值由下方图的色相值和饱和度值及上方图层的明度值构成。

6.制作简单立体UI图标

(1)设计要求

1)设计移动设备(如手机)界面中的横向长条形开关按钮,用立体形式表现。

2)采用RGB颜色模式,分辨率为72像素/英寸。

3)按钮宽度为320像素、高度为100像素。

4)制作打开与关闭两种状态。

(2)实施操作

Step01 打开Photoshop后,在菜单栏中选择“文件”→“新建”,打开“新建文档”对话框。由于是为移动设备做设计,所以应该选择上方的“移动设备”选项卡,在该选项卡下选择“iPhone X(1125×2436像素@72ppi)”。选择该项后,右侧的详细设置部分会自动设置单位为“像素”,“分辨率”为“72像素/英寸”,“方向”为“纵向”,“颜色模式”为“RGB颜色”。在检查所有设置无误后,单击右下方的“创建”按钮,文件就创建完成了,如图2-1-77所示。

图2-1-77 新建文件

Step02 根据设计需求(该按钮为横向长条形),可以将之制作成美观的药丸形,因此要利用矩形工具组下的“圆角矩形工具”。在菜单栏下方的属性栏的右侧找到“半径”,输入值为“50像素”,这个半径指的就是之后要做的圆角矩形的圆角半径。在画布中利用鼠标绘出一个宽度为320像素、高度为100像素的圆角矩形,如图2-1-78所示。或者在选择了“圆角矩形工具”后直接在画布中单击,弹出“创建圆角矩形”对话框,通过输入合适的值直接建立圆角矩形,如图2-1-79所示。

图2-1-78 绘制圆角矩形

图2-1-79 “创建圆角矩形”对话框

Step03 圆角矩形画完后,在上方属性栏中将“填充”改为任意颜色,将“描边”改为“无颜色”。在“图层”面板中找到刚建立的圆角矩形路径图层,双击该图层右半侧,打开“图层样式”对话框。选择左侧样式中的“渐变叠加”(单击文字),如图2-1-80所示,在右侧的详情中找到“渐变”,单击色条打开“渐变编辑器”。

图2-1-80 渐变叠加

双击“渐变编辑器”中色条下方左侧的滑块,打开“拾色器”对话框,选择一种中间灰色,如图2-1-81所示,单击“确定”按钮。再双击“渐变编辑器”中色条下方右侧的滑块,打开“拾色器”对话框,选择一种浅灰色,单击“确定”按钮,关闭“拾色器”。这样渐变色就设置好了,单击“渐变编辑器”右上角的“确定”按钮,返回“图层样式”对话框。把“角度”改为“-90度”,如图2-1-82所示,单击“确定”按钮,图层样式就创建完成了。

Step04 新建一个宽度为300像素、高度为80像素的圆角矩形,圆角半径为40像素。填色方式与Step 03的类似,但这次的渐变色为蓝色,且重色在下,如图2-1-83所示。

图2-1-81 设置“渐变叠加”中的灰色

图2-1-82 “渐变叠加”图层样式设置完成

图2-1-83 制作蓝色圆角矩形

Step05 将Step 04创建的圆角矩形叠放在Step 03创建的圆角矩形上,并对正二者的中心点,这样一个看起来凹进去的按钮底座就形成了。为了增强立体感,再一次打开蓝色圆角矩形的“图层样式”,添加内阴影效果。参数设置及效果如图2-1-84所示。

图2-1-84 添加内阴影

Step06 选择矩形工具组下的“椭圆工具”,绘制一个直径为90像素的圆形,填色方式与Step 03的类似。在添加了“渐变叠加”效果后,形成一个浅灰色的、上明下暗的按钮形状,将其放到按钮底座相应的位置上。效果如图2-1-85所示。

图2-1-85 制作圆形按钮

Step07 为了增强按钮的立体感,再为其加入“斜面和浮雕”及“投影”两个图层样式。参数设置分别如图2-1-86和图2-1-87所示。

图2-1-86 斜面和浮雕参数

图2-1-87 投影参数

Step08 为了让按钮再复杂一点儿,可以在按钮上加一个摩擦点。绘制一个直径为35像素的圆形,填色方法与大圆形的类似,再为这个圆形加入浅灰色的且上暗下明的“渐变叠加”效果。将其放在大圆形中心,呈打开状态的立体按钮就做好了,效果如图2-1-88所示。

图2-1-88 完成呈打开状态的立体按钮

Step09 接下来制作呈关闭状态的按钮。在“图层”面板中选中所有图层,然后按住<Alt>键(复制)和<Shift>键(控制运动方向),再按住鼠标左键向下拖拽,在合适的位置松开鼠标左键,一个新的按钮就复制好了,如图2-1-89所示。

图2-1-89 复制按钮

Step10 选中新复制出来的大小两个圆形并将两个图层链接,移动其位置到右侧,如图2-1-90所示。

图2-1-90 移动圆形按钮

Step11 找到蓝色圆角矩形的图层,打开其“图层样式”对话框,把“渐变叠加”的颜色改为灰色,呈关闭状态的按钮就做好了,效果如图2-1-91所示。

图2-1-91 制作完成 vmfa9rKCKbk7ChXcVjaJLrhevHLudPoh4GyE5KxNfI3bHNZ79TlXdHqyVkuYX9uO

点击中间区域
呼出菜单
上一章
目录
下一章
×