手繪插畫的情感化在產品網頁設計中的應用

閆青青

（河南科技學院，河南 新鄉 453000）

在數字時代的背景下，產品網頁設計質量的評判標準隨之擴大，即在原有功能實用與視覺美感的基礎上，新添了情感、文化等精神層面的指標要素。如何設計功能強大且能夠滿足用戶精神需求的產品網頁設計，又該如何促使產品網頁視覺元素與受眾情感需求形成聯動呼應，是當前產品網頁設計需要解決的現實課題。手繪插畫的情感化為產品網頁設計提供了方法論，借助兼具情感性與美觀性的手繪插畫，并以情感化與邏輯性的架構方法使之融入產品網頁界面，進而為產品網頁設計情感化表達所服務，有助于構建差異化的產品網頁，讓用戶獲得情感上的滿足。因此，應當重視手繪插畫的情感化在產品網頁設計中的應用。

一、手繪插畫的情感化在產品網頁設計中的實踐定位

（一）審美層面：激發產品網頁用戶的視覺審美愉悅

審美是視覺認知的一種過程，視覺認知是用戶接受外部信息與出發情感反應的橋梁。對于產品網頁設計而言，注入新鮮的設計元素，滿足用戶對網頁界面審美層面的視覺期待，提升用戶的網頁審美體驗，這是產品網頁設計的基礎與前提。從產品網頁界面的本能審美來看，手繪插畫的情感化在表現技法上是自由的、無束縛、無邊界的，在表現內容是充滿天馬星空想象力以及多元情感渲染力的，其設計靈感既可以源于民間故事、歷史人物、傳統節日，也可以源于所處社會生活、產品創意場景，能夠把諸多元素齊聚一堂展現，構建出兼具情感感染力與視覺沖擊力的界面元素，進而促使產品網頁設計與用戶形成審美共通感，營造舒適別致的視覺體驗。比如，對于一款成熟的產品網頁設計，肯定少不了主題風格多變、賞心悅目的登錄頁設計，這既是建立品牌形象的重要媒介，也是體現對用戶重視程度的表達方式。因此，這就需要提升登錄網頁界面設計的可觀賞性與趣味性，使產品網頁設計與用戶之間對話更具儀式感與人情味。手繪插畫的情感化則是一個絕佳的選擇，無論是視覺表現層面還是深層情感化設計層面，手繪插畫的情感化可以深切體察用戶的審美需求，以產品調性、節日活動等為主題進行內容創造，借助手繪插畫優美的構圖形式與色彩語言，能夠打造出具有情感主題的精致有趣畫面，從而在貼近用戶情感化需求的基礎上，滿足用戶的視覺審美需求。[1]

（二）交互層面：滿足產品網頁設計的情感化交互需求

交互設計是產品網頁設計不可或缺的環節，主要指的是功能與形式的交互，對于提升用戶黏性、產品營銷具有重要現實意義。其中功能交互主要指的是視覺上的引導，通過對網頁設計中的導航欄、鏈接、Logo 等元素進行交互設計，以讓用戶識別產品網頁設計的屬性、重點，區分產品網頁設計信息的主次順序，體現出網頁設計的實用價值。形式交互是功能交互的拓展與延伸，包括功能交互中所涉及到的導航欄等元素交互設計，也包括產品網頁界面的裝飾設計，以完成交互體驗行為過程。在產品網頁交互設計中，手繪插畫的情感化可應用到產品網頁設計全過程，富有趣味與裝飾性的手繪插畫圖案，適用于網站標題、按鈕、鏈接等網頁界面交互設計中，能夠達到意想不到的藝術效果，滿足用戶與產品網頁設計互動的行為需求，使網站更加具有活潑性與親和力。[2]比如，在產品網頁內結果通知這一界面設計中，結合成功、失敗的網頁結果反饋，可以設計出不同情感氛圍的們可愛風格手繪插畫內容，來傳達產品網頁反饋消息。這樣一來，通過對于不同氛圍場景的插畫內容，緩解了單純文字帶來的枯燥氛圍，讓用戶有更好的參與感與帶入感，進而提升二者之間的交互性。

