2017-4-23 資深UI設(shè)計(jì)者
兩年前,寫過(guò)一篇UI入門的文章,學(xué)習(xí)的第二步著重強(qiáng)調(diào)了,成為一名設(shè)計(jì)師,應(yīng)該具備一些基本的手繪功底。雖然我知道對(duì)于很多圈子而言,設(shè)計(jì)師該不該學(xué)習(xí)繪畫是具有爭(zhēng)議性的,但我還是要力推新手入門必須重視這門技巧。
UI 自學(xué)入門:《超實(shí)用新手指南!零基礎(chǔ)如何自學(xué)UI設(shè)計(jì)?》
學(xué)習(xí)繪畫,首先必須明白為什么要學(xué),以及學(xué)了以后有什么用,否則很容易淪為形式上的過(guò)場(chǎng),在漫長(zhǎng)的學(xué)習(xí)生涯中欺騙自己做過(guò)努力的又一借口。
1. 鍛煉我們理解物體的形體、輪廓、明暗的思維
比如看上面這張作品,在創(chuàng)作過(guò)程中我們要畫出瓶子的明暗關(guān)系,物體間交匯的陰影,各物體的輪廓,前后景的景深,畫布的褶皺方式等……而這都是有意識(shí)的思考后動(dòng)手才能完成的結(jié)果,構(gòu)成一幅平穩(wěn)準(zhǔn)確細(xì)節(jié)豐富的作品。持續(xù)的繪畫練習(xí),除了排線這些硬性的技巧,同時(shí)就是在鍛煉我們對(duì)畫面的專業(yè)思考能力,觀察和發(fā)現(xiàn)細(xì)節(jié)的習(xí)慣,而有這樣的思維訓(xùn)練,在以后我們繪制圖形、圖標(biāo)、擬物風(fēng)格作品的時(shí)候才能快速抓到要點(diǎn)。
比如看上面這練習(xí),就是因?yàn)槿狈@樣的思維能力,所以各處細(xì)節(jié)都有明顯的錯(cuò)誤。比如上層圓弧和下方的完全不一致,冰淇淋的投影導(dǎo)致像插在蛋糕上的紙片,左側(cè)流下的醬料已經(jīng)沒(méi)有受到光源直射了還和其它位置的高光使用一樣的亮度。這些細(xì)節(jié)的問(wèn)題并不是來(lái)源于軟件使用的不熟悉,而是做的時(shí)候在意識(shí)里壓根沒(méi)有這種概念,依葫蘆畫瓢也是有門檻的!所以很多人在擬物的練習(xí)上無(wú)論增加多少素材,也只是在錯(cuò)誤的道路上越走越遠(yuǎn)。再看看另一張大家都看過(guò)的圖:
成熟的作品,透視關(guān)系嚴(yán)謹(jǐn),圓盤和紙張垂直并傾斜的角度自然,紙張螺旋的形狀也合理。更細(xì)節(jié)的地方還包括邊緣做舊的效果,是持續(xù)變化的,而沒(méi)有這種美術(shù)思考能力的人只會(huì)畫出一條生硬的曲線。底部的反光和地面帶有橘紅氛圍色的處理也是亮點(diǎn),更接近真實(shí)世界的通透感塑造,沒(méi)有這種思考能力的人絕對(duì)想象不到的。
當(dāng)通過(guò)繪畫掌握美術(shù)的思考能力時(shí),畫擬物圖標(biāo)很快就會(huì)突破軟件的限制,因?yàn)槟銜?huì)清楚知道每個(gè)步驟自己應(yīng)該實(shí)現(xiàn)的是什么,然后查閱軟件的功能去實(shí)現(xiàn),每一次操作都是有的放矢。
2. 學(xué)會(huì)構(gòu)圖
還用上面那種那副靜物素描的圖來(lái)解釋。學(xué)畫畫的人應(yīng)該都知道,每次開(kāi)始這種現(xiàn)實(shí)描摹時(shí),我們要給靜物凹造型,比如瓶子要在正中央還是右側(cè),蘋果要放幾個(gè),堆到一起還是散開(kāi)各地,下方的畫布怎么給褶皺好看,這就是立體構(gòu)成的實(shí)踐操作。然后你需要把內(nèi)容完整畫進(jìn)紙上,就需要在畫布做構(gòu)圖,是用居中還是三角,黃金三分還是螺旋,無(wú)論通過(guò)什么手段,最終都是找到一個(gè)你覺(jué)得好看的位置。而這個(gè)過(guò)程也是平面構(gòu)成的實(shí)踐操作。在未來(lái)如果學(xué)習(xí)攝影也會(huì)有良好的助力。再說(shuō)日常一點(diǎn)的,這種經(jīng)驗(yàn),會(huì)落地到以后你做主視覺(jué)和排版的能力。
3. 紙和筆是我們最的試錯(cuò)工具
牢記住上面那句話,任何其它方式都沒(méi)有紙和筆有效率。當(dāng)我們要畫一套新的icon,新的主視覺(jué)、原型、分鏡、字體,都沒(méi)有可以媲美紙筆的形式(某些情況數(shù)碼繪畫也行)。比如下面的例子:
這是一個(gè)Mac OS上的APP的圖標(biāo),在定稿前經(jīng)歷下方大量的手繪方案。形體和創(chuàng)意是在手繪過(guò)程中完成的,換成每次都實(shí)際用PS做出來(lái),你們覺(jué)得需要消耗多少時(shí)間。并且,畫得越像,將需要表達(dá)的細(xì)節(jié)都考慮到,在電腦還原的操作過(guò)程效率也就越高,如果你只有小學(xué)生的手繪能力,這個(gè)手繪方案不僅無(wú)法代表最終結(jié)果,還可能在最終實(shí)現(xiàn)的過(guò)程里發(fā)現(xiàn)各種問(wèn)題面目全非。再者,去年現(xiàn)象級(jí)的騰訊營(yíng)銷方案,薛之謙的騰訊動(dòng)漫H5活動(dòng),在前期也做了大量的方案制定。
相信我,這個(gè)階段里面誰(shuí)都不會(huì)想看見(jiàn)各種小學(xué)生級(jí)別的圖像表達(dá)。直接和我們核心工作掛鉤的,還有繪制原型,這當(dāng)然是畫得越專業(yè)大家查看起來(lái)越舒適,何樂(lè)不為呢?最后舉個(gè)額外的例子,包括字體創(chuàng)作里,如果寫不出一手好字或者懂得怎么繪制的字體設(shè)計(jì)師,是成不了大器的,比如左佐老師最近的新書(shū)里提供的手稿:
如果不會(huì)用平行筆、平頭筆等專業(yè)書(shū)寫工具,那么只會(huì)用PS鋼筆的操作是遠(yuǎn)遠(yuǎn)不可能比手寫更有效率的。
繪畫學(xué)習(xí)提供專業(yè)的思考方式,觀察細(xì)節(jié)的方法,具備美感的基本認(rèn)知,并且讓我們以這種形式可以進(jìn)行設(shè)計(jì)方案多樣化的嘗試。這才是我們學(xué)習(xí)繪畫的最終目的。
總有很多人喜歡念叨天賦的問(wèn)題,但是相信我,我們需要掌握的合格的繪畫技巧完全沒(méi)到需要拼天賦的程度。
學(xué)設(shè)計(jì)的繪畫基礎(chǔ)是來(lái)實(shí)現(xiàn)設(shè)計(jì)目的不是用來(lái)當(dāng)畫家的,沒(méi)有誰(shuí)入門不是一條線畫得歪歪扭扭的,只要愿意花精力,愿意勤奮的練習(xí),一兩個(gè)月時(shí)間掌握基礎(chǔ)的繪畫水平是完全沒(méi)有問(wèn)題的,如果你一定要談理想談天賦,糾結(jié)那些虛無(wú)的藝術(shù)細(xì)胞,那么你只適合這個(gè)結(jié)論:萬(wàn)事開(kāi)頭難, 然后中間難,最后結(jié)尾更難。別人比你有天賦還比你更努力,那你努力還有什么用?
前面我已經(jīng)說(shuō)過(guò),繪畫的學(xué)習(xí)目的是什么。既然有目的,那我們就要制定合適的繪畫學(xué)習(xí)方向,不要盲目,戒驕戒躁,如果時(shí)間充足,有金錢預(yù)算,我還是推薦大家報(bào)一些高中生培訓(xùn)美術(shù)的畫室,這些畫室遠(yuǎn)遠(yuǎn)比成人美術(shù)培訓(xùn)的工作室水平更好。
1. 一定要從最簡(jiǎn)單的幾何石膏開(kāi)畫起,第一步掌握具體的輪廓,明暗關(guān)系。
2. 然后畫相對(duì)復(fù)雜的靜物,重點(diǎn)理解物體的排版,還有更復(fù)雜立體結(jié)構(gòu)表現(xiàn),光和影更豐富的表現(xiàn)形式。
3. 學(xué)結(jié)構(gòu)素描去解構(gòu)物體,掌握快速打稿的能力。而結(jié)構(gòu)素描的基礎(chǔ)比較脫離不開(kāi)前面素描繪畫的意識(shí)訓(xùn)練,對(duì)物體完整形體的認(rèn)識(shí)越深刻,結(jié)構(gòu)素描就越準(zhǔn)確,這也是將來(lái)我們?nèi)粘9ぷ髦锌梢员粦?yīng)用得最多的實(shí)際技能。
老實(shí)說(shuō),這個(gè)技能也同樣適用未來(lái)要學(xué)習(xí)3D軟件的情況,3D的建模水平和效率不止是讓你們掌握各種操作工具,更重要的是意識(shí),對(duì)物體立體結(jié)構(gòu)的拆解組合意識(shí)。
4. 可選項(xiàng),學(xué)習(xí)速寫。更適合經(jīng)過(guò)一點(diǎn)簡(jiǎn)單的訓(xùn)練,然后經(jīng)常在日常中隨手練習(xí),可以拓展出一些意想不到的效果。
那如果沒(méi)預(yù)算又非常沒(méi)時(shí)間的呢?只要畫好結(jié)構(gòu)素描和速寫。你不需要一本正經(jīng)的準(zhǔn)備畫板工具,每天只要有閑時(shí),用水筆和筆記本就可以進(jìn)行練習(xí),畫所有你們視線內(nèi)可以解構(gòu)的物體,杯子、電腦、手機(jī)、相機(jī)、臺(tái)燈、糖果盒,順便多看看網(wǎng)上的視頻,或者買點(diǎn)相關(guān)的技法書(shū)籍。
再次提示你們,學(xué)習(xí)繪畫我們是通過(guò)動(dòng)手的實(shí)踐鍛煉對(duì)應(yīng)的思考能力。有時(shí)候畫得不是太好沒(méi)關(guān)系,重點(diǎn)是一直帶著思考去學(xué)習(xí),每一次實(shí)踐都應(yīng)該讓你感覺(jué)到自己加深對(duì)物體的理解。
在這個(gè)過(guò)程中,由簡(jiǎn)到難的學(xué)習(xí),也適合同時(shí)進(jìn)行設(shè)計(jì)軟件中的擬物圖標(biāo)設(shè)計(jì)訓(xùn)練,圖形復(fù)雜度和自己的手繪階段進(jìn)行匹配,你們才可以更好吸收知識(shí)點(diǎn),將美術(shù)思維模式轉(zhuǎn)化到設(shè)計(jì)思考的過(guò)程里。
撲滅你們渴望裝逼的洪荒之力,扔了你們的數(shù)位板!扔了你們的數(shù)位板!扔了你們的數(shù)位板!學(xué)習(xí)繪畫只是我們學(xué)習(xí)設(shè)計(jì)的過(guò)程之一,不要掉進(jìn)學(xué)習(xí)的陷阱里面,覺(jué)得自己可以畫各種各樣的東西,開(kāi)始買數(shù)位板,開(kāi)始給妹紙、男神畫形象,開(kāi)始學(xué)習(xí)畫CG,畫漫畫,畫插畫!如果沒(méi)有很多年的基礎(chǔ)訓(xùn)練,你在拓展數(shù)碼繪畫的道路上是走不遠(yuǎn)的。舉個(gè)常見(jiàn)的例子:
很多人急不可耐就上手?jǐn)?shù)位板,你看再多相關(guān)的數(shù)碼繪畫的教學(xué),PS教學(xué),功底不行就是不行,畫的東西都是半吊子水平。況且你們是學(xué)設(shè)計(jì)不是學(xué)插畫的,總想著畫一些一瓶不滿半瓶晃蕩的東西出來(lái)展示,毫無(wú)意義。請(qǐng)帶著明確的目的出發(fā),掌握好繪畫這門基礎(chǔ)技能,做一名更合格的UI設(shè)計(jì)師吧!
藍(lán)藍(lán)設(shè)計(jì)( sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://sillybuy.com