在過(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ù)氐膫鞑ニ?/p>
所選圖形的隱喻以及是否容易被識(shí)別
插畫(huà)是否會(huì)讓人分心