网页制作——图像处理基础.pptx
问题你为什么选这门课?你想在这门课学到些什么?第1页/共41页学完PS部分你能做什么?对图像做基本修改修整图像图像合成去背景操作第2页/共41页我希望你能具备的认真审美能力有独特的视角平时搜集素材的习惯第3页/共41页平面媒体设计 I第一章图像处理基础第4页/共41页图像处理基础关于图像处理数字图像基础色彩的基本理论第5页/共41页一、关于图像处理图像处理狭义广义:图像处理、图像分析和图像理解数字图像(Image而不是Picture)采样和量化图像和图形第6页/共41页二、数字图像基础获取图像的途径图像的两种类型分辨率和图象文件大小图像格式第7页/共41页获取图像的主要途径屏幕捕获扫描仪数码相机利用画图软件进行绘制第8页/共41页图形和图像1.基本概念图形和图像图形:由点、线等组成的有边界画面,文件中存放描述图形的指令。图像:由图像设备输入的无边界画面,数字化后以位图形式存储。第9页/共41页位图位图位图图像也叫作栅格图像,PS以及其它的图像编辑软件一般都使用位图图像。位图图像是用小方形网格(位图或栅格),即像素来代表图像,每个像素都有被分配一个特定位置和颜色值。在处理位图图像时,编辑的是像素而不是形状,也就是说,编辑的是每一个点。第10页/共41页位图位图图像与分辨率有关,因此,如果在屏幕上以较大的倍数放大显示图像,或者以过低的分辨率打印,位图图像会出现锯齿边缘,且会遗漏细节,如右图。第11页/共41页矢量图矢量图形,是由叫做矢量的数学对像所定义的直线和曲线组成的,如illustrator、CAD、Flash等绘图软件创作的都是矢量图形。它们根据图形的几何特性来对其进行描述。例如,机械制图中的零件由数字定义的线条和圆形等几何图形组成,图形画出后,放在特定位置并填充特定的颜色。移动、缩放或更改颜色不会降低图形的品质。第12页/共41页矢量图矢量图形与分辨率无关,换句话说,可以将它缩放到任意大小和以任意分辨率在输出设备上打印出来,都不会遗漏细节或清晰度。所以说矢量图形是文字(尤其是小字)和线条图形的最佳选择。第13页/共41页分辨率图像分辨率即图像中每单位打印长度显示的像素数目,通常用像素/英寸(PPI)表示。高分辨率的图像比相同打印尺寸的低分辨率图像包含较多的像素,因而像素点较小。例如,72PPI分辨率的11英寸图像包含总共5184像素(72像素宽72像素高=5184);同样11英寸而分辨率为300PPI的图像则包含总共90000像素。第14页/共41页分辨率下图是不同分辨率的两张图片,可以看到下方右图100%时的图像大小与左图50%时的图像大小差不多。第15页/共41页分辨率将上方右侧的图像拷贝到左侧的图像中,可以看到图像只占据很小的位置,如下图所示。第16页/共41页分辨率要确定使用的图像分辨率,应考虑图像最终发布的媒介。如果制作的图像用于网上显示,图像分辨率只需满足典型的显示器分辨率(72或96PPI)。但是,如果图像用于打印输出,那么必须使用高分辨率的图像(300PPI),太低的分辨率打印图像会导致输出图像中有明显的颗粒。高分辨率的图像文件大小比较大,在作图时必须根据需要进行选择。第17页/共41页图像的几种主要格式BMP(*.BMP)JPEG(*.JPG,*.JPE)PSD(*.PSD)GIF(*.GIF)PNG(*.PNG)第18页/共41页三、色彩的基本理论色彩是非口头交流的最为直接的方式。色彩一直用来表现思想和情感,而且无论在印刷里、屏幕上或者是超市的货架上,色彩都能扮演一个直接吸引注意力的“强夺者”的角色。色彩是当代设计中极为重要的一个方面。我们第一次观察到某些事物时,色彩可能会是我们记录下来的第一元素。第19页/共41页色标红色在情绪反应上表示生气,危险;是一种兴奋、动力和能量的代表,富有激情兴奋感。当把红色加深时,它就变成了权威和优雅的象征;当把红色稀释为玫瑰红或粉红时,它就成了年轻、精美和温柔的象征。橙色被认为是最“热”的颜色,是一种表示活泼的、有趣的、引起注意的(特别是吸引青少年和小孩)颜色。通常用它来表示一种温暖感。橙色还可以促进食欲和情绪反应,所以食品包装与标志设计中经常用橙色。第20页/共41页色标黄色是一种明亮的、欢快的颜色,会让人从明艳的阳光、春花联想到金色的秋叶等。黄色和黑色搭配可以说是对比最强烈的色彩搭配。通常这两种颜色的搭配表示一种警告,表示一些潜在的危险或存在的障碍。绿色象征安宁、自然和环境。也是春天的颜色,体现出一种生命的活力与健康。人们通常把绿色与环境问题联系起来,所以很多产品包装采用绿色,表达一种新鲜感与无公害产品的概念。第21页/共41页色标蓝色可以体现出神秘感和自然世界的能量感,与大海、天空颜色想通的色彩。可以诗人放松与平静。同时也被认为是一种冰爽洁净的颜色。深蓝色,通常表示保守与统一,体现出一种稳定、安全和信任感,很多公司制服会采用这样的颜色。紫色是一种高贵的颜色,它是由暖色调的红色和冷色调的蓝色混合而成的。也是一种极具权威性的颜色。第22页/共41页色标白色西方国家代表美好、纯洁、干净、简单,所以常常用它来表示医院、药品、婚礼、神圣的东西东方国家它却被认为是哀悼的颜色,所以经常把它与葬礼和死亡相联系。黑色是一种颇具否定意义的色彩。在欧洲和美洲东部,黑色表示死亡与哀悼。但是黑色也代表严肃、性感、精致与优美。黑色与其他颜色相比,更显出一种专有感与充裕感,所有一些奢侈品都采用黑色。此外黑色还表示庄严,让人有一种伟大、威严的感觉。第23页/共41页颜色模式PS中的颜色模式:位图灰度双色调索引颜色RGB颜色CMYK颜色Lab颜色1.多通道为什么需要这么多种颜色模式?不同的输出设备对颜色模式有不同的要求,因此我们需要选择相应的颜色模式。第24页/共41页颜色模式在哪里选择我所需要的颜色模式?新建窗口菜单:【图像】【模式】第25页/共41页灰度模式该模式使用256级灰度。灰度图像中的每个像素都有一个0(黑色)到255(白色)之间的亮度值。灰度值也可以用黑色油墨覆盖的百分比来度量(0%等于白色,100%等于黑色)。第26页/共41页位图位图模式用两种颜色(黑和白)来表示图像中的像素。只有灰度图象或多通道图象才能被转化为位图模式。第27页/共41页索引颜色模式索引颜色模式,也叫做映射颜色。在这种模式下,只能存储一个8位色彩深度的文件,即最多256种颜色,而且颜色都是预先定义好的。第29页/共41页RGB颜色模式赤橙黄绿青蓝紫赤 蓝绿R BG第32页/共41页RGB颜色模式RBG颜色模式是一种24(83)位3通道的颜色模式,也是Photoshop默认颜色模式,它可以表示1670万种颜色。在RGB模式中,由红、绿、蓝相叠加可以产生其它颜色,因此该模式也叫加色模式。所有显示器、投影设备以及电视机等发光屏幕都依赖于这种加色模式来实现的。第33页/共41页CMYK模式 第34页/共41页CMYK模式 CMYK颜色模式是一种印刷模式,其中的四个字母分别是指青(Cyan),品红(Magenta),黄(Yellow)和黑(Black)。CMYK颜色模式是四通道减色颜色模式。第35页/共41页色彩基本术语基础色色光三原色,是通过光的照射而获得的红(R)、绿(G)、蓝(B)。三种颜色的光合在一起即形成白光。色料三原色,是减弱光的颜色而获得的青(C)、品(M)、黄(Y)。三种颜色调和在一起形成黑色。色光三原色色料三原色第36页/共41页色彩的混合色光混合变亮,称为加法混合,色料混合变暗,称为减法混合。红绿黄色红蓝品红蓝绿青色品红黄红青黄绿青品红蓝色加法混色减法混色第37页/共41页色彩基本属性每种颜色都有相应的光波长度,单长度值不能正确地概述色彩,同样,不同颜色的名字有一定的概述限制。比如深红色实际应该是哪种颜色?第38页/共41页色彩基本属性色相色相,即各类色彩的相貌称谓。是色彩特殊的唯一的特点。色彩饱和度指色彩的纯度。饱和度的等级描述了一颜色从本色到灰色的渐变过程。饱和度越高色彩越鲜艳。明度指色彩的明暗度。通常可以在颜色中加入不等量的白色或者黑色来调节色彩的明度。一个颜色和白色调和形成的颜色我们称之为浅色;和黑色调和形成的颜色称之为暗色。第39页/共41页色彩基本属性色环单色互补色对比强烈、鲜艳三色组对比强烈、可以引起紧张感,基础色都为三色组邻近色感觉十分和谐第40页/共41页感谢您的观看!第41页/共41页