發新話題

[分享] [教學]Photoshop色彩漸變體系

[教學]Photoshop色彩漸變體系

因為做的倉促,難免有些遺漏與錯誤,希望各位藍友多多補充,大家共同進步。
前兩帖是色彩基礎知識,希望目前對色彩尚處茫然的藍友有些幫助。
色彩構成基礎理論
一、色彩形成
物體表面色彩的形成取決與三個方面,光源的照射、物體本身反射一定的色光、環境與空間對物體色彩的影響。
光源色:由各種光源發出的光,光波的長短、強弱、比例性質的不同形成了不同的色光,稱為光源色。
物體色:物體色本身不發光,它是光源色經過物體的吸收反射,反映到視覺中的光色感覺,我們把這些本身不發光的色彩統稱為物體色。

[url=http://www.blueidea.com/articleimg/2007/06/4782/45.jpg][/url]
色彩組成
基本色
一個色環通常包括12種明顯不同的顏色。而對於藝術設計師充分理解的色環和色論的重要方面,也許不會被我們中的網頁設計者們能夠充分欣賞。缺少多這方面的瞭解,你將會把事情搞亂。

三原色
從定義上講,三原色是能夠按照一些數量規定合成其他任何一種顏色的基色。為了確定三原色,你必須首先確切明確那一種顏色是你正在使用的中間色。在上小學時,你可能就知道了三原色:紅、黃、藍,並且你現在用於展示的,仍然是紅、黃、藍三原色。但是如果你有噴墨印表機的話,花點時間把它的蓋子打開,看看他的墨水匣,你能看到紅、黃、藍嗎?不能!你可能看到的是四種層色:藍綠(青)色、紅紫(洋紅)色、黃色和黑色。顏色的不同是由於你的電腦用的是正色,而你的印表機用的是負色。顯示器發出的是彩色光,而紙上的墨則吸收燈光發出的顏色。更進一步的解釋就超出了本意要探討的範圍。除了發射與吸收光的不同之外,本文設計的概念同樣適用於正色和負色模式,處於本文的寫作目的,我們僅探討著正色模式的三原色:紅、黃、藍。

近似色
近似色可以是我們給出的顏色之外的任何一種顏色。如果從橙色開始,並且你想要它的兩種近似色,你應該選擇紅和黃。用近似色的顏色主題可以實現色彩的融洽和融合,與自然界中能看到的色彩接近起來。

補充色
正如我們所知道的相對色一樣,補充色是色環中的直接位置相對的顏色。當你想使色彩強烈突出的話,選擇對比色比較好。假如你正在組合一幅檸檬圖片,用藍色背景將使檸檬更加突出。

分離補色
分離補色由兩到三種顏色組成。你選擇一種顏色,就會發現它的補色在色環的另一面。你可以使用補色那一邊的一種或多種顏色。

組色
組色是色環上距離相等的任意三種顏色。當組色被用作一個色彩題時,會對流覽者造成緊張的情緒。因為三種顏色形成對比。上面所講的基色和次色組可以被稱作兩組組色。

暖色
暖色由紅色調組成。比如紅色、橙色、黃色。他們給選擇的顏色賦予溫暖、舒適和活力。他們也產生了一種色彩向流覽者顯示或移動,並從頁面中突出出來的視覺化效果。

冷色
冷色來自於藍色色調。譬如藍色、青色和綠色。這些顏色將對色彩主題起到冷靜的作用,他們看起來有一種從流覽者身上收回來的效果,於是他們用作頁面的背景比較好。需要注明的是,你將發現在不同的書中,這些顏色組合有不同的名稱。但是如果你能夠理解這些基本原則,他們將對你的網頁設計是十分有益的。

色彩對比
兩種以上的色彩,以空間或時間關係相比較,能比較出明顯的差別,並產生比較作用,被成為色彩對比。該想像分為兩大類:同時對比和連續對比。
色相對比
因色相之間的差別形成對比。當主色相確定後,必須考慮其他色彩與主色相是什麼關係,要表現什麼內容及效果等,這樣才能增強其表現力。
將相同的橙色,放在紅色或黃色上,我們將會發現,在紅色上的橙色會有偏黃的感覺,因為橙色是由紅色和黃色調成的,當他和紅色並列時,相同的成分被調和而相異部分被增強,所以看起來比單獨時偏黃,以其他色彩比較也會有這種現象,我們成為色名對比。除了色感偏移之外,對比的兩色,有時會發生互相色滲的現象,而影像相隔界線的視覺效果,當對比的兩色,具有相同的彩度和明度時,對比的效果越明顯,兩色越接近補色,對比效果越強烈。

明度對比
因明度之間的差別形成的對比。(檸檬黃明度高,藍紫色的明度低,橙色和綠色屬中明度,紅色與藍色屬於中低明度)。
明度對比
將相同的色彩,放在黑色和白色上,比較色彩的感覺,會發現黑色上的色彩感覺比較亮,放在白色上的色彩感覺比較暗,明暗對比效果非常強烈明顯,對配色結果產生的影響,明度差異很大的對比,會讓人有不安的感覺。

純度對比
一種顏色與另一種更鮮豔的顏色對比,會感覺不太鮮明,但與不鮮明的顏色相比時,則顯得鮮明,這種色彩的對比便稱為純度對比。

補色對比
將紅與綠、黃與紫、藍與橙等具有補色關係的色彩彼此並置,使色彩感覺更為鮮明,純度增加,成為補色對比。(視覺的殘像現象明顯)。

冷暖對比
猶豫色彩感覺的冷暖差別而形成的色彩對比,稱為冷暖對比。(紅、橙、黃使人感覺溫暖;藍、藍綠、藍紫使人感覺寒冷;綠與紫介於其間),另外,色彩的冷暖對比還受明度與純度的影響,白光反射高而感覺冷,黑色吸收率高而感覺暖。

Ps色彩漸變體系
1. 理解漸變的概念,漸變構成是平面的基本構成形式之一,漸變的涵蓋非常廣泛,有形狀,方向,位置,大小,色彩和骨格漸變,今天講的就是色彩漸變。
2. 視覺感知:我們對平面圖像的感知,平面設計是將不同的基本圖形,色彩,亮度按照一定的規則在平面上組合成圖案的。主要在二度空間範圍之內以輪廓線,色彩,光影來描繪形象。而平面設計所表現的立體空間感,並非是在的三度空間,而僅僅是圖形對人的視覺引導作用形成的幻覺空間。從下圖中我們可知A與B的顏色是一樣。(#6b6b6b)

3. Ps漸變模式:主要是角度、線條(線性),徑向,對稱,菱形這五種漸變,還有一種不常用的雜色漸變。如下圖
4. Ps色彩模式:一般可分為兩種,一種是純色(單色)漸變,一種是混色漸變,如下圖

5. 漸變的方式多種多樣,通過不同的漸變模式可以創建出神奇的色彩效果,Ps色彩漸變是根據色標間的不同色彩進行色彩上的過度而不同的設置往往會產生多種不同的樣式,一個漸變條中的可以有多種漸變,一是對比漸變,請看下圖(是土黃和藍色的各自的純色漸變,我們接著看他的色標位置,中間的白色色標和土黃色色標幾乎貼在了一起,這就產生了強烈的對比)


二是柔和的漸變(也就是常規漸變)
6. 角度漸變模式的特殊效果,角度漸變中當色標的首標色和尾標色相同時就會出現如下圖(橙黃漸變)這種效果。

7. 透明度對漸變的影響。我們看下面的實例,同樣是用對比漸變的色標,在一定透明度的數值下,多次漸變的效果,產生出層層疊疊的層次感。

8. 對比漸變與低透明度的結合的效果(如下圖)。我們看他的色標,藍—藍—白—白,中間的藍色標和白色標重疊到了一起,然後用菱形漸變,看一下效果,產生了方形的層疊感。


9. 色標透明度的應用之一,效果如下圖,產生了彩虹效果,再觀察他的色標,藍—綠—黃—紅,在右端聚集到了一起,有微小的過度,這就產生了彩虹的特效。


10. 色標透明度的應用之二,效果如下圖,產生放射效果,再看色標,紅—紅—紅,中間透明,紅色是以色塊形式存在的,漸變模式是角度漸變,這也可以說是對比漸變的應用之一,比如我們如果吧色標設置成紅—黃—紅—黃,這樣的色塊(注意是色塊),那麼就能得到紅色塊和黃色塊放射的效果。


11. 流行漸變效果製作實例很多人認為這是Web2.0,其實說真的和Web2.0扯不上關係,只是因為是一是這種大膽效果剛剛出現不久,二是許多Web2.0網站都採用這種效果,而我們現在就學習這種效果的表現之一,高光。高光可以通過很多方式實現,不過這種方式是色彩漸變中的直接高光,好了,現在看看效果圖(下圖),看,不論是字體和按鈕,標題列(按鈕拉長後)都可以應用,我們拿第一個紫色漸變來說,在混合模式中進行如下設置,描邊,內發光,漸變疊加(色標疊加,描邊色是漸變中的最深色)。






12. 雜色漸變的應用,雜色漸變由於色彩控制能力低,通常為教學者所遺棄,這裡主要是將他的應用之一,設置如下圖H,S,B,純色漸變時,H取值兩端不變,S和B改變,即可直觀的得到柔和的純色漸變,而如果通過制定色標漸變的方式,那麼只有點擊一下滑鼠才可以看到效果,而這種方式在滑鼠拖動時就可以看到效果,多色漸變,固定B和S數值,就可以達到較理想的效果,這只是一種方法,至於好壞那就看個人喜好了。


13. 漸變的色塊現象
(1)出現在色彩較大的過度強烈的色彩漸變上,在數值太小的範圍內與數值較大的範圍內不易產生色塊,而數值中等範圍色彩對比又較大則容易產生,(如下圖)
(2)出現在保存品質上,品質過低就會產生色塊,網頁製作中需注意。
14. 漸變的疊加模式,漸變的疊加模式和圖層的疊加模式一樣。





出處:藍色理想  作者:jack99

[ 本帖最後由 ANNE0509 於 2007-6-27 14:33 編輯 ]

TOP

發新話題

本站所有圖文均屬網友發表,僅代表作者的觀點與本站無關,如有侵權請通知版主會盡快刪除。