有一種方法，能幫助設(shè)計(jì)師擴(kuò)展自己的視覺(jué)詞匯，并且能有效的提高UI設(shè)計(jì)的水平。但是我卻很少聽(tīng)到數(shù)字設(shè)計(jì)師提起過(guò)。
它是什么呢？
我說(shuō)的這種方法就是臨摹。臨摹是一種被畫家和作家使用了幾個(gè)世紀(jì)的方法。這是一種為了提高自己的技能，盡可能重現(xiàn)現(xiàn)有作品的過(guò)程。對(duì)于我們來(lái)說(shuō)，這意味著一個(gè)像素一個(gè)像素的重現(xiàn)優(yōu)秀的用戶界面作品。
我保證，臨摹并不像它聽(tīng)起來(lái)那么沒(méi)有意義。臨摹的關(guān)鍵在于，挑選比你現(xiàn)有的水平高一點(diǎn)的作品。通過(guò)復(fù)制你能力之外的東西，你將會(huì)提升你的技能。
所以，如果你想提高你對(duì)顏色的使用。那么你可以選擇一些用色大膽的作品臨摹。如果你想在奢侈品的品牌形象上有所長(zhǎng)進(jìn)，就找一些相對(duì)豪華、時(shí)尚的品牌網(wǎng)站進(jìn)行臨摹。
這并不是什么捷徑，事實(shí)上很難有比它更普通的練習(xí)了。但它是我知道提高UI設(shè)計(jì)技能的最有效的學(xué)習(xí)方式。
哪個(gè)是原稿，哪個(gè)是臨摹的副本？
作家們也會(huì)臨摹
我第一次聽(tīng)說(shuō)臨摹是在一個(gè)叫The Art of Manliness的blog，Brett McKay 舉了很多通過(guò)臨摹來(lái)磨煉自己寫作技能的諸多作家的事例。
杰克·倫敦 曾臨摹過(guò) Rudyard Kipling 的文字，用來(lái)學(xué)習(xí)他世界級(jí)的措辭和節(jié)奏技巧。
羅伯特·劉易斯·史蒂文 會(huì)非常仔細(xì)的研究他看過(guò)的特別美麗的文字段落，然后利用記憶將其在自己的作品中再現(xiàn)。
本杰明·富蘭克林會(huì)對(duì)好文章中的每一個(gè)句子都寫筆記分析，然后過(guò)幾天，他通過(guò)閱讀筆記重新寫一篇，再對(duì)兩者進(jìn)行比較。
這種例子舉不勝舉，我知道，著名的神秘主義作家錢德勒，也使用了一種類似本杰明的方法，依靠詳細(xì)的筆記重寫一個(gè)中篇小說(shuō)，并與原文相互比較。
他后來(lái)寫信給原著作者，告訴他這項(xiàng)練習(xí)的指導(dǎo)意義。注意他是這么分析的：
我發(fā)現(xiàn)你的手法最精妙的地方在于厘清局勢(shì)（或者把情況弄假成真），這一點(diǎn)幾乎是難以置信的，但是在實(shí)際閱讀中卻看起來(lái)相當(dāng)真實(shí)。我希望你把我這番話理解為夸獎(jiǎng)的意思。我從來(lái)沒(méi)有哪怕是試著自己做過(guò)這件事情。大仲馬在這點(diǎn)上有極強(qiáng)的能力。狄更斯也一樣。這也許是所有快速工作的基礎(chǔ)，因?yàn)榭焖俚墓ぷ骱茏匀坏匦枰艽蟪潭鹊募磁d發(fā)揮，而創(chuàng)造一個(gè)即興的場(chǎng)景不可避免的需要相當(dāng)不錯(cuò)的技巧。
這不是一個(gè)生搬硬套的練習(xí)。錢德勒通過(guò)這個(gè)練習(xí)對(duì)他自己和其它作者之間文筆細(xì)微的差別已經(jīng)了然于心。你能對(duì)UI設(shè)計(jì)有如此清晰的認(rèn)識(shí)么？如果沒(méi)有，我強(qiáng)烈推薦通過(guò)臨摹來(lái)練習(xí)。
正如作家通過(guò)臨摹名家的作品，無(wú)意識(shí)的吸收了他們對(duì)于那些文字、短語(yǔ)、節(jié)奏等的細(xì)微的選擇，一個(gè)設(shè)計(jì)師也可以通過(guò)臨摹去體會(huì)設(shè)計(jì)中的布局、文字、顏色以及各種裝飾。這就是臨摹的力量。
讓我們?cè)賮?lái)看看另外一種具有非常悠久歷史的藝術(shù)形式中的臨摹方法。
臨摹名畫
在美術(shù)畫廊的臨摹。
如果你漫步在藝術(shù)博物館，你可能會(huì)看到很多人正在現(xiàn)場(chǎng)臨摹著。畫家們臨摹有著比作家更悠久的歷史。萊昂納多·達(dá)芬奇通過(guò)臨摹他的老師（安德烈·德?tīng)枴ろf羅基奧）來(lái)提升繪畫技巧，這是文藝復(fù)興時(shí)期的學(xué)徒藝術(shù)家的慣例。達(dá)芬奇甚至將臨摹作為學(xué)生的首要實(shí)踐項(xiàng)目：
藝術(shù)家應(yīng)該首先通過(guò)從臨摹大師的手中的作品來(lái)練習(xí)技巧。
為什么要這樣做？因?yàn)榕R摹可以訓(xùn)練你的眼睛。
當(dāng)你畫一個(gè)現(xiàn)實(shí)的場(chǎng)景，會(huì)有很多需要擔(dān)心的事情，模型會(huì)移動(dòng)，風(fēng)可能會(huì)吹亂東西，太陽(yáng)會(huì)落山等等。在你的大腦能夠自然的思考顏色和形狀之前，在現(xiàn)實(shí)中繪畫是很艱難的。但是如果是在工作室里臨摹的話，你可以用你全部的精力去吸收那些繪畫基本知識(shí)。
界面設(shè)計(jì)師雖然不需要繪制現(xiàn)實(shí)的場(chǎng)景，但是臨摹仍然是一個(gè)有效地方法去屏蔽掉額外的干擾因素，從而迅速提升你的基礎(chǔ)技能。
雖然它曾經(jīng)是世界上最偉大的藝術(shù)家的一個(gè)基礎(chǔ)性的練習(xí)，臨摹現(xiàn)在已經(jīng)沒(méi)落了。如今，它被視為生搬硬套，缺乏創(chuàng)造力和抄襲。
那么，為什么UI設(shè)計(jì)師需要用臨摹來(lái)練習(xí)。
這都是源于對(duì)細(xì)節(jié)的重建
重點(diǎn)是這樣的：當(dāng)你一個(gè)個(gè)像素的臨摹的時(shí)候，你不得不重做原作設(shè)計(jì)師之前做過(guò)的每一個(gè)決定：選用哪種字體？多大合適？用什么背景圖片？你會(huì)沉浸在那些優(yōu)秀的設(shè)計(jì)師所作出的細(xì)微的決策中。
你可能會(huì)說(shuō)，會(huì)不會(huì)在臨摹中將一些該注意的決策都忽略掉了呢？也有可能。但是只要你認(rèn)真了，臨摹還是會(huì)暴露一些你自己從來(lái)沒(méi)有關(guān)注過(guò)的設(shè)計(jì)決策。
臨摹 Epicurrence Oahu 網(wǎng)站是我重要的學(xué)習(xí)經(jīng)歷。
例如，我對(duì)Dann Petty的Epicurrence網(wǎng)站的臨摹是非常有價(jià)值的一次經(jīng)歷。我從這個(gè)過(guò)程中內(nèi)化了三件事：
超大的字體
臨摹中用到的“Hawaii”的首字母 H 的字號(hào)竟然是365號(hào)。這么多年的設(shè)計(jì)中我從來(lái)沒(méi)有敢用過(guò)這么大的字。然而，將字母做成視覺(jué)元素，和圖片結(jié)合在了一起的感覺(jué)非常酷。
利用畫筆的筆觸作“陰影”
在標(biāo)題、菠蘿、游泳的圖片下面，原本應(yīng)該是一些陰影的地方卻使用了筆觸的效果，哇，這真是一個(gè)奇妙的手法。
慷慨的大寫字母間距
毫無(wú)疑問(wèn)，利用大寫字母可以增強(qiáng)元素的對(duì)齊的感覺(jué)、提升間距可以讓字體更優(yōu)雅是教科書式的做法，我發(fā)現(xiàn)自己越來(lái)越不自覺(jué)的應(yīng)用這些方法。這里看到的很酷的大些字母，基本上都調(diào)整過(guò)了間距。
在我臨摹Dann Petty這個(gè)作品之前，我看到它只會(huì)想“哇，這作品真的很棒”，然而我并不能在看了之后把作品中的技巧變成自己的。只有臨摹之后，我才可能真正吸收了作者的思考的方法和設(shè)計(jì)技巧。
對(duì) Vic Bell 的 Skedio 圖標(biāo)集的臨摹讓我的技能得到了很大的提升。（紅色的是我的臨摹）
這是另一個(gè)例子。Skedio 是圖標(biāo)設(shè)計(jì)大師 Vic Bell 的作品。（她的原件是藍(lán)色的，我的復(fù)制品是紅色的。）
這又是一個(gè)令人著迷的練習(xí)，因?yàn)?Vic 的圖標(biāo)總是比我自己的圖標(biāo)有著更多和更豐富的細(xì)節(jié)。她用兩種微妙的方式增加了這種復(fù)雜性：
第二個(gè)稍微淺一些的藍(lán)色
對(duì)比第二行的第一個(gè)圖標(biāo)“setting”，描邊和填充顏色深淺不一。而我之前設(shè)計(jì)的圖標(biāo)大都只有一種顏色。
第二條稍微細(xì)一點(diǎn)的描邊
第一行第二個(gè)“tags”中代表文字的兩條線和第三個(gè)“upgrades”中的箭頭，所用的粗細(xì)和描邊是不一樣的。我一直以為圖標(biāo)中粗細(xì)需要完全一致，但事實(shí)上 Vic 使用了 3px和4px 的兩種粗細(xì)。
臨摹并不僅僅在于幫助你“看到”這些細(xì)節(jié)，更在于幫助你如何在設(shè)計(jì)中使用這些細(xì)節(jié)。
讓我們看看這個(gè)點(diǎn)子，給強(qiáng)調(diào)色配上一個(gè)輔助的、淺一些的顏色。Vic會(huì)在以下四中情況中用到：
作為陰影 如第二行的第三個(gè)圖標(biāo)“delete”，還有第一行的第三個(gè)“upgrades”
作為光線
第三行的第五個(gè)“search”
顏色對(duì)比
第一行的第四個(gè)圖標(biāo)“help”和第二行第四個(gè)“rename”
視覺(jué)重量對(duì)比
第一行第一個(gè)“all sketches” 和第三行第五個(gè)“l(fā)ayers”。利用不同的顏色將白色的前景凸顯出來(lái)。
左邊是Taylor Perrin的Díade los Muertos的設(shè)計(jì)，右邊是我的副本。
我不久前看到了Taylor Perrin的Díade los Muertos設(shè)計(jì)，它讓我震驚了。他處理元素的方式非常讓我向往，如美麗的攝影，豐富的紋理和全景布局。
我平時(shí)大部分的時(shí)間都是用來(lái)設(shè)計(jì)干凈，簡(jiǎn)潔的企業(yè)應(yīng)用程序。臨摹Taylor Perrin的作品讓我以一種新的方式拓展了我對(duì)設(shè)計(jì)的思考。
一個(gè)新的工作流程
我打從一開(kāi)始就是Sketch的擁護(hù)者。我甚至在教一個(gè)基于Sketch的UI課程，但它的簡(jiǎn)單性也有其缺點(diǎn)。也就是說(shuō)，由于從Photoshop切換到Sketch，我的設(shè)計(jì)反射趨向于一切都是平面矩形。在這個(gè)練習(xí)中，我對(duì)整個(gè)頁(yè)面的每一個(gè)背景進(jìn)行了紋理化，它是通過(guò)PS來(lái)提醒我，在設(shè)計(jì)過(guò)程中讓風(fēng)格更多樣化，而不只是使用簡(jiǎn)單的元素。
讓平庸的素材閃耀
我第一個(gè)重塑的對(duì)象是那個(gè)吹號(hào)角的骷髏。老實(shí)說(shuō)，當(dāng)我在網(wǎng)上找到它時(shí)，我并沒(méi)有什么印象深刻的感覺(jué)。如果我按照我平時(shí)的喜好來(lái)找素材，我肯定就忽略它了。但是它在Perrin的作品里看起來(lái)很棒。臨摹的過(guò)程讓我學(xué)到這樣一件事，你可以讓平庸的素材在你的作品里超越它的外觀。
全寬布局
雖然最近全寬的布局越來(lái)越流行了，但是我自己很少這么做。這個(gè)練習(xí)幫助增強(qiáng)了處理這類布局的信心。當(dāng)我臨摹的時(shí)候，我會(huì)嘗試著猜測(cè)某些細(xì)節(jié)（例如字體的大小），看看是不是正確的。然后我再檢查和調(diào)整。如果我以后再處理1400寬度的布局網(wǎng)頁(yè)的時(shí)候，就不會(huì)為標(biāo)題是60像素而感到奇怪了。
那么，我這樣就跟Dann Petty、Vic Bell、Taylor Perrin 一樣好了么？我覺(jué)得這恐怕還得花些時(shí)間，畢竟他們是游戲行業(yè)最頂尖的UI設(shè)計(jì)師。但是我相信，我每天都在將他們的技能融入到自己的能力中。
常見(jiàn)問(wèn)題
你都是什么時(shí)候臨摹的？
我一般都會(huì)在早上臨摹30分鐘左右。有兩個(gè)好處：
醒來(lái)的時(shí)候?qū)W習(xí)一些新東西可以激勵(lì)我開(kāi)始新的一天。
相比查郵件和微博來(lái)說(shuō)臨摹是更有效的喚醒活動(dòng)。沖咖啡的時(shí)候總需要做點(diǎn)事情。
感謝您對(duì)極地作品的預(yù)覽，品牌策劃與設(shè)計(jì)，形象店設(shè)計(jì)制作，專注中高端品牌策劃設(shè)計(jì)，我們更專業(yè)，歡迎咨詢微信/手機(jī)：13656226579 0512-89169975 m.zjjqqjs.com
|
