設計翻譯

產品設計裡的插畫應用：不只是可愛—要精打細算

“喔喔喔喔你畫了一些小插圖耶！哇嗚很可愛。”

“等一下。所以這就是你全部要做的嗎？你是說，你只是一個畫畫的人？這就是你唯一可以做的事嗎？”

此文翻譯自的 SHOPIFY 設計師的文章 Illustration in Product Design: Calculated, not cute. 本篇除封面圖片之內文及圖片，版權皆為作者所有。原文連結

你應該已經注意到使用插畫的潮流— 如果你還沒有，先按一下暫停鍵去看一下 Dribbble 上的熱門頁面，再回來繼續看我的文章。 Airbnb、Dropbox、Google — 還有天殺的棒的 Intercom 銷售頁面 — 他們都善用插畫讓他們再產品頁獨樹一格。隨著 Dribbble 的出現，插畫家正在以他們的方式設計我們的數位世界。這會怎麼演進呢？插畫會一直存在嗎？還是它注定跟長陰影跟細微紋理的趨勢一樣退流行呢？

當然囉，插畫已經存在很多年了，只是我們現在才注意到。它這幾年才變得更受歡迎的原因很明顯，我就直說囉：插畫非常討喜。如果你喜歡一個東西，你就會更大膽的去嘗試。但是呢，如果把插畫歸類為一種工具 — 而絕不是一種趨勢 —它就同時具備了溝通和感性的能力。它可以把抽象的想法，天衣無縫的提煉成一個促使你去使用產品的核心概念，把它完善、真實地表達出來。

插畫能說故事

在自己產品的系統裡你其實很容易迷失。在你耗費時間在統整你的效果跟，呃，樣式清單時，你會無法控制的失去方向⋯⋯（對 Ok，我很顯然的不知道你在煩惱什麼⋯⋯但我知道你一定在煩惱只有你才能注意到的某些事。嘿，我懂，我們都是設計師。）。向你的使用者解釋，他們為何該使用你的產品；它們將如何融入你的生活；為什麼絕對不要浪費時間在試圖將你的產品超越其他產品；這是永遠不可能達到的虛無目標。插畫將隱喻跟故事帶回你的產品分享軍火庫。插畫將抽象的想法變成我們可以理解的方式，他超越了不斷演進的數位領域，讓我們發現、然後說服我們每天去使用產品的原因，並找到一種簡潔並且與人習習相關的方式分享。

插畫能傳遞你的價值

表達和傳達品牌價值，是任何長久產品的重要的一部分。以任何一個成功品牌的品質為借鑒； 我們知道它必須是令人難忘、獨特的和長遠的。我們知道一個成功的品牌應該有和他的消費者相關的個性、特徵和價值觀。但產品不是品牌。產品是一個工具（有品牌的工具）。 一個在有限的螢幕空間裡，又有競爭目標的工具。 「令人難忘的，獨特的和長遠的 」特性可以透過正確的產品設計順利完成，但同時要傳達品牌特質和價值觀肯定是更具挑戰性的。 每次出現新功能，像素通常以可用性為主，品牌價值往往被丟在後座。

插畫可以捕捉品牌的價值，以及把它傳遞給使用者。插畫解讀品牌建立的原則，爲使用者提供了一些人類可以理解的連結。它確認了這個產品背後是真實的人類。以共同價值觀跟長遠的人際連結為基礎建立的忠誠度，可以讓品牌跟使用者的關係更豐富持久。

插畫能表達意見

在你的產品中，你的觀眾可能會改變。他們的任務可能會不一樣，他們的情緒狀態是波動的。我們很善於預測使用者的情緒狀態，但是對他們的感情狀態傳達同理心還是一項挑戰。我們該如何穿過螢幕的限制，向使用者說明我們也感到沮喪？或是，我們如何在使用者成功時，向他們分享我們也真誠的為他們感到喜悅？然後，我們該如何在同一個平台上、使用相同的介面，保持使用意義跟連結，並且同時做到這兩點呢？

對啦你知道我要說什麼。插畫是能傳達意見的。就像任何聲音一樣，他可以改變語調跟聲量，去反應特定情況的細微差異。當你預期情緒並進行對應的調整時，使用者會更加專心，並且試著去接受你給他們的資訊。

插畫能抓住你的使用者

我不知道為什麼 404 頁面和錯誤訊息都被歸類為「這不是我們的問題喔」，「如果有機會我們會處理它」或是幸運的收到像是「復活節彩蛋」般的網頁角落的訊息。我是說，我們來談談這個痛點吧。我們動員了一整個使用者研究團隊來觀看動眼儀，以確保按鈕被放在對的位置，但是跳過解釋為什麼幾乎每件事都出錯了。我很確定我有一半的友情都來自於分享 adobe 閃退出現原因不明的錯誤訊息的創傷。

沒有掌握這些時刻的設計就是壞設計。它就是一個 「我們一直到現在都忘記設計的經驗」我要跟大家說這真的爛透了；直到我要換去用 Sketch 了， 他們才把它加入「等我們找到時間就會做」的待辦清單。

對於軟體閃退我們無能為力（其實我們可以，但我們假設有人已經在做這方面的工作了）。當問題出現時，我們唯一可以做的事是接受它。加一個插畫讓你的產品像是說「我會幫你想辦法找回來」而不是「你自己想辦法」。這是一個你跟使用者對話的機會。插畫在說明「我們正在想辦法改進它」或是「我們明白這個軟體是你的生存工具」時創造了真誠且親密的溝通。這是一個帶你的使用者走出困擾狀態、並且帶他們回到正向體驗的機會。

插畫能領導你的使用者

對，所以當軟體失敗時我們會說「我們會支持你。」然後呢？插畫可以引導你的使用者

插圖可以引導使用者回到產品的預期用途，或指導他們學會新功能。它可以把一個空洞的狀態訊息變成一個學習的機會，擔任一個入門指導員的角色，教導使用者學習在概念跟特定的產品術語間，找到連結。它可以運用流程來引導使用者，或是解釋抽象的點子跟過程。它直接和使用者對話，創造一個歡迎的氛圍，並且在事情很複雜時，讓他們感受到重視。

插畫完整了設計體驗

如果我還不能贏得你的認同，我知道接下來你會同意的。一個完整的產品。不會有鬆散的結束。一個體驗是從開始到結尾都經過縝密思考的。它是為邊緣案例跟替代需求而設計的。它希望你的使用者充滿好奇的去探索，然後在另一端發現他們在潛在的未知空間中體驗到樂趣跟溫暖。

我不是說每個人都要開始在產品裡放滿畫。插畫並不總是一個答案（事實上它很多時候都不是一個好解法。）但把插畫忽略成只是「可愛」而不去斤斤計較的算計它的用途時，產品的品質就會受到損害。但當使用得當，插畫是一個爲你的內容發聲的有利工具，並且關起你跟你的使用者之間的鴻溝，讓你們的溝通更為簡單同步，並且最終引導至更棒的使用者體驗。

如果這篇文章剛好對你有幫助，歡迎追蹤 Digital Sunday。在翻譯及文章裡有任何疑問跟建議，歡迎留言與我討論及分享喔。