如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

在過(guò)去幾年當(dāng)中，插畫(huà)開(kāi)始以一種堅(jiān)挺的姿勢(shì)，站在設(shè)計(jì)趨勢(shì)的最前列。不止是原本身處各個(gè)領(lǐng)域的畫(huà)手和插畫(huà)師開(kāi)始越來(lái)越受追捧，而且連網(wǎng)頁(yè)、UI和動(dòng)效設(shè)計(jì)師都紛紛學(xué)習(xí)插畫(huà)設(shè)計(jì)。當(dāng)然，更顯著的變化，是插畫(huà)在網(wǎng)頁(yè)和UI中的使用越來(lái)越多，越來(lái)越頻繁，甚至越來(lái)越多樣。

多年來(lái)，插畫(huà)被廣泛地運(yùn)用在雜志、圖書(shū)、報(bào)紙、海報(bào)、傳單等不同的傳統(tǒng)載體之上，新的工具和技術(shù)使得它更加輕松地植根于數(shù)字化媒體當(dāng)中。

作為設(shè)計(jì)中，最具有表現(xiàn)力的元素，一張插畫(huà)所傳遞的信息比文字更多更豐富。在UI和網(wǎng)頁(yè)中，使用插畫(huà)來(lái)輔助傳達(dá)信息，無(wú)疑更加直接到位。而插畫(huà)的可定制性之強(qiáng)，猶在圖片之上。

插畫(huà)在UI界面中的運(yùn)用，可以說(shuō)相當(dāng)廣泛了，它更清晰，更時(shí)尚，也可以更加精準(zhǔn)，甚至更有表現(xiàn)力，為什么不用呢？就適用范疇而言，我們可以觀察到，它可以運(yùn)用到這些地方：

• 頁(yè)面主題圖

• 網(wǎng)頁(yè)首圖和Banner

• 吉祥物和形象插畫(huà)

• 博客文章配圖

• 新用戶引導(dǎo)教程

• 工具提示

• 獎(jiǎng)勵(lì)頁(yè)面和成就頁(yè)面

• 游戲化設(shè)計(jì)的頁(yè)面

• 通知和系統(tǒng)消息

• 聊天表情

• 講故事的輔助配圖

• 信息圖

• 營(yíng)銷(xiāo)和廣告圖

• 圖標(biāo)和裝飾性內(nèi)容

• 社交媒體頁(yè)面

• 支持性內(nèi)容的頁(yè)面

插畫(huà)的適用范圍之廣，這些總結(jié)出來(lái)的使用場(chǎng)景，并不是全部。插畫(huà)本身的屬性很有意思，它連接了設(shè)計(jì)，作為內(nèi)容呈現(xiàn)，還帶著明顯的藝術(shù)化的屬性。今天的文章，我們總結(jié)一下在設(shè)計(jì)中使用插畫(huà)的10個(gè)理由和注意事項(xiàng)。

1. 插畫(huà)是設(shè)計(jì)的原創(chuàng)性和藝術(shù)性的基礎(chǔ)

無(wú)論是印刷品、品牌設(shè)計(jì)還是UI界面，更加風(fēng)格化的插畫(huà)能夠?qū)⒉煌娘L(fēng)格和創(chuàng)意加入其中，在激烈的競(jìng)爭(zhēng)中更容易因此脫穎而出。留下用戶才有轉(zhuǎn)化。

同樣的，在博客、新聞和Banner 中使用插畫(huà)，也是看準(zhǔn)了插畫(huà)可以根據(jù)內(nèi)容進(jìn)行深度定制的優(yōu)勢(shì)，這種微調(diào)能讓內(nèi)容更加統(tǒng)一一致，更加符合產(chǎn)品目標(biāo)，借助色彩、角色、環(huán)境甚至暗藏的隱喻，來(lái)吸引特定的用戶。

2. 插畫(huà)是視覺(jué)觸發(fā)器，瞬間傳達(dá)大量信息

我們常說(shuō)「一圖勝千言」不是沒(méi)有道理的。人的視覺(jué)感知能力很強(qiáng)，看到圖片的一瞬間，也許還沒(méi)有來(lái)得及進(jìn)行邏輯思考，但是大腦已經(jīng)接收到大量的信息和內(nèi)容。

