第一讲photoshop基础知识教学课件.ppt
第一讲 photoshop基础知识,网页开发工具第一讲 photoshop基础知识,1.1 色彩模式,在自然界所看到的各种色彩都是由三种色光或三种颜色组成的，它们本身不能再拆分出其他的颜色成分，所以称为三原色。三原色分为光学三原色和物理三原色，三原色各自混合后，形成了不同的色彩体系。 在进行图形图像处理时，色彩模式以建立好的描述和重现色彩的模型为基础，每一种模式都有它自己的特点和适用范围，用户可以按照制作要求来确定色彩模式，并且可以根据需要在不同的色彩模式之间转换。,网页开发工具第一讲 photoshop基础知识,色轮是颜色处理的核心,绝大多数颜色控制都是基于传统的色轮，理解色轮的基本概念（色相、饱和度和亮度）就能更好地控制photoshop的颜色。,网页开发工具第一讲 photoshop基础知识,1.1.1 HSB色彩模式,HSB色彩模式是根据日常生活中人眼的视觉特征而制定的一套色彩模式，最接近于人类对色彩辨认的思考方式。HSB色彩模式以色相（H）、饱和度（S）和亮度（B）描述颜色的基本特征。,网页开发工具第一讲 photoshop基础知识,色相指从物体反射或透过物体传播的颜色。在0到360度的标准色轮上，色相是按位置计量的。在通常的使用中，色相由颜色名称标识，比如红、橙或绿色。 饱和度是指颜色的强度或纯度，用色相中灰色成分所占的比例来表示，0%为纯灰色，100%为完全饱和。在标准色轮上，从中心位置到边缘位置的饱和度是递增的。 亮度是指颜色的相对明暗程度，通常将0%定义为黑色，100%定义为白色。,网页开发工具第一讲 photoshop基础知识,在HSB模式中，S和B的取值都是百分比，唯有H的取值单位是度，这个度是什么意思？ 是角度，表示色相位于色相环上的位置，将我们前面学过的色相环加上角度标志就明白了，如下图：,从0度的红色开始，逆时针方向增加角度，60度是黄色，180度是青色等等。360度又回到红色。打开photoshop中的拾色器进行各种调整可以看到效果。,网页开发工具第一讲 photoshop基础知识,1.1.2 RGB色彩模式,自然界中绝大部分的可见光谱可以用红、绿和蓝三色光按不同比例和强度的混合来表示。RGB分别代表着3种颜色：R代表红色，G代表绿色、B代表蓝色。RGB模型也称为加色模型，如图所示。RGB模型通常用于光照、视频和屏幕图像编辑。,电脑屏幕上的所有颜色，都由这红色绿色蓝色三种色光按照不同的比例混合而成的。一组红色绿色蓝色就是一个最小的显示单位。 屏幕上的任何一个颜色都可以由一组RGB值来记录和表达。,网页开发工具第一讲 photoshop基础知识,我们用放大镜就近观察电脑显示器或电视机的屏幕，会看到数量极多的分为红色绿色蓝色三种颜色的小点。如下左图，下右图是左图的局部放大。屏幕上的所有颜色，也就是我们看到的所有图像内容，都是由它们调和而成的。,网页开发工具第一讲 photoshop基础知识,RGB色彩模式使用RGB模型为图像中每一个像素的RGB分量分配一个0255范围内的强度值。例如：纯红色R值为255，G值为0，B值为0；灰色的R、G、B三个值相等（除了0和255）；白色的R、G、B都为255；黑色的R、G、B都为0。RGB图像只使用三种颜色，就可以使它们按照不同的比例混合，在屏幕上重现16581375种颜色。 按照计算，256级的RGB色彩总共能组合出约1678万种色彩，即256×256×25616777216。 通常也被简称为1600万色或千万色。也称为24位色(2的24次方)。这24位色还有一种较为怪异的称呼是8位通道色，为什么这样称呼呢？ 这里的所谓通道，实际上就是指三种色光各自的亮度范围，我们知道其范围是256，256是2的8次方，就称为8位通道色。,网页开发工具第一讲 photoshop基础知识,我们所看到的图片实际是由三个部分组成的。,网页开发工具第一讲 photoshop基础知识,可以把三原色光比作三盏不同颜色的可调光台灯，那么通道就相当于调光的按钮。 对于单独的R或G或B而言，当数值为0的时候，代表这个颜色不发光；如果为255，则该颜色为最高亮度。 这就好像调光台灯一样，数字0就等于把灯关了，数字255就等于把调光旋钮开到最大。 现在思考一下： 屏幕上的纯黑、纯白、最红色、最绿色、最蓝色、最黄色的RGB值各是多少？,网页开发工具第一讲 photoshop基础知识,1.1.3 CMYK色彩模式,CMYK也称作印刷色彩模式，顾名思义就是用来印刷的。 它和RGB相比有一个很大的不同： RGB模式是一种发光的色彩模式，你在一间黑暗的房间内仍然可以看见屏幕上的内容； CMYK是一种依靠反光的色彩模式，我们是怎样阅读报纸的内容呢？是由阳光或灯光照射到报纸上，再反射到我们的眼中，才看到内容。 它需要由外界光源，如果你在黑暗房间内是无法阅读报纸的。,网页开发工具第一讲 photoshop基础知识,只要在屏幕上显示的图像，就是RGB模式表现的。现在加上一句：只要是在印刷品上看到的图像，就是CMYK模式表现的。 和RGB类似，CMY是3种印刷油墨名称的首字母：青色Cyan、洋红色Magenta、黄色Yellow。 而K取的是black最后一个字母，之所以不取首字母，是为了避免与蓝色(Blue)混淆。 从理论上来说，只需要CMY三种油墨就足够了，它们三个加在一起就应该得到黑色。 但是由于目前制造工艺还不能造出高纯度的油墨，CMY相加的结果实际是一种暗红色。因此还需要加入一种专门的黑墨来中和。,网页开发工具第一讲 photoshop基础知识,CMYK色彩模式以打印油墨在纸张上的光线吸收特性为基础，图像中每个像素都是由靛青（C）、品红（M）、黄（Y）和黑（K）色按照不同的比例合成。每个像素的每种印刷油墨会被分配一个百分比值，最亮（高光）的颜色分配较低的印刷油墨颜色百分比值，较暗（暗调）的颜色分配较高的百分比值。 例如，明亮的红色可能会包含2%青色、93%洋红、90%黄色和0%黑色。在 CMYK 图像中，当所有4种分量的值都是0%时，就会产生纯白色。,网页开发工具第一讲 photoshop基础知识,CMYK色彩模式的图像中包含四个通道，如图所示。我们所看见的图形是由这4个通道合成的效果。,网页开发工具第一讲 photoshop基础知识,色轮中的互补色存在互相吸收的特性。,互补色,网页开发工具第一讲 photoshop基础知识,RGB是加色模式，CMYK是减色模式。两种加色相加得到一种减色，两种减色相加将得到一种加色。,RGB和CMYK色彩模式之间的关系,网页开发工具第一讲 photoshop基础知识,1.2 像素和分辨率,分辨率用于衡量图像细节的表现能力，在图形图像处理中，常常涉及到的分辨率的概念有以下几种不同的形式： 显示器分辨率 图像分辨率 打印机分辨率,网页开发工具第一讲 photoshop基础知识,1.2.1 显示器分辨率,显示器分辨率是指显示器上每单位长度显示的像素或点的数目，通常以点英寸（dpi）为计量单位。显示器分辨率决定于显示器尺寸及其像素设置，PC显示器典型的分辨率为96 dpi。 在平时的操作中，图像像素被转换成显示器像素或点，这样，当图像的分辨率高于显示器的分辨率时，图像在屏幕上显示的尺寸比实际的打印尺寸大。例如，在96 dpi的显示器上显示1×1平方英寸、192像素/英寸的图像时，屏幕上将以2×2平方英寸的区域显示。,网页开发工具第一讲 photoshop基础知识,1.2.2 图像分辨率,图像分辨率是指单位图像线性尺寸中所包含的像素数目，通常以像素英寸（ppi）为计量单位.打印尺寸相同的两幅图像，高分辨率的图像比低分辨率的图像所包含的像素多。 例如：打印尺寸为1×1平方英寸的图像，如果分辨率为72 ppi，包含的像素数目为5184（72×72=5184）.如果分辨率为300ppi，图像中包含的像素数目则为90000.高分辨率的图像在单位区域内使用更多的像素表示，打印时它们能够比低分辨率的图像重现更详细和更精细的颜色转变。,网页开发工具第一讲 photoshop基础知识,要确定使用的图像分辨率，应考虑图像最终发布的媒介。如果制作的图像用于计算机屏幕显示，图像分辨率只需满足典型的显示器分辨率（72 ppi或96ppi）即可。如果图像用于打印输出，那么必须使用的高分辨率（150 ppi或300ppi），低分辨率的图像打印输出会出现明显的颗粒和锯齿边缘。 需要注意的是，如果原始图像的分辨率较低，由于图像中包含的原始像素的数目不能改变，因此，简单地提高图像分辨率不会提高图像品质。,网页开发工具第一讲 photoshop基础知识,1.2.3 打印机分辨率,打印机分辨率是指打印机每英寸产生的油墨点数，大多数激光打印机的输出分辨率为300dpi 600dpi，高档的激光照排机在1200dpi以上。 打印机的DPI是印刷上的计量单位，指每平方英寸上印刷的网点数。印刷上计算的网点大小（Dot）和计算机屏幕上显示的像素（Pixel）是不同的。 一般对于打印分辨率，印刷行业有一个标准：300dpi。就是指用来印刷的图像分辨率，至少要为300dpi 才可以，低于这个数值印刷出来的图像不够清晰。,网页开发工具第一讲 photoshop基础知识,如果打印或者喷绘，只需要72dpi 就可以了。注意这里说的是打印不是印刷。打印是指用普通的家用或办公喷墨打印机。喷绘就是街头的大幅面广告，因为需求数量少一般不作印刷。因为印刷有一个起步成本，数量越多单价就越便宜。比如印1000份需要500元，而印3000份可能总共也只需要1000元就可以了。所以一般的街头广告(比如公车站的灯箱广告)都是使用大幅面喷绘机制作的。喷绘机的工作原理和喷墨打印机类似，只是体积大上许多，价格也较为昂贵。 打印分辨率和打印尺寸，顾名思义就是在在那些需要打印或印刷的用途上才起作用。比如海报设计，报纸广告等。,网页开发工具第一讲 photoshop基础知识,图像的两种尺寸和换算关系： 1、一种是像素尺寸，也称显示大小或显示尺寸。等同于图像的像素值。 2、一种是打印尺寸，也称打印大小。需要同时参考像素尺寸和打印分辨率才能确定。 3、在分辨率和打印尺寸的长度单位一致的前提下(如像素/英寸和英寸)，像素尺寸÷分辨率=打印尺寸。 在后面的课程中，我们提到图像尺寸的时候一般单位是指像素。而对于网页设计等主要在屏幕上显示的用途来说，则不必去理会打印分辨率和打印尺寸。只需要按照像素去定义图像大小就可以了。,网页开发工具第一讲 photoshop基础知识,1. 3 图像类型,我们所看到的图像，究竟是如何构成的呢？这就需要涉及到图像类型的概念。电脑中的图像类型分为两大类，一类称为点阵图，一类称为矢量图。 1、点阵图 点阵图顾名思义就是由点构成的，如同用马赛克去拼贴图案一样，每个马赛克就是一个点，若干个点以矩阵排列成图案。 数码相机拍摄的照片、扫描仪扫描的稿件以及绝大多数的图片都属于点阵图。 2、矢量图 矢量图像属于描述性，以线段和计算公式作为记录的对象。,网页开发工具第一讲 photoshop基础知识,比如下面这幅图中的直线： 如果以点阵方式来记录，就是从左上角第一个点开始，到右下角最后一个点结束，记录所有像素的颜色。 记录这幅图像(200×50像素)就需要1万个信息。即使这条直线本身并没有那么多像素，但点阵方式也是完整的把整幅图的像素记录下来。 因此不管是一条直线还是两条三条，对于点阵图像来说都是一样的。都是去逐个记录图像中的所有像素。 如果用矢量来记录这条直线，只需要三个信息：直线起点坐标、直线终点坐标、直线的颜色。在还原的时候就利用这三个信息去生成图像即可。,网页开发工具第一讲 photoshop基础知识,显示器是点阵的，包括传统的CTR显示器、液晶显示器、等离子显示器等。这就造成一个事实，无论你在制作时候采用点阵还是矢量，在显示器上显示出来的话，最终还是以点阵方式展现的。而两者的区别，只体现在对图像的处理过程中了。就如同我们在课程#01中讲到的RGB色彩一样：无论使用何种色彩模式，只要是在显示器上显示，最终是转换为RGB的。 那既然最终是点阵输出，那使用矢量图像还有什么意义呢？ 即使输出的是点阵，但矢量图像仍有重要意义，因为在制作过程中矢量图像具有优越的可编辑性。那么究竟在制作过程中，使用点阵图像好呢还是矢量图像？注意这里说的是在制作过程中。制作完成后的图像保存格式另有说法。,网页开发工具第一讲 photoshop基础知识,Photoshop是以点阵图像为主的软件，虽然它针对矢量图像的操作和效果非常有限。但仍然可以为我们带来极大的便利。 矢量的图像缩放自如，它就具有可修改性。而点阵的图像在缩放操作上就没有可修改性或者说可修改性很差。 在Photoshop和Illustrator中，点阵图像和矢量图像可以同时存在，矢量图像可以很容易地转换为点阵图像，而点阵图像要转为矢量则要复杂一些。,网页开发工具第一讲 photoshop基础知识,1. 4 图像格式选择,通用的保存图像的文件格式也都是点阵的，比如BMP、TIF、JPG、GIF、PNG等。所谓通用就是大多数软件都能支持的文件格式。 在网页中的常用图像格式是JPG、GIF、PNG。其中JPG也称为JPEG或者JPE。 Photoshop的专用格式是PSD，有时候可能需要把图像给别人看，而别人的电脑上或许并没有安装Photoshop，他可能就无法正确打开PSD文件。那么这时你可以另外储存一个通用文件格式给他，比如保存为BMP。,网页开发工具第一讲 photoshop基础知识,1. PSD格式 PSD是Photoshop特有的图像文件格式，支持Photoshop中所有的图像类型。它可以将所编辑的图像文件中的所有有关图层和通道的信息记录下来。所以，在编辑图像的过程中，通常将文件保存为PSD格式，以便于重新读取需要的信息。 但是，PSD格式的图像文件很少为其他软件和工具所支持。所以，在图像制作完成后，通常需要转换为一些比较通用的图像格式，以便于输出到其他软件中继续编辑。另外，用PSD格式保存图像时，图像没有经过压缩。所以，当图层较多时，会占很大的硬盘空间。图像制作完成后，除了保存为通用的格式以外，最好再存储一个PSD的文件备份，直到确认不需要在Photoshop中再次编辑该图像。,网页开发工具第一讲 photoshop基础知识,2. BMP格式 BMP是DOS和Windows兼容计算机系统的标准Windows图像格式。BMP格式支持RGB、索引色、灰度和位图色彩模式，但不支持Alpha通道。彩色图像存储为BMP格式时，每一个像素所占的位数可以是1位、4位、8位或32位，相对应的颜色数也从黑白一直到真彩色。对于使用Windows格式的4位和8位图像，可以指定采用RLE压缩。这种格式在PC机上应用非常普遍。,网页开发工具第一讲 photoshop基础知识,3. JPEG格式 JPEG是一种有损压缩格式，当您将图像保存为JPEG格式时，可以指定图像的品质和压缩级别。Photoshop 6.0设置了12个压缩级别，在Quality文本框中输入数值可以改变保存的图像的品质和压缩程度。参数设置为12时，图像的品质最佳，但压缩量最小。JPEG格式会损失数据信息，因此，在图像编辑过程中需要以其他格式（如PSD格式）保存图像，将图像保存为JPEG格式只能作为制作完成后的最后一步操作。,网页开发工具第一讲 photoshop基础知识,4. GIF格式 GIF格式可以极大地节省存储空间，因此常常用于保存作为网页数据传输的图像文件。该格式不支持Alpha通道，最大缺点是最多只能处理256种色彩，不能用于存储真彩色的图像文件。但GIF格式支持透明背景，可以较好地与网页背景融合在一起。,网页开发工具第一讲 photoshop基础知识,1. 5 开始使用photoshop,打开Photoshop后是一片空白，我们需要新建图像用来绘图。,网页开发工具第一讲 photoshop基础知识,预设指的是已经预先定义好的一些图像大小。如果在预设中选择A4、A3或其他和打印有关的预设，高宽会转为厘米，打印分辨率会自动设为300。如果选择640x480这类的预设，分辨率则为72，高宽单位是像素。宽度和高度可以自行填入数字，但在填入前应先注意单位的选择是否正确。避免把640像素输入成640厘米之类。分辨率一般应为“像素/英寸”为准。 色彩模式的选择：如果是印刷或打印用途选择CMYK；其余用途选择RGB即可。而如果用灰度模式图像中就不能包含色彩信息；位图模式下图像只能有黑白两种颜色；LAB模式我们将在以后介绍。色彩模式后面的通道数一般我们只选用8位就足够了。但如果颜色模式选择位图的话，通道数只能是1位的。,网页开发工具第一讲 photoshop基础知识,1、从工具栏选择画笔工具，如果选中了铅笔就SHIFT B切换到画笔。然后按下D。D的作用是将Photoshop的颜色设置为默认的前景色黑色、背景色白色。也可以点击工具栏颜色区的默认按钮(下左图绿色圆圈部分)。而蓝色圆圈部分是交换前景和背景色，如果现在按下前景色将变为白色而背景色变为黑色，它的快捷键是X。,1.5.1 画笔工具的使用,网页开发工具第一讲 photoshop基础知识,然后在公共栏点击下中图绿色圆圈处打开画笔预设，选择绿色方块处的项目即可。这样就选择了9像素大小的笔刷，模式选择正常，不透明度和流量都为100%。 也可以不通过预设，参照下图直接把笔刷的主直径（笔刷是一个圆，因此用圆的直径来表示笔刷的粗细）设为9像素，再将硬度设为100%。 如果点击下图绿色圆圈处之后没有出现绿色方块处的9像素笔刷选项，那么可能是你以前更改过画笔的预设。此时点击青色圆圈处的圆形三角按钮，在弹出的菜单中选择“复位画笔”，将出现如下右图的询问框，点击“好”即可。以后如果出现画笔预设更改的情况，就可以通过这个方法来恢复。其他诸如样式、色板等调板的复位操作也与这个相同。,网页开发工具第一讲 photoshop基础知识,网页开发工具第一讲 photoshop基础知识,笔刷的详细设定 Photoshop针对笔刷还提供了非常详细的设定，这使得笔刷变得丰富多彩，而不再只是我们前面所看到的简单效果，快捷键F5即可调出画笔调板。 在该调板中可以进行直径、角度、间距等等设置。可以在最下面的预览中看到效果。,网页开发工具第一讲 photoshop基础知识,1. 5.2 建立选区,对图像的某个部分进行色彩调整，就必须有一个指定的过程。这个指定的过程称为选取。选取后形成选区。,要明确两个概念： 1、选区是封闭的区域，可以是任何形状，但一定是封闭的。不存在开放的选区。 2、选区一旦建立，大部分的操作就只针对选区范围内有效。如果要针对全图操作，必须先取消选区。 Photoshop中的选区大部分是靠选取工具来实现的。选取工具共8个，集中在工具栏上部。分别是 矩形选框工具 、椭圆选框工具 、单行选框工具 、单列选框工具 、套索工具 、多边形套索工具 、磁性套索工具 、魔棒工具 。其中前4个属于规则选取工具。,网页开发工具第一讲 photoshop基础知识,选区运算,选区工具有几种运算方式。所谓选区的运算就是指添加、减去、交集等操作。 它们以按钮形式分布在公共栏上。分别是：新选区 、添加到选区 、从选区减去 、与选区交叉 。 也可以直接使用键盘上的shift、ALT、ctrl键进行操作。 选区的添加、减去、交叉运算对8个选取工具都有效。使用方法也相同。,网页开发工具第一讲 photoshop基础知识,1. 6 图层,图层是Photoshop中很重要的一部分。图层也已经成为所有图像软件的基础概念之一。图层类似于“透明薄膜” ，极大地提高了后期修改的便利度，最大可能地避免重复劳动。,
