我們所看到的色彩世界，在計算機(jī)里，通常用以下三種顏色格式進(jìn)行描述——RGB、HSL和CMYK。這也是設(shè)計師接觸最多的，當(dāng)然還有其他的顏色格式，不過詳細(xì)的我也忘了。
先來說RGB吧，這也是我們接觸最多的格式。要說RGB，要先得說一下LCD顯示器的原理。我直接跳過了CRT的原理，因為LCD與RGB聯(lián)系也更為緊密，當(dāng)然CRT也是基于RGB色彩理論的。
LCD俗稱液晶顯示器，每一個點(diǎn)都是正方形的，由3個長方形的顏色區(qū)域組成，顏色分別是Red、Green、Blue。這都很簡單了，大家都知道。通過控制不同液晶的偏轉(zhuǎn)角度，達(dá)到控制白光通過液晶后到達(dá)人眼的亮度，從而控制顏色的飽和度。這里用的是折射原理，實際上LCD背光只有白光，透過不同的顏色棱鏡，就會得到紅綠藍(lán)3色。
為什么photoshop在控制RGB色彩的時候，取值范圍是0～255呢？這就要涉及到計算機(jī)的最小單位了——字節(jié)（其實最小應(yīng)該是Bit），一個字節(jié)由8個bit組成，這里是2進(jìn)制，也就是2的8次方＝256。256肯定是不能要的，這已經(jīng)超出了8個bit所能夠表達(dá)的范圍，所以，顏色值從0到255。
那為什么不是7個或者6個bit呢？理論上來說，這都是可行的，但實際人眼的分辨能力在7個bit以上，甚至于8bit，所以這也要滿足人眼的可視需求。
一個單獨(dú)的顏色量由1個字節(jié)表示，那一個點(diǎn)就由3個字節(jié)表示，也就是2的24次方，就是我們通常所說的24位色。
RGB是最為通用的一種格式，實際上以后的顯示器可能會擴(kuò)展到7原色或者更多，而不是現(xiàn)在的3原色，畢竟3原色24bit是不能夠表達(dá)人眼所能看見的任何顏色的。
再說說HSL，有的也叫做HSB，L表示lightness，B表示Brightness，都是一個意思。通常，根據(jù)人的習(xí)慣，我們將棱鏡分出來的顏色看作是Hue色調(diào)，將顏色的Saturation飽和度和Lightness亮度作為調(diào)節(jié)色調(diào)的基本手段，于是就有了HSL。Windows的調(diào)色板，包括Photoshop的調(diào)色板，使用的就是HSL方式，可以更直觀的選擇適合的顏色。
RGB和HSL的世界是不同的，必須通過一系列復(fù)雜的算法才能夠互換。如果將RGB看作是一個球體，那HSL就是一個梭體，也就是兩個圓錐組成的形體。這兩個顏色之間的互轉(zhuǎn)目前也有近似的算法，但也要經(jīng)過非常復(fù)雜的公式才能完成，不過已經(jīng)避免了平方和開發(fā)的麻煩。
這里順代將一下Photoshop中HSL調(diào)節(jié)濾鏡的原理。一個RGB格式的圖片，通過HSL顏色格式，可以將圖片的整體色調(diào)進(jìn)行調(diào)節(jié)。比如我們要調(diào)節(jié)Hue色調(diào)值，增加50。首先，取出每個點(diǎn)的RGB顏色值，轉(zhuǎn)換為HSL，將得到的Hue值加上50，然后轉(zhuǎn)換到RGB顏色，覆蓋原來點(diǎn)的顏色。就這樣，將所有的點(diǎn)都做一回合的互轉(zhuǎn)，就能夠?qū)⒄麄€圖片的色調(diào)進(jìn)行調(diào)整。
很多平面設(shè)計師并不知道Photoshop中為什么有CMYK色，如果你是做印刷設(shè)計的，那就必須用CMYK色，因為印刷色不是基于RGB格式的。Cyan 青, Magenta 品紅, Yellow 黃, blacK 黑，共同組成CMYK色。我們可以設(shè)想一個印刷機(jī)是由4種色帶組成的，通過4次印刷，將4種不同的顏色疊加在一起，從而形成彩色的封面。在印刷上，或者水墨畫上，顏色疊加是在做減法，也就是疊加的越多，顏色越黑。我們小時候都用過水彩筆，如果使用不同的畫筆在某一個地方不停的涂抹，最后就得到黑黑的一片。其實，從原理上使用CMY色，就能夠得到黑色，而CMY也是RGB的近親?；趦牲c(diǎn)原因要添加K，也就是Black。第一，CMY組成的黑色不夠黑，純度不夠；第二，由3種顏色疊加成黑色的成本太高，需要反復(fù)印刷3次，而黑色是報紙雜志最常用的顏色，也是最便宜的色帶。我們通常在報紙的一個角上會發(fā)現(xiàn)一個彩色的十字，也就是用于顏色疊加校準(zhǔn)用的。通常為了節(jié)約成本，盡量的少用CMYK的某一種顏色。比如，在印刷報紙的時候，一個單獨(dú)黑色的版面只需要印刷一遍，而彩色的版面要印刷4遍。我們在做名片的時候，都需要盡量的少用顏色，達(dá)到節(jié)約成本的目的。
CMYK和RGB的互轉(zhuǎn)比較麻煩，主要是CMYK所能夠表達(dá)的顏色范圍更小，而且某些稍微亮點(diǎn)的顏色都不能正確顯示。如果看到Photoshop上的某個RGB色，旁邊的CMYK色有一個感嘆號，那就表明這種顏色印刷不出來，我們就需要修改之。Photoshop的顏色告警也是基于這個原理，因此在印刷的時候更多的要考慮CMYK色。CMYK轉(zhuǎn)換到RGB一般是通過數(shù)組來實現(xiàn)的，不同的顯示器應(yīng)該提供不同的顏色表，以適應(yīng)CMYK色的互換。
設(shè)計領(lǐng)域有一個行規(guī)，那就是設(shè)計師必須使用CRT顯示器，這有兩點(diǎn)原因。一，CRT顯示器所能夠表達(dá)的顏色更多，達(dá)到32Bit，而LCD原理上只能實現(xiàn)18Bit，現(xiàn)在經(jīng)過優(yōu)化后可以實現(xiàn)偽24Bit。二，CRT的顏色更接近于CMYK色，而LCD的顏色太亮了，也就是飽和度太高。
先來講一下圖片格式，從BMP說起。BMP文件是Windows最基本的文件格式，比如一張未壓縮的真彩色圖片，文件的大小通常等于56＋寬度＊高度＊3。前54個字節(jié)是文件描述，通常稱為文件頭，中間的是顏色，每個點(diǎn)占用3個字節(jié)，遵循從左到右，從上到下的方向。不過，有的BMP格式在存放顏色時，恰好是相反的，先放最后一個點(diǎn)的顏色。BMP文件的結(jié)尾以兩個0x00，0x00組成。
不壓縮的BMP文件顯然是很大的。有兩種壓縮方式，一，使用256色調(diào)色板，二，使用RLE連續(xù)壓縮算法。調(diào)色板最多只能有256種顏色，也就是1個字節(jié)，這個調(diào)色板放在BMP文件頭的位置，顏色可以是任意的真彩色。如果超過256色，系統(tǒng)就會選取使用頻度最高的顏色，而忽略掉使用比較少的顏色，將其近似為調(diào)色板中的某個顏色。因此，在調(diào)色板的BMP文件中，除了256個真彩色之外，就是單個字節(jié)的顏色索引值了，就好像一個數(shù)組。RLE算法是一種簡單有效的方式，能夠?qū)⑺椒较蜻B續(xù)的顏色進(jìn)行壓縮，這也是Gif的原理，這在Gif文件里講。
Gif文件也是應(yīng)運(yùn)而生的，當(dāng)時還處在Win31的時代，BMP是主角，但是BMP太占空間了，必須有一種高效的壓縮算法來取代BMP。Gif文件必須是索引色，帶一個不超過256色的調(diào)色板。通常，這個調(diào)色板的尺寸是2的最多8次方，比如一張圖只用了14種顏色，但調(diào)色板只能是16色的。調(diào)色板里存放的是真彩色，而索引值和BMP的不同，根據(jù)用到的顏色多少來決定。比如我們只用了16種顏色的調(diào)色板，那索引色就是4Bit，描述了0～15的索引值，也就是說，一個字節(jié)可以放下2個點(diǎn)的顏色。當(dāng)然，Gif格式并不是如此簡單，也包含了RLE算法。通過一系列連續(xù)的顏色，將顏色做一個壓縮。一個字節(jié)的高4Bit存放索引值，低4Bit存放連續(xù)的個數(shù)，也就是說，連續(xù)數(shù)最多16個，以0～15來計算，0表示這個點(diǎn)之后的點(diǎn)不使用該顏色索引。即使連續(xù)的顏色超過16個，比如160個，那也必須拆分開來，由10組顏色索引＋顏色連續(xù)個數(shù)的字節(jié)來組成。
說到這里，就提醒各位設(shè)計師，在使用gif圖的使用注意以下兩點(diǎn)。一，盡量少的使用顏色，不要使用太多的過渡色；二，顏色一定要水平連續(xù)存放，比如，我們可以做垂直方向的漸變色，但如果是水平方向的漸變色，那顏色連續(xù)性就消失了，壓縮比就不高了。
gif還支持0、1模式的透明色，指定某種調(diào)色板的顏色為透明色，則該色在圖片上不顯示，達(dá)到齒條剪裁的目的。因為要犧牲掉一個顏色，所以透明gif的最多顏色為255色，有一個作為透明色用了，但不顯示。通常我們使用大紅色作為透明色，因為這種顏色過艷，不是很常用，當(dāng)然也可以使用其他的顏色。
Gif文件也是應(yīng)運(yùn)而生的，當(dāng)時還處在Win31的時代，BMP是主角，但是BMP太占空間了，必須有一種高效的壓縮算法來取代BMP。Gif文件必須是索引色，帶一個不超過256色的調(diào)色板。通常，這個調(diào)色板的尺寸是2的最多8次方，比如一張圖只用了14種顏色，但調(diào)色板只能是16色的。調(diào)色板里存放的是真彩色，而索引值和BMP的不同，根據(jù)用到的顏色多少來決定。比如我們只用了16種顏色的調(diào)色板，那索引色就是4Bit，描述了0～15的索引值，也就是說，一個字節(jié)可以放下2個點(diǎn)的顏色。當(dāng)然，Gif格式并不是如此簡單，也包含了RLE算法。通過一系列連續(xù)的顏色，將顏色做一個壓縮。一個字節(jié)的高4Bit存放索引值，低4Bit存放連續(xù)的個數(shù)，也就是說，連續(xù)數(shù)最多16個，以0～15來計算，0表示這個點(diǎn)之后的點(diǎn)不使用該顏色索引。即使連續(xù)的顏色超過16個，比如160個，那也必須拆分開來，由10組顏色索引＋顏色連續(xù)個數(shù)的字節(jié)來組成。
說到這里，就提醒各位設(shè)計師，在使用gif圖的使用注意以下兩點(diǎn)。一，盡量少的使用顏色，不要使用太多的過渡色；二，顏色一定要水平連續(xù)存放，比如，我們可以做垂直方向的漸變色，但如果是水平方向的漸變色，那顏色連續(xù)性就消失了，壓縮比就不高了。
gif還支持0、1模式的透明色，指定某種調(diào)色板的顏色為透明色，則該色在圖片上不顯示，達(dá)到齒條剪裁的目的。因為要犧牲掉一個顏色，所以透明gif的最多顏色為255色，有一個作為透明色用了，但不顯示。通常我們使用大紅色作為透明色，因為這種顏色過艷，不是很常用，當(dāng)然也可以使用其他的顏色。
cursor和icon文件，也跟著RGB發(fā)展到ARGB。在windows95及之前的時代，icon都是鋸齒的，其圖片結(jié)構(gòu)和gif的類似，也支持透明gif方式，所以是齒條透明的。而到了windowsxp時代，icon可以像png那樣，擁有每個點(diǎn)的透明度了，不過icon并不是一種壓縮格式，所以ARGB的icon文件非常大。icon文件可以在單一文件內(nèi)存放不同尺寸的圖標(biāo)，cursor文件則可以存放相同尺寸的幀。windowsxp有一點(diǎn)落后于mac，那就是沒有支持ARGB的動畫指針格式的cursor，我們只能通過第三方的軟件，才能實現(xiàn)透明有著陰影的動畫鼠標(biāo)。
說了alpha通道，不得不說一下layer。
layer是photoshop的基本組成單位，layer其實簡單的說，就是一個雙向鏈表。什么是鏈表？鏈表是計算機(jī)數(shù)據(jù)結(jié)構(gòu)的最簡單概念，就好像一串珍珠項鏈，每顆珠子就是一個圖層。鏈表的頭是最下面的圖層，鏈表的尾是最上面的圖層，通過鏈表的位置來描述Z軸的上下方向。
每個layer都會帶一個不同尺寸的ARGB格式的圖片，所以我們將layer翻譯成“圖”層。根據(jù)我們的需求，圖層可大可小，這都是photoshop內(nèi)部動態(tài)調(diào)整的，設(shè)計師感覺不出來圖層的大小。由于每個圖層都要帶一張尺寸不小的圖片，所以photoshop非常消耗內(nèi)存，而在設(shè)計階段，這些消耗還不能節(jié)省，也就是不能壓縮。不過在保存為psd文件后，根據(jù)png格式的算法，可以將圖層進(jìn)行壓縮，也就得到了壓縮后的psd文件。我們可以將psd理解為多個png的合集。
每個圖層除了能夠控制單個點(diǎn)的透明度，還能夠擁有一個整體透明度，我叫做MasterAlpha，Photoshop稱之為Opacity。MA的取值范圍也是0～255，Opacity取值0～100，每個點(diǎn)不僅要受到其Alpha通道的影響，還要受到圖層整體透明度的影響。通過調(diào)節(jié)整體透明度，來達(dá)到單個圖層的調(diào)節(jié)。
在photoshop6之后，引入了包bag的概念，每個bag就是多個圖層鏈表，所有的bag組合成一個bag鏈表。這就好像XY的二維坐標(biāo)一樣，只是bag更容易管理。這個不用我費(fèi)口舌了，相信各位從photoshop的使用中能夠理解包的具體作用。如果從計算機(jī)數(shù)據(jù)結(jié)構(gòu)的角度理解，包和圖層共同組成了一個“樹”，是一顆多叉樹。包也可以有整體透明度，直接影響包內(nèi)的所有圖層的透明度。因此，就一個點(diǎn)的顯示程度而言，受到三方面的控制，點(diǎn)的透明度、圖層的透明度和包的透明度。
在全色盲的眼里，世界是灰色的，樹木、房屋、草地、連同陽光，都是灰色的。這就好像將一幅圖片去色了，只顯示256級灰度一樣。最簡單的去色，就是R＋G＋B／3，這是簡單的平均，不過連同Photoshop都使用這一平均公式，因為他來的快。還有一種，稱為視覺灰度intensity，這是使用測光儀測試紅綠藍(lán)三種基色的亮度值，單位是流明。測試方法非常簡單，全屏顯示一種顏色，測光儀就可以得到不同的流民值。就好像我們的經(jīng)驗一樣，藍(lán)色是三種基色中最暗的一種顏色，而綠色則是最亮的顏色，紅色處于中間，他們的具體比例是Red0.21 Green0.70 Blue0.09。所以，又產(chǎn)生了另一種去色的方式，R*0.21+Green*0.70+Blue*0.09，這是一種加權(quán)平均的算法，某些圖形處理軟件使用這一算法，而這也更接近于我們想要的真實灰色。根據(jù)這一原理，我們可以得知由紅色和綠色合成的黃色為什么這么亮了，因為他的亮度值是0.91，已經(jīng)很接近白色了。根據(jù)視覺灰度的原理，我們聯(lián)系Windows通常使用的顏色，就知道為什么WindowsXP的藍(lán)色看起來總是那么舒服。原因很簡單，藍(lán)色的亮度最低，不刺眼，同時，在藍(lán)色上顯示白字的對比度最高。而如果換成綠色的風(fēng)格，則白色的文字不容易識別，也就是這個道理。所以，我們通常說的顏色對比，不僅包含了同色系的顏色取值，也包含了不同色系的亮度差別。這對于我們平面設(shè)計師而言，有很多好處，合理的使用不同的顏色，造成視覺上的亮度差異，更加符合人機(jī)工效學(xué)的原理。