（三）人文層面：體現對產品網頁用戶的人性化關懷

一個優秀的產品網頁設計，不應當僅局限于視覺層面的美學建構與行為層面的交互設計，還應當涉及人文層面的情感與價值關懷，體現產品網頁設計對用戶人格、愛好等尊重與關懷。因而，在當前的產品網頁設計過程中，既要重視商業邏輯與產品網頁之間關系的理性架構，也要打造與呈現產品網站社會人文價值，著眼于長遠的文化性發展戰略實施，促使產品網頁設計更具藝術魅力。手繪插畫的情感化，是社會文化與歷史文化的藝術沉淀，能夠將社會主流價值觀文化、品牌文化、用戶情感需求等元素糅合到一起，形成多元文化主導的創意插畫內容，不但能夠體現產品網頁設計對人文精神的創意與表現，詮釋產品網頁設計自身文化內涵以及對用戶的人文關懷，情感化的手繪插畫內容滿足了人們對于文化的現實訴求，同時也能夠將產品網頁設計高度提升到社會發展、人類發展的高度。

二、手繪插畫的情感化在產品網頁設計中的應用問題

（一）重情感構建輕情感認同

作為意識的基本形式之一，情感主要指的是人對客觀事物的態度。在產品網頁設計中手繪插畫的情感化，情感認同是其主要目標，只有讓消費者對產品網頁形成情感認同，才能發揮情感的積極作用，即促使消費者對產品網頁內容產生肯定、滿意的態度，提升產品網頁設計的說服度與可靠性。因此，既要注重手繪插畫的情感化構建，也要努力實現情感化認同，進而運用情感認同的選擇、驅動、矯正等作用，消除消費者在瀏覽產品網頁中的不良情緒，提升對產品網頁設計的好感。在當前產品網頁設計中，部分手繪插畫的情感化雖然得以表現，且個性化與創意感十足，但仍舊停留于簡單的視覺層面，往往以設計師天馬星空的想象進行創意設計，未能夠深入分析與順應產品網頁設計受眾的情感憧憬，難以在產品網頁受眾情感選擇中形成情感共識，從而使得手繪插畫的情感化趨于形式化、標識化。比如，在建筑施工產品網頁設計中，部分網頁設計師會選擇一些可愛的動畫人物進行手繪插畫內容設計，輔助產品網頁內容信息表達。這樣的設計雖然能夠構建出輕松歡快的網頁環境氣氛，但是與建筑施工產品網頁受眾情感訴求形成了對比性差異，不利于產品網頁設計的主題表達。[3]

（二）重情感傳遞輕情感視覺

產品網頁設計中手繪插畫的情感化如同網頁的靈魂，能夠通過生動有趣的插畫內容，將產品文化、產品歷史等元素進行創意化展現，傳遞產品的文化價值觀念與積極情感。隨著現代視覺藝術設計的發展，手繪插畫創作的內容、方法、思路日趨多元化，其在內容上可以選擇影視動畫人物造型、山水畫，也可以結合插畫設計方法打造個性化的專屬插畫內容，在形式上可以引入解構主義、新中式風格、幾何美學等，這為手繪插畫的情感化發展注入了新的素材與方法論。然而，在當前產品網頁設計中手繪插畫的情感化，往往呈現出重情感傳遞輕情感視覺的問題，具體表現為手繪插畫的情感化多為他人藝術作品的再設計再創作，是在他人創作作品基礎上注入情感元素的情感化，關于與產品歷史、文化相結合的情感化手繪插畫內容相對較少。這樣的設計雖然能夠表達手繪插畫的情感化主題，但是卻少了靈魂與核心。

（三）重情感表達輕情感體驗