• 心理學(xué)研究表明，人類(lèi)只需要大概1/10秒就可以感知到場(chǎng)景中絕大多數(shù)的元素和基本視覺(jué)信息。

• 視覺(jué)信息可以更快傳遞到大腦，而重要的信息，人類(lèi)也通常會(huì)被固化為視覺(jué)圖像，而非文本化的記憶。

• 文本需要依托可讀性設(shè)計(jì)，而圖片和插畫(huà)則會(huì)被直接識(shí)別。

• 圖片和插畫(huà)更容易打破文化和語(yǔ)言隔閡，傳遞內(nèi)容含義。

• 對(duì)于視障用戶、閱讀障礙用戶和兒童，圖片插畫(huà)更容易被理解。

 

3. 插畫(huà)是標(biāo)題和文本的重要支撐

雖然圖片一瞬間傳遞的信息很多，但是圖片在很多時(shí)候是無(wú)法提供精準(zhǔn)而詳細(xì)的內(nèi)容。用戶依然需要文本來(lái)呈現(xiàn)清晰而可以被閱讀和記錄的內(nèi)容，所以文本依然是不可或缺的。在另外一方面，文本和標(biāo)題已經(jīng)具備的情況下，經(jīng)過(guò)定制的插畫(huà)能夠輔助用戶理解，更清晰的記憶。

在很多特定的領(lǐng)域，舉個(gè)例子比如說(shuō)金融，插畫(huà)能夠借助色彩、圖形和形象來(lái)講述故事，讓用戶更清晰的理解復(fù)雜的金融功能，甚至強(qiáng)化信任感，而這是文本所不具備的。插畫(huà)能帶來(lái)強(qiáng)烈的情感連接。

4. 插畫(huà)更適宜呈現(xiàn)故事

故事是最令人難忘的內(nèi)容，劇情的走向和起承轉(zhuǎn)合會(huì)給人留下深刻的印象。而插畫(huà)則以清晰的形象將文字和意象勾連起來(lái)，無(wú)論是在網(wǎng)頁(yè)、UI設(shè)計(jì)還是內(nèi)容和體驗(yàn)上，都有著足夠突出的體現(xiàn)。

營(yíng)造氛圍，渲染情緒，描摹環(huán)境，呈現(xiàn)角色，插畫(huà)讓故事更加鮮活、易于理解。在內(nèi)容制造上，有著難以替代的作用。

5. 插畫(huà)獨(dú)有的情感吸引力

人是情感動(dòng)物，看似理性的皮囊之下，幾乎每個(gè)決定都是在情感和情緒的驅(qū)動(dòng)下完成的。如果某個(gè)設(shè)計(jì)除了能夠幫你達(dá)成某個(gè)目標(biāo)，還能讓你感到愉悅，會(huì)心一笑，那么通常下一步就是將它收藏起來(lái)并且分享給朋友。而在諸多設(shè)計(jì)因素當(dāng)中，插畫(huà)在撬動(dòng)用戶情緒這一點(diǎn)上，有著無(wú)與倫比的效用——從線條、色彩到面部表情和曲線和動(dòng)效，都在竭盡全力地為你闡述故事，營(yíng)造氛圍，將你拉到故事和場(chǎng)景當(dāng)中去。

6. 插畫(huà)賦予設(shè)計(jì)以美學(xué)價(jià)值，更容易被接受

即使所有人都在分析和爭(zhēng)論產(chǎn)品的可用性和易用性，大家在對(duì)美的追求上，始終保持著一致的態(tài)度。一個(gè)設(shè)計(jì)是否具備可取性，是否能夠通過(guò)甲方、客戶和實(shí)際用戶，是每個(gè)設(shè)計(jì)人都需要面對(duì)，都力求做到最好的事情。精心設(shè)計(jì)的插畫(huà)在美學(xué)和風(fēng)格上更加扎實(shí)，風(fēng)格化的設(shè)計(jì)不弱于現(xiàn)成設(shè)計(jì)素材所提供的價(jià)值。

7. 插畫(huà)能讓品牌識(shí)別度更高

和文本相比，插畫(huà)的視覺(jué)化屬性無(wú)疑是更強(qiáng)的。圖片插畫(huà)所提供的定制化內(nèi)容能夠從各個(gè)方面來(lái)貼合品牌的需求，更加到位地表達(dá)品牌所需呈現(xiàn)的信息。這也使得插畫(huà)不僅僅在品牌宣傳的時(shí)候，運(yùn)用在廣告、海報(bào)等顯而易見(jiàn)的地方，而且也成了品牌 APP 中新用戶引導(dǎo)和教程中必不可少的元素。

