美術的重要性
任何分類的設計師都需要有一定的美術基礎，甚至也要有一定的手繪能力。我們在用電腦設計圖形的時候其實也在潛移默化地在使用我們儲存在大腦中的美術知識和審美，即使再先進的人工智能，也不能代替設計師的審美和美術知識。說到底軟件僅僅是工具而已。要想提高你圖形的審美和設計感，那么就需要補一下美術基礎的課了。互聯網視覺設計中手繪在互聯網設計中占的比重也在逐漸增多。對于我們UI設計師來說手繪也成為一個繞不過去的技能，但是不要緊張：我們不需要成為手繪大神或者插畫師，只需要掌握一定的美術知識再加練習即可。那么如果我們掌握了美術知識并可以畫出還可以的畫，對我們會有什么好處呢？
美術在草稿中的優勢
在作品創作的初期，草稿對我們構思起了很關鍵的作用。比如在APP項目、運營圖、圖標繪制以及一些圖形化的設計中，首先很多設計師會打開電腦直接開始作圖，然后就陷入了對工具選擇的困惑中：我是該用鋼筆工具勾形狀呢還是用畫筆工具呢。不要糾結這些，你只要拿出紙筆，手繪出腦海中思考的圖形就好了。等草圖完成后，再打開電腦完善這個作品。
美術在提案中的優勢
在提案之前通過手繪將自己的想法畫出來，和上司或者客戶講解自己的提案方向，這種方法會避免上司對電腦圖形設計細節的不滿意，畢竟我們還沒時間完成細節。如配圖中的一個圖標，從最初提案到最終定稿，中間經歷20多版的手繪稿件，如果每次提案都是以PS輸出效果提交，在電腦繪制中要考慮的色彩細節會更多，同時也會浪費大量的時間。
美術在原型圖中的優勢
開始視覺設計前，原型圖的溝通可以節省雙方很多時間。用軟件設計出的原型圖有些抽象，會讓大家不了解具體內容搭配下的情況。而手繪的原型圖可以幫助我們有更多的思考。不僅可以用于溝通方案，還可以后期包裝展示時放入，讓自己的作品區別于他人。
美術在實際項目中的優勢
越來越多的視覺稿都將手繪插畫運用在當中，增加視覺沖擊感，給用戶帶來全新的體驗。比如H5、網頁、APP等項目，“walk
up”APP更是運用了大量的插畫表現。然而我們瀏覽某些設計的時候，總會看到并吐槽一些用到爛大街的素材，到了自己工作的時候依然會選擇那些素材。再精致的素材有時候不如一些手繪原創的圖形，手繪的圖形插畫能減少素材感，給用戶耳目一新的視覺展現。尤其是現在閃屏、彈窗、運營圖，手繪圖表現形式已經是常態化，它們可能沒有很精細，沒有很美觀，但是很獨特、很有氛圍感、很吸引眼球。如果你總是運用素材，不如嘗試一下自己手繪原創一個圖形，這樣它的分量與價值會更大。在你嘗試手繪之前，讓我們先具體了解繪畫的一些原理再開始動手吧。
三大基本關系
首先我們要了解的是在美術里最重要的三個主要關系，他們是：結構關系、素描關系、色彩關系。這三個關系簡單來說就是，結構關系是物體的透視關系（也就是近大遠小的空間關系）、和物體的基本結構（可以把一個復雜的物體拆解成基本的圓形、三角形、正方形、長方形等簡單容易描繪的結構）等，結構關系是我們如何理解形體的基礎。素描關系主要是研究光影的關系，一個物體在光源下肯定會產生如黑白灰等不同的明暗變化就是素描關系了。素描關系中最重要的就是三大面和五大調，我們下面會詳細講。色彩關系則是要研究不同的色彩互相融合產生的影響，比如鄰近色、互補色、鄰近色等，兩個物體的顏色不一樣也會產生環境色、固有色等。所以我們為了用手繪或者電腦繪圖來描繪物體時，可以從這三個關系中來審視對象，就會描繪地更加準確了。
1.結構關系
透視
在結構關系中最重要的知識點就是透視了。透視是繪畫理論術語，“透視”（perspective）來源于拉丁文“perspclre”（看透），是一種在平面繪畫物體的空間關系的方法。物體由于近大遠小的空間關系所以在我們觀察者視角就出現了變化，這種變化和空間位置正相關。能夠準確描繪出近大遠小就能暗示出空間關系了。所以透視是畫準結構的必要前提。
滅點
滅點指的是立體圖形各條邊的延伸所產生的相交點。透視點的消失點。滅點透視中，兩條或多條代表平行線線條向遠處地平線伸展直至相交的一點。平行的線能在滅點上推進而聚合的原則同樣是以肉眼觀察到的現象為依據的。
第一種透視：平視
一個物體如果是正面或者沒有近大遠小的關系，那么該物體橫豎對齊即可。
我自己的理解就是，看一個物體，正面去看就是沒有透視。和你的的視線是平行的，沒有任何的偏離。
第二種透視：一點透視
一點透視：透視來源于一個點，形狀的變化與該點的距離相關。一點透視可以理解為在一個空間內多個物體產生的近大遠小的關系。
第三種透視：兩點透視
兩點透視：通過兩個滅點建立透視。就像我們站在一個比較龐大物體的面前，這個物體的兩側都會產生近大遠小的關系。把近大遠小的線延伸，它們會相較于視平線上的兩個滅點。這就叫兩點透視了。
第四種透視：三點透視
三點透視：通過兩個滅點和延長線進行輔助。一個高于觀察者的物體除了產生兩點透視之外也會在其頂部產生另一個滅點，三個滅點都存在，我們稱之為三點透視。
練習方法：結構素描
結構素描，又稱“形體素描”。這種素描的特點是以線條為主要表現手段，不施明暗，沒有光影變化，而強調突出物象的結構特征。
以理解和表達物體自身的結構本質為目的，結構素描的觀察常和測量與推理結合起來，透視原理的運用自始至終貫穿在觀察的過程中，而不僅僅注重于直觀的方式。這種表現方法相對比較理性，可以忽視對象的光影、質感、體量和明暗等外在因素。大家可以嘗試在紙上繪制主要表現結構的結構素描作為練習。結構素描對于美術基礎不好的同學也可以適用。只要用尺子和圓規等工具搭配合適的自動鉛即可上手。
2.素描關系
三大面：黑白灰
有的時候設計師經常會說黑白灰關系，黑白灰關系就是我們要介紹的“三大面”。三大面就是受光程度不同產生的：光打得多就是受光面，光打得少就是側光面，光由折射或者完全遮住就是背光面了。這么說比較容易理解：就好比是我們的地球，熱帶地區就是受光面，溫帶地區就是側光面，北極南極就是背光面。這與光源的距離和位置有關，越朝向和接近光源越亮。立體形狀在光源的照射下都有黑白灰三個面，您可以觀察分析一下身邊的事物。
五大調：亮面、灰面、明暗交界線、反光、投影
五大調同樣是分析光影問題的，通過描繪光影我們可以塑造立體感。五大調是三大面的細分，三大面五大調是我們每位設計師都需要記牢印在心里的，在繪制一些擬物造型或者專題的時候，為了塑造更逼真的感覺，我們必須檢查自己的造型有沒有三大面五大調。
亮面：受光物體最亮的部分，表現的是物體直接反射光源的部分。
灰面：高光與明暗交界線之間的區域。
明暗交界線：區分亮部與暗部的區域，是物體的結構轉折處。明暗交界線不是一條真實的線，但是這個區域一般會決定亮面灰面的勢力范圍，也跟隨者形體來走。所以非常重要。
反光：物體的背光部分受其他物體或物體所處環境的反射光影響的部分。
投影：物體本身遮擋光線后在空間中產生的暗影。
練習方法：黑白素描練習
黑白素描的練習就是我們用鉛筆來描繪對象物體的明暗變化。這種素描相較結構素描來說比較難，需要練習上“調子”。調子就是用鉛筆排線而產生的明暗，需要一定地技巧。
3.色彩關系
三原色三原色是指色彩中不能再分解的三種基本顏色。相互混合可以產生出所有的顏色。黑白灰屬于無彩色。色彩三原色是紅、黃、藍。紅+黃=橙，黃+藍=綠，紅+藍=紫。屏幕三原色為紅（Red）、綠（Green）、藍（Blue）。也叫色光三原色是加色模式，相加混合為白色。但是RGB依賴于電腦屏幕，不同的電腦由于對色彩值的檢測的重現都不一樣，所以存在色差。我們家里的彩色電視屏幕就是由這紅、綠、藍三種顏色的小點組成，將這三種顏色按不同比例混合，就可以有千變萬化的色彩。
印刷三原色為青（Cyan)、品紅（Magenta)、黃（Yellow)。是減色模式，混合為深灰色，并不能產生黑，所以在印刷時加上黑色油墨，才能產生純正的黑，就是CMYK顏色模式。
色彩三屬性
色相：色相就是顏色的樣子。就像人的臉一樣，都是獨一無二的。也就是色彩的相貌，冷色暖色中性色，是色彩最突出的特點，簡單來說，他決定“是什么顏色”。光譜上的紅、綠、藍等就是不同色彩的色相、黑色為沒有色相的中性色。色相在人眼中的不同是光的波長的長短不同所造成的。紅色的波長最長，紫色的波長最短。把紅、橙、黃、綠、藍、紫六種顏色和處在它們各自之間的紅橙、黃橙、黃綠、藍綠、藍紫、紅紫這六種中間色作為12色相環。能夠使人清楚明了的使人看出色彩平衡和冷暖色、對比色等。由12色相環也可以衍生出更多的色相環。
亮度：亮度，我的理解是，亮的反義詞就是暗，那說明是與顏色的明暗程度有關。色彩的明亮程度，簡單來說，就是顏色的從黑到白的變化。亮度最低時是黑色，亮度最高時是白色。顏色的深淺的不同程度，與光波的幅度有關，也取決于環境中反射光有多強。亮度高的色彩給人清新、明快的感覺，讓人聯想到藍天白云和青春。明度低的色彩給人沉重、穩定、堅硬的感覺，讓人聯想到石頭和鋼鐵。
飽和度：飽和度，飽和度從字面上的意思來理解，是比較飽和，太飽和可能就會很刺眼。就是與明度有關了。色彩純粹度，是色彩的純凈程度鮮艷程度，飽和度越低，顏色的色相就越不明顯，也與光波的幅度有關，飽和度低的顏色給人一種很灰，不明亮的感覺，飽和度為0的顏色為無彩色，就是黑白灰。在一張圖中，飽和度高的地方給人的感覺很靠近，飽和度低的地方給人的感覺很遠。高飽和度和低飽和度的色彩都給人堅硬的感覺。
色彩關系
互補色：紅+綠+藍=白色，在色環上相隔180度，是對比最強的色組，在三原色中，這兩種相隔180度的色光等量相加會得到白色。經典互補色有黃色和紫色（例如科比的球衣）、黃色和藍色、紅色和綠色。互補色在視覺上給人非常大的沖擊力，所以在使用上常給人潮流、刺激、興奮的感覺。
對比色：指在色環上相距120度到180 度之間的兩種顏色。也是兩種可以明顯區分的色彩，包括顏色三要素的對比、冷暖對比、彩色和消色的對比等等。對比色能使色彩效果表現明顯，形式多樣，極賦表現力。互補色一定是對比色，但是對比色就不一定是互補色。因為對比色的范圍更大，包括的要素更多，例如冷暖對比，明度對比，純度對比等。
鄰近色：相互接近的顏色在色環上的距離相距90度，或者相隔五六個數位的兩色。色相相近。冷暖性質相近，傳遞的情感也較為相似。例如紅色、黃色和橙色就是一組臨近色。鄰近色表現的情感多為溫和穩定，沒有太大的視覺沖擊。
同類色：色相性質相同，但色度有深淺之分（在色環上相距15度以內的顏色）
固有色、光源色、環境色
了解完基本的色彩知識，我們來簡單講講色彩和光源的關系。如果想描繪好對象的色彩，那我們必須了解對象的固有色、光源色、環境色以及它們之間的關系和變化。
說到這里，不得不安利一下這本學習配色的神書給你。
固有色最簡單的理解是物體本身的顏色。物體的固有色并不存在，在繪畫過程為了觀察方便我們常引用 “固有色”這個概念。固有色是指在光源條件下物體占主導地位的色彩，比如紅色的罐子、綠色的植物等。
光源色一切物體只有光源的點亮下才能觀察到它的色彩。光源有自然光源（太陽、天光）和人造光源（燈），這些光源都各自具有不同的顏色。太陽光是白的暖色光，月光是偏青的冷色光，陰天更多的是藍灰色的天光、普通燈光是偏黃色的暖色光。光源的顏色對物體的顏色影響很大，紅色的光源下的藍色物體您覺得會是什么顏色呢？
環境色物體周圍環境的顏色就是環境色。環境色對物體的影響非常大，比如在一個紅色背景下的白色石膏方塊，由于光源打到紅色背景下也會“染”到白色石膏方塊身上，產生一種淡紅色的色彩。所以我們在電腦作圖的時候也要想象環境色的影響。
練習方法：三大構成
三大構成指的是：平面構成、色彩構成、立體構成。三大構成起源于包豪斯學院，一所在設計歷史上非常重要的學術機構。三大構成是美術知識過渡到設計領域最重要的一個轉折。我們掌握了美術知識并練習了一定的程度后，就可以開始三大構成練習了。具體來說：
平面構成：什么是畫面最小的單位？點、線、面。如果我們從無到有需要構建一個畫面而不知所措時，可以嘗試用點、線、面來開始。同時也可以嘗試用點、線、面來做命題進行設計練習，這都是大多數高等院校對設計專業進行的最有效的訓練。
色彩構成：根據我們上文學到的色彩知識：色彩原理、鄰近色、對比色、互補色、環境色、固有色等，融入這些知識到一個練習之中：比如用紫色和黃色創作一個對比強烈的畫面。這就是色彩構成的練習方法了。
立體構成：通過對比、重復肌理、骨骼等三維空間物體，完成一組設計練習。通常UI設計是二維平面的圖形設計，立體構成練習可以相對減弱。但是如果您對立體構成比較感興趣，可以查找相關資料了解。
色彩心理學
色彩心理學是美術知識學習中非常重要的一部分，它所研究的是色彩通過對人的視覺上的刺激，而引發的人的情感和感官上的變化。通過對色彩的經驗積累而變成的對色彩的心理上的逾期感受。在生活中，色彩心理學對人們對顏色的認知有很大的影響。而在生活我們常用“亮不亮”、“艷不艷”、“淡紅”、“蘋果綠”來形容。如果開一家快餐店，你會用什么顏色作為品牌的主色？為什么交通燈用紅色表示停止通行而不是綠色呢？這都是色彩心理學的相關知識。這并不是說色彩本身就具有這些含義和情感，而是我們社會和人為的認知，是關于社會、生活，運用好色彩心理學可以帶給用戶極佳的視覺體驗，影響用戶的內心情感和思維，引導用戶的感知和行為，并且促進我們自身的發展。
黑色：黑色是一種代表品質、權威、穩重、時尚的色彩，同時也含有冷漠、悲傷、防御的消極情感。它是所有色彩中最有力量的，能很快吸引用戶的注意力。黑色吸收所有光線而且沒有反射，可以說是沒有任何光進入視覺，它和白色相反。當你不想引人注目或想專心處理事情時常用。黑色作為一種無彩色，能讓和它配合的其他色彩看起來更亮。所以在界面設計中，黑色常與其他色彩搭配，使產品顏色更加亮麗和時尚。即使是和暗色系的色彩相搭配也會很好看。黑+紅很引人注目，黑+黃活力突出有亮點。黑色也有神秘、科技、穩重的色彩情感，很多科技產品都會使用黑色，或用黑色作為背景色。是一種永遠流行的主要色彩。
白色：白色是所有可見光進入視覺，包含了光譜中的所有色光的顏色，常被認為“無色”。白色的明度是最高的，并且它沒有色相。在RGB顏色模式中，紅綠藍混合得到白色。白色傳遞一種簡單、純真、高雅、精致、信任、開放、干凈、暢快、樸素的情感。單一使用白色不會引起任何情感，但是當與其他顏色配合使用時，白色能很好的襯托，大量的留白讓其他元素脫穎而出。在界面設計中，作為無彩色的白色，常用于背景色，緩和各種顏色的沖突，以襯托其他色彩，提高畫面明度，提高文字可讀性。黑色和白色是極端對立的兩色，但是黑白搭配總是非常完美，永遠都不過時。
灰色：灰色是一種代表睿智、老實、執著、嚴肅、壓抑的色彩。色介于黑色和白色之間，也屬于無彩色，沒有色相也沒有純度，只有明度的變換。使用灰色很少會犯嚴重的錯誤，它和任何顏色都能很好的搭配，也常常用于背景色或用于突出其他彩色。在畫面中，很少出現純黑，基本都是用深灰色來代替黑色，也可以用淺灰色來代替白色。灰色不像黑色那么堅硬刺眼，他更有彈性，它比黑色更有深層次的力量。在RGB模式下，紅綠藍三色數值相等為中性灰，R=G=B=128為絕對中性灰。中性灰圖層常用于商業修圖，人像精修中調整皮膚質感。
紅色：傳遞喜慶、自信、斗志、權威、性感的情感。紅色是最能刺激人視覺的一種顏色，甚至能引起一些生理反應，例如心跳呼吸加快等。容易鼓舞勇氣，引起人們的感情波動，引發沖動消費，所以在快餐、電商行業的品牌多使用紅色，為的就是發沖動，引人消費。例如麥當勞、京東、小紅書。紅色的色感溫暖，性格剛強兒外向，同時也容易造成人的視覺疲勞。也是中國備受喜愛被廣泛運用的一種傳統色彩，代表吉祥、團圓喜慶。同時紅色也代表了警示、告誡。所以在界面設計中常用紅色的文字和按鈕來警示用戶慎重操作。
綠色：是自然界中最常見的顏色，代表生命力、青春、希望、寧靜、和平、舒適、安全的情感。綠色是黃色+青色，是冷暖色之間的過渡，他可以是偏向黃色的溫暖的黃綠色，也可以是偏向高冷的青色的藍綠色。所以他很靈活，可以和各種顏色搭配不同產生的感覺，起到平衡和協調的作用。在生活中被廣泛運用，例如交通燈和安全出口的顏色。不過綠色的飽和度要好好控制運用，因為高飽和的綠色讓人興奮，讓人注意，所以交通燈中綠色代表可以通行。
藍色：是三原色中的一種，代表永恒、靈性、清新、自由、放松、舒適、寧靜、商務。在國外的APP中，藍色最常用。幾乎沒有人對藍色反感，藍色是天的顏色，是海的顏色。深藍色常常給其他性格活躍極賦表現力的色彩提供一個深遠、平靜的平臺，給人強大而可靠的感覺。被淡化后依然有很強的個性，給人清爽、自由的感覺，這種感覺還能轉化為一種信任，吸引人們使用。及時在藍色中加入少量的其他顏色，也不會對藍色的性格有多大的影響。可以讓人的內心感到平和，有助于人的頭腦變得冷靜。
紫色:紫色是一種代表優雅、浪漫、高貴、時尚、神秘、夢幻、靈性、創造性的顏色。是孩子和有創造力的人十分喜歡的顏色。紅+藍=紫，在色盤上位于紅色和藍色之間，是冷暖色的交匯。紫色的明度在所有有彩色的顏色中是最低的。與不同的顏色結合會展現廚不同的風格特色。紫+粉常用于女性化的產品調性，黃色是紫色的對比色。紫+黑略顯沉悶，壓抑。紫+白，可以使紫色沉悶的性格消失，變得充滿女性的魅力。
黃色 ：黃色是一種代表陽光、青春、活力、時尚、尊貴、年輕輕快、輝煌、希望的顏色。紅色+綠色課產生黃色。黃和藍是互補色。是四個心理學基色之一。黃色的明度極高，極為顯眼，盡管在警示效果上沒有紅色那么明顯和強烈，但是還是能給人很醒目和危險的感覺。同時因為過于明亮，也是一種非常難以運用的顏色，性格不穩定常有偏差，和別的顏色配合使用易失去本來的性格。黃+白看起來很刺眼，但是黃+黑很有亮點。例如ofo小黃車和站酷都是黃+黑的組合。黃+藍也很流行，它可以喚醒藍色的沉靜，造成一個高對比度的視覺沖擊。在中國古代黃色也有特殊含義，代表著尊貴和權威。明度較低的黃色會顯得很臟。
作者：郗鑒