產品網頁設計的商業屬性，要求手繪插畫的情感化應當以用戶為中心，圍繞產品目標消費群體的審美偏好與性格特征，作出順應性的情感環境營造，構建讓目標消費群體感覺舒適、認可的購物情感體驗。因而，產品網頁設計中手繪插畫的情感化應當結合產品的主題情感氛圍，在滿足產品目標消費者群體情感需求基礎上，注重個性化、創意化的情感體驗氛圍營造。手繪插畫的情感化在于協同而非分離，在產品網頁設計中，手繪插畫的情感化往往會因為只注重插畫內容本身的情感表達，而忽略與產品網頁設計主題氛圍的契合，進而致使同一個產品網頁設計中，出現兩個、三個甚至更多的情感主題，造成產品網頁與手繪插畫出現情感主題不一致的問題。此外，也存在手繪插畫應用不科學、不合理的現象，與產品網頁設計在結構上形成矛盾。這樣的設計方式大大削減了手繪插畫情感化的價值與作用，容易給消費者帶來雜論無章、不知所云的情感體驗。

三、手繪插畫的情感化在產品網頁設計中的發展方向

（一）以產品網頁受眾為中心提升手繪插畫的情感認同

產品網頁受眾是產品網頁設計的主要服務對象，也是手繪插畫情感化的重點面向人群。在產品網頁設計中，手繪插畫的情感化設計要以產品網頁受眾為中心，注重建立情感認同，促使手繪插畫、產品網頁以及用戶之間形成情感共鳴。一方面，要注重用戶需求的情感化認同。手繪插畫的情感化設計要緊密貼合產品網頁受眾的視覺與心理訴求，了解與掌握驅動他們來瀏覽產品網頁設計的動機與意圖，并分析產品網頁受眾的審美風格特征，以實現手繪插畫的情感化，滿足產品網頁受眾的情感需求。比如，在嬰幼兒產品網頁設計中，要選擇那些溫暖、可愛、幸福的插畫內容作為網頁裝飾，滿足產品網頁瀏覽者對產品網頁的情感期待。另一方面，結合產品網頁情感化設計的三個維度，即行為、視覺與人文，以情感化順應為主題對手繪插畫內容進行創意設計，以促進產品網頁情感共鳴，讓產品網頁受眾感受到無形的體貼。[4]

（二）以產品文化為導向打造手繪插畫情感視覺元素

手繪插畫的情感化，能夠商業元素、文化元素、情感元素糅合到手繪插畫的視覺界面中，并使之轉換為強烈的情感體驗，構建出滿足個人的行為體驗和心理需求的網頁設計。因此，在這個創意為主的藝術設計發展背景下，應當以個性化、創意化的手繪插畫內容來輔助產品網頁設計的情感表達，實現情感的視覺化。具體而言，產品文化、產品歷史、產品情感等元素蘊含著企業的價值觀、品牌文化，是構建產品品牌形象的關鍵要素，也是實現手繪插畫情感化的重要素材庫。手繪插畫的情感化，應當以現代視覺傳達藝術為設計手法，以產品文化為導向進行手繪插畫設計，對產品情感、產品文化等進行重構與變形，并利用手繪插畫中的色彩、圖形元素進行情感表達，以此來構建具有產品品牌代表性與情感性的手繪插畫內容。例如，在體育運動飲料產品網頁設計中，可以以產品中蘊藏的健康、運動、陽光等情感要素為情感主題，結合產品品牌形象進行IP 化手繪插畫內容設計，并將其運用到產品詳情頁、背景圖片、搜索框等中，來構建專屬產品的情感氛圍。

（三）以整體性為導向創造產品網頁設計的情感體驗

情感體驗是手繪插畫情感化的內部驅動力，也是當代產品網頁設計的重要方向。要積極發揮手繪插畫的情感體驗作品，并使之與產品網頁設計情感化表達協同共生，進而構建主題一致、氛圍濃厚的產品網頁情感化場景。[5]手繪插畫的情感化要與產品網頁設計情感主題一致。手繪插畫的情感化應當以整體性為導向，對產品網頁設計情感化主題作出順應，避免出現多個情感主題、主題不一致等情況產生。比如，在以圣誕節為主的電商網頁設計中，手繪插畫內容也應當與圣誕節為主題進行創作，共同構建出一種身臨其境的情感氛圍。另一方面，也要合理安排手繪插畫的合理布局。結合現代平面設計美學語言，與整個網頁的視覺效果統一，盡避免手繪插畫過大或過小、避免手繪插畫出現在過于顯眼或者隱蔽位置，以不斷加強整體網頁版面的美觀程度與協調度。