就像 Perfect Recipes 這個(gè)應(yīng)用的新用戶引導(dǎo)屏中，就借助插畫(huà)來(lái)呈現(xiàn)。而 Toonie 這個(gè)可愛(ài)的鬧鐘應(yīng)用當(dāng)中，甚至借助游戲化的設(shè)計(jì)，集成了大量有趣的表情和貼紙，當(dāng)然，它們都是使用定制化的插畫(huà)來(lái)呈現(xiàn)的。

8. 數(shù)字插畫(huà)還能強(qiáng)化交互，應(yīng)用在短視頻中

數(shù)字化的好處就在這里，通過(guò)不同的數(shù)字軟件，合理的處理之后，不僅能夠變成動(dòng)態(tài)的，運(yùn)用于視頻當(dāng)中，還能夠作為微交互，強(qiáng)化產(chǎn)品的整體體驗(yàn)。

一旦涉及到的動(dòng)效和短視頻，整個(gè)數(shù)字插畫(huà)就開(kāi)始具備更多的可能性了，不同的動(dòng)效能帶來(lái)截然不同的感覺(jué)和體驗(yàn)，更不用說(shuō)這種玩法正貼合時(shí)下的流行趨勢(shì)。

Whizzly 這個(gè)動(dòng)態(tài)圖標(biāo)就是基于插畫(huà)，給一個(gè)創(chuàng)意分享社區(qū)所準(zhǔn)備的。

9. 插畫(huà)的獨(dú)特性來(lái)自于其中的隱喻和引人入勝的視覺(jué)

和藝術(shù)一樣，設(shè)計(jì)中同樣需要借助隱喻來(lái)傳達(dá)一些相對(duì)更有趣、更深刻、更有意思的信息。插畫(huà)的獨(dú)特性也是借此來(lái)構(gòu)成，包含的隱喻使得其中的價(jià)值更加復(fù)合，值得反復(fù)咂摸，而不是一眼就可以完全看穿。

在這個(gè)約會(huì)應(yīng)用的網(wǎng)頁(yè)當(dāng)中，插畫(huà)無(wú)疑傳遞出了多重的信息，暗含的隱喻告知了用戶產(chǎn)品的功能和屬性。而下面這幅插畫(huà)則是為一篇如何找到原創(chuàng)風(fēng)格的文章所準(zhǔn)備的，圖中的金魚(yú)指代的則是難以被抓住的靈感和風(fēng)格。

10. 插畫(huà)讓用戶可以更快理解和操作

無(wú)論是圖標(biāo)還是大幅的插畫(huà)，都能幫助用戶理解，更加直觀地知道要看哪里，要做什么。面對(duì)如今的數(shù)字界面，用戶的注意力持續(xù)的時(shí)間越來(lái)越短，而插畫(huà)則讓用戶更快、更直接地獲取信息，并且決策下一步要做什么。如果插畫(huà)或者圖標(biāo)內(nèi)容不能被用戶一眼看出來(lái)，那么用戶就只能借助文本標(biāo)簽來(lái)了解功能是什么。設(shè)計(jì)師可以通過(guò)測(cè)試來(lái)測(cè)試圖標(biāo)和插畫(huà)的可用性和識(shí)別度。

值得思考的問(wèn)題

當(dāng)然，插畫(huà)的設(shè)計(jì)是沒(méi)有門(mén)檻的，在設(shè)計(jì)的時(shí)候，要求也是比較高的。在使用和設(shè)計(jì)插畫(huà)的時(shí)候，需要考慮以下的幾個(gè)方面：

• 目標(biāo)受眾（身體能力，年齡，文化背景，教育水平等）

• 產(chǎn)品的使用環(huán)境

• 產(chǎn)品和內(nèi)容的在全球范圍內(nèi)和當(dāng)?shù)氐膫鞑ニ?/span>

• 所選圖形的隱喻以及是否容易被識(shí)別

• 插畫(huà)是否會(huì)讓人分心

藍(lán)藍(lán)設(shè)計(jì)( www.cqzjtgb.com )是一家專(zhuān)注而深入的界面設(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ù)