設計沉思錄 | 插畫提升用戶體驗
編輯導語:我們應該都能感覺到,太多的文字看久了會比較疲勞,而且文字也不能完全的感受到想表達的情緒;這時候插畫就起到了很重要的作用,在使用某款軟件時,有趣可愛的插畫會讓你的等待時間不再焦躁;本文作者分析了關于插畫如何提升用戶體驗,我們一起來看一下。
如今互聯(lián)網產品設計越來越精美,如何標新立異,使自己的產品在設計上能夠與其他產品形成差異化呢?
想要提升用戶體驗,首先要引起用戶的注意,那么將表現(xiàn)形式豐富的插畫運用在APP及運營設計當中,自然成為很好的方式。
自從IOS 11開始,App Store中就使用了很多的插畫,增加使用場景,給用戶帶來了全新的體驗,可見大量采用插畫表現(xiàn)已是近些年互聯(lián)網產品的整體狀態(tài);因為相較于文字,人類本能的更喜歡看畫,繪畫不僅表現(xiàn)形式豐富,有時還有“一圖勝千言”的作用。
插畫運用到產品設計中也有很豐富的表現(xiàn)形式,常見有扁平、肌理、描邊、手繪、立體等等風格;應用場景也從運營活動、H5、banner設計,到新手引導、開屏、功能介紹、icon、缺省頁、logo等等,可以說覆蓋了到了產品設計的各個方面。
那么插畫是怎樣提升用戶體驗的呢?
具體可以從信息傳達和情感表達兩部分體現(xiàn):
一、信息傳達
1. 承載更多信息,更直觀
58房產今年的春運活動中的游戲任務是集齊卡片,這套卡片不僅是游戲的道具,還展示了房產現(xiàn)有的品牌和特色功能。
這些產品介紹如果只是文字的描述就很蒼白無趣,但通過插畫的使用,生動直接的體現(xiàn)了每個業(yè)務的特點;并描繪出用戶的體驗場景,展示了我們的服務,同時讓我們的業(yè)務和品牌在游戲娛樂中得以傳播。
游戲卡片設計
2. 降低理解成本,提高信息傳達效率
這是租房頻道中視頻看房的拍攝引導動畫,通過扁平插畫和動效的結合,直觀地演示了幾個拍攝技巧;這種通俗易懂的方式降低了學習成本,對比文字或真人教學無趣枯燥的形式,小動畫的出現(xiàn)無疑是更吸引人的。
新手引導
3. 激發(fā)想象力
這兩幅分別是前幾年趕集APP在端午節(jié)和教師節(jié)的開屏畫面,當時趕集網的產品核心是增強社交屬性,突出人與人之間的關系。
所以在創(chuàng)作時就構思了相應的故事場景,和很多開屏設計只是節(jié)日元素堆砌形成差異化;且這種故事性的插畫能夠激發(fā)用戶的想象力,讓人結合自身展開聯(lián)想,更有參與感。
開屏設計
二、情感表達
1. 降低不良情緒
插畫在app中最常用的使用場景之一就是缺省圖,通過幽默或者溫馨的小圖,有時舒緩了一些尷尬的情況,有時也起到了提醒作用,降低了用戶可能會出現(xiàn)的不良情緒;甚至增加了些許溫暖,也為產品增色。
這些是為房產頻道探索設計的2.5D風格的缺省圖:
缺省頁設計
2. 滿足對未知的探求,好奇心
這張圖曾出現(xiàn)在趕集APP首屏廣告位中,是當時半年內點擊數據第一名的banner。
這張文案和插畫相得益彰的banner,能在30多個banner中脫穎而出,說明了其足夠吸引人,激發(fā)了用戶的好奇心去點擊。
Banner設計
3. 增加氣氛
在APP中,更換皮膚是增加節(jié)日或者活動氣氛最直接的方式了。
這是商業(yè)地產近期的運營活動——辦公季的金剛位icon設計,活動需要穩(wěn)重中帶有優(yōu)惠的氣質;所以結合產品特點,設計了十棟造型不同的辦公大樓,加以動感的氣球和彩帶裝飾點綴,整體氣氛油然而生。
皮膚設計
4. 增加趣味性
插畫在運營活動中的應用就更加廣泛了,這是18年房產春運活動中的游戲頁面,采用當年的生肖狗作為游戲的主人公:狗哥帶著金鏈子,叼著雪茄——這樣一個形象就代表了平臺,給用戶傳達出我們有錢有獎要送的信息。
用戶在參與游戲,猛戳按鈕的時候,看到倒計時,刺激性的提示語,小狗幽默搞笑的表情和動作,聽到歡樂的狗叫聲;就會產生濃厚的興趣、緊迫感和想要點擊的沖動,進而刺激參與活動,并持續(xù)玩下去。
活動期間,這個游戲很受歡迎,整個活動的最終效果也不錯。
運營活動設計
5. 增加美感
作為繪畫藝術的應用,插畫最重要的價值自然還有增加美感,讓人賞心悅目;用戶在使用產品的同時,美麗的插畫能使人放松下來,精神愉悅。
產品設計如果能夠多維度的滿足用戶,讓用戶流連忘返,不正是我們設計師的追求嗎?
三、總結
通過一系列案例可以看出,插畫在產品設計中的應用不僅可以傳達信息,還能表達情感,是非常豐富且實用的表現(xiàn)形式。
它就像是連接產品與用戶之間的橋梁,通過插畫不同的表現(xiàn)形式可以欣賞到一路不同的風景,傳達不同的信息和情感;豐滿了產品的同時也愉悅的用戶,用戶體驗自然得到提升。
本文來源于人人都是產品經理合作媒體@58用戶體驗設計中心(微信公眾號@58UXD)
題圖來自Unsplash,基于CC0協(xié)議
- 目前還沒評論,等你發(fā)揮!