插畫是網(wǎng)頁當中最常見的設(shè)計元素之一,無論是用是強化視覺,還是傳達信息,都是非常不錯的,這也是為什么它越來越受到設(shè)計師的追捧。通常我們會說一圖勝千言并不是沒有道理的,圖形更容易吸引用戶的注意力。Tubik Studio 的設(shè)計師常常會基于用戶的需求繪制各式各樣獨特的插畫,在這方面經(jīng)驗非常豐富。這次,我們讓平面設(shè)計師 Yaroslava Yatsuba 來分享一下,她為博客類網(wǎng)站創(chuàng)建插畫的技巧和實踐經(jīng)驗。
Yaroslava 曾經(jīng)接到過為IT 博客繪制文章插畫的任務(wù),他需要借助插畫來表達隱喻,呼應(yīng)文章,還避免用戶注意力被轉(zhuǎn)移。
在創(chuàng)作過程中,她逐漸摸索出一套成型的做法。她需要在創(chuàng)作之初就同作者或者編輯進行溝通,了解文章所要表達的主題和思想,然后進行下面的處理:
分析其中的內(nèi)容,梳理出一般信息
試圖定義文章的核心關(guān)鍵字,將它們作為插畫的出發(fā)點
找出相似的領(lǐng)域或者活動
考慮通過色彩和明暗來表達主題
通過實際操作,Yaroslava 摸索出三種具體創(chuàng)作的方法。
這種方法是最簡單的,但是它并不一定是成功率最高的做法。搭配法簡單說來說,就是借助電腦或者手機,直接記錄將要繪制圖片的具體需求和相關(guān)背景,將人物角色和文章的主題元素相互結(jié)合起來構(gòu)成插畫。
舉個例子,下面的插畫是為一篇名為《UI設(shè)計中的格式塔原理:接近性原則》的文章所繪制的,需求上需要一張靜態(tài)的圖片,通過紋理和明亮的色彩來吸引用戶的注意力。這樣一來,整個插畫的繪制方向就很清晰了。
而在《 2017 年UI設(shè)計流行趨勢回顧》的文章當中,需求類似,設(shè)計師采用了漸變色彩和動態(tài)合成的方式來繪制了相應(yīng)的插畫。
組合法是試圖讓角色和界面元素之間發(fā)生交互,通過夸張的方式來傳達隱喻,表現(xiàn)交互。比如在大按鈕上繪制出小角色,或者讓元素擬人化走出手機界面等等。
在這篇關(guān)于UI動效的文章當中,其實包含了很多隱喻,仔細琢磨一下,智能手機似乎更像是一個帶著帷幔的表演舞臺,UI元素像是提線木偶,而設(shè)計師則是背后操控這些木偶的操縱者。這樣一來,整個插畫的構(gòu)思就非常清晰了。不過和以往的插畫不同,這個插畫中每個角色的地位是均等的,并無主次之分。插畫的背景中,紋理是手工繪制的,加入豐富的色彩,確保能夠吸引人的注意力。
這篇文章當中的另外一幅插畫也是遵循類似的方法來進行繪制的。