圖片簡化設計在B2C移動端網頁的應用

王艷

摘 要：B2C移動端業(yè)務在迎來發(fā)展窗口期的同時也面臨著用戶體驗優(yōu)化的難題。網頁設計是影響B(tài)2C客戶體驗的重要因素，而圖片則是網頁設計的重要載體。文章基于圖片優(yōu)勢效應，討論圖片簡化設計在B2C移動端網頁的應用，并從實證角度驗證和分析圖片簡化設計模型的有效性和實用性。

關鍵詞：圖片簡化設計;網頁設計;圖片優(yōu)勢效應

隨著網絡技術的不斷發(fā)展和智能手機的普及，網絡購物的受眾已經從愛新奇事物的年輕人走向廣泛的大眾，逐漸成為人們經濟生活的重要組成部分。值得注意的是，電子商務板塊的經濟規(guī)模占比超過60%，成為了互聯網經濟發(fā)展的中堅力量。智能手機和無線網絡不斷普及，幾乎完全占據了老式功能機市場，另外移動端碎片化的特點及更加符合消費場景化的特性使用戶不斷向移動端轉移。B2C是Business-to-Customer的縮寫，是商家對個體消費者的電子商務模式，也就是通常說的直接面向消費者銷售產品和服務商業(yè)零售模式。在B2C移動購物方面，移動端市場不論是在體量，還是營收貢獻上都占有絕對優(yōu)勢。隨著大量客戶涌入移動端購物潮流，研究與網絡購物息息相關的購物網頁設計就愈發(fā)重要。網頁設計不僅具有媒體的能力，還具有可用性和時尚的外觀，網頁設計的好壞直接決定了用戶在網站上的停留時間和用戶流量，繼而影響店鋪的營收。

圖片是網頁設計中的重要組成部分，對于購物網站，大部分用戶會直接看圖片來制定購買決策，研究圖片在網頁設計的應用是很有意義的。圖片在網頁設計中的優(yōu)勢集中表現在提升信息的傳達效率和客戶滿意度兩個維度，一方面圖片元素的設計彈性較大，在與網頁設計的其他元素符號的融合上具有高度可控的協(xié)調性，有利于完善網頁設計的總體表達;另一方面，用戶對圖片信息的接受度與記憶度較單純的文字信息要高，圖片能夠使讀者更為高效地獲取信息進而提升用戶體驗。簡化設計的意義就在于將設計對象從具象化的趨勢中置換出來，以人性化感知為中心，摒棄束縛與累贅，還原設計的初衷，使用戶從最簡約的信息中獲得最有價值的內容。以宜家、無印良品為代表的簡約風近年來越來越受追捧，而研究同樣表明，極簡主義在扁平化風格網頁設計中的應用是重要的趨勢性現象。

圖片作為網頁設計中的重要設計元素，囊括著信息傳達和客戶滿意度建設等功能，圖片設計的質量保證是網頁設計中的重要環(huán)節(jié)。圖片在網頁中的內容設計，也需要借鑒和利用簡化設計的理念，在設計簡化與信息完整兩個維度之間尋求有效平衡，達到信息的高效傳播與客戶滿意度提升雙贏的效果。本文在圖片優(yōu)勢效應的基礎上，研究圖片簡化設計在B2C移動端網頁中的應用，分析總結如何恰當簡化圖片設計以改善移動端購物的用戶體驗。

一、圖片優(yōu)勢效應

圖片優(yōu)勢效應是指相對于文字記憶，人們在記憶圖片信息的時候多了形象記憶，從而提高了記憶效率。人們在圖片記憶過程中對于語義的參與層次是深度的，大多數人更傾向于對圖片信息的記憶。網頁設計中，同樣可以發(fā)揮圖片優(yōu)勢效應，對于圖片優(yōu)勢效應的分析和把握能給網頁設計師提供理論基礎和設計參考。研究表明，圖片優(yōu)勢效應主要包括三個方面。

（一）視覺優(yōu)勢

視覺是人們獲取信息的主要方式，而網頁設計最主要的信息傳達路徑就是用戶視覺，即將圖片、文字、模型、符號等信息元素的組合通過用戶的視覺感知傳達至用戶并形成顧客感知，這就對網頁設計在適應用戶視覺需求方面提出了要求。圖片設計的重要性體現在其大小、位置、數量、排版、配色等因素都可以對網頁的整體視覺傳達形成直接影響。圖片設計的空間很大，限制較少，能夠靈活地搭配網頁中的其他文字、符號等要素，形成統(tǒng)一、連貫、分割、對比與和諧的效果。網購平臺的優(yōu)勢在于通過互聯網可以給人們呈現各種各樣的商品，相比于過去網速欠發(fā)達的年代，圖片的使用要盡量使用小于100kb，如今，網速不再是制約網頁設計中圖片的因素，在網頁設計中可以使用較多的高清圖來作為商品宣傳。許多在天貓上較為知名的服裝品牌都將大幅的圖片作為網頁的背景，在打開店鋪的一瞬間，給人很強的視覺沖擊，營造出一種品牌價值不菲的感覺，讓消費者心甘情愿地為品牌溢價買單。

（二）認知優(yōu)勢

圖片與文字信息的結合設計一定程度上可以提升網頁信息的可讀性，幫助人們理解和獲取重要信息。在購物品臺上，琳瑯滿目的商品在打開網頁的瞬間呈現在用戶的眼前，此時用戶需要通過一種方式更加直觀、生動、快速地獲得他們想要的信息，但這種方法通過文字是很難做到的。在移動端購物的用戶有很大部分文化水平較低，太多的文字描述很快就會讓他們失去了解商品的興趣。圖片也減少了有閱讀文字障礙的人瀏覽網頁時所遇到的困難，即使用戶不會識字或者是老人因視覺衰退在閱讀文字上有障礙，他們也能夠通過圖片很直觀地了解商品的信息。較多的圖片宣傳更有效率地傳遞了商品信息，使得用戶在相同時間內可以瀏覽更多的商品，能有效提高購買率。

（三）商業(yè)優(yōu)勢

商業(yè)推廣的重要途徑是廣告營銷，而圖片則是廣告的重要載體。圖片元素是B2C網站網頁設計中的重要元素，甚至是核心要素。圖片的質量對于消費者選擇和購買產品效果的影響是顯著的，圖片的定位已經從網站競爭的一般宣傳媒介上升到企業(yè)營銷的核心層面。這種營銷戰(zhàn)略地位的變化促進了以圖片為主元素的B2C網站的快速發(fā)展。研究顯示，在類似于B2C網站的網絡交互設計中， 綜合圖片視覺元素，給予人直觀的視覺體驗，可以將信息更好地進行傳播。

總的來說，網頁設計中的圖片優(yōu)勢效應集中體現在，圖片元素在網絡交互過程中帶給用戶良好視覺體驗的同時將信息最大限度地傳達。網頁設計實操中可以通過研究信息之間的內生邏輯，結合專業(yè)、個性的可視化表達語言技巧，將數據、信息和圖形元素有機整合，提升網絡交互中的傳播效率和傳播效果，也有利于形成客戶粘性。圖片優(yōu)勢效應的發(fā)揮需要充分結合網頁設計的邏輯，本研究基于圖片優(yōu)勢效應理論和圖片簡化設計理念進一步討論B2C移動端圖片設計的方法。

二、圖片簡化設計模型

當今時代視覺信息泛濫往往使人們產生視覺疲勞，圖片簡化設計是消費者對于心理和生理上的必然追求。圖片簡化設計意味著將平靜和思想帶回本真，本文基于圖片優(yōu)勢效應理論，綜合學者對于圖片在網頁設計中的應用研究成果，認為圖片簡化設計可以通過三個路徑實現圖片優(yōu)勢效應。

圖片簡化設計包括構成元素、色彩以及排版三個方面的簡化，其內涵解釋如下：

（一）圖片構成元素的簡化

這主要指圖片設計過程中精簡元素構成，圖形、符號等元素以扁平化、簡單化為主，避免立體、多邊角等圖形構成。這種設計理念需要保證圖標具有可用性的同時，盡可能簡單。

（二）圖片排版的簡化

這主要指考慮到文字元素的美化程度一定程度上會違背圖片簡化設計的初衷和原則，因此文字元素的字體、大小、位置和顏色等要點的設計需要秉持簡潔、大方的理念，同時契合網頁整體的風格，盡可能減少如圖片旋轉、排列等網頁版面特殊的表現形式。

（三）圖片色彩的簡化

這主要指網頁設計中，圖片元素的色彩、明度、亮度、對比度、飽和度等指標盡可能協(xié)調和統(tǒng)一，多以單一色彩填充，盡可能符合消費者的視覺規(guī)律和最精簡的大眾審美。

總結而言，圖片簡化設計就是通過構成元素、排版、色彩等要素的簡化手段盡可能減少與宣傳理念無關聯的內容，將圖片有機融于網頁整體設計中，配合網頁構筑良好的信息展示架構，優(yōu)化用戶與網頁的交互模式。在網頁設計中發(fā)揮圖片優(yōu)勢效應，即通過發(fā)揮圖片的視覺優(yōu)勢提升顧客的感知體驗，通過發(fā)揮圖片的認知優(yōu)勢提升信息的傳達效率，以及通過發(fā)揮圖片的商業(yè)優(yōu)勢提升網頁整體設計的投入-產出效率。

三、實證研究與結論

為準確界定圖片簡化設計在B2C移動端網頁中的應用效果，本研究選取天貓超市移動端網站作為樣本，基于武漢地區(qū)的大學社區(qū)隨機選取和訪問100位天貓超市用戶。測試中，讓訪問者瀏覽并使用三種版式的天貓超市移動端網頁的首頁后，基于不同的問題憑著第一印象對該網站首頁進行打分。實驗從圖片的元素、色彩和排版三個角度來研究網頁設計中圖片元素對用戶的網站使用體驗的影響。結合圖片構成元素、色彩以及排版三個維度，圖形、圖標、純色、飽和度、字體、雜志化等特征，將三種網頁版式特征分別概括為：圖片構成元素簡化，色彩和排版較為復雜;圖片色彩簡化，構成元素和排版較為復雜;圖片排版簡化，構成元素和色彩較為復雜。在用戶瀏覽完網頁后，基于感知印象對網頁設計的相關問題進行打分。采用Likert五級量表，用戶從0～5對網頁的幾個問題進行了打分，分值越高，反映的用戶體驗越好，通過對100位用戶的訪問數據分析，得到圖1（所示數據為100位訪問者打分的均值），三個版式的用戶體驗得分總值分別為21.07、20.64和20.76。

基于圖1和前述理論分析，研究發(fā)現：用戶在瀏覽完三種不同的網頁后的直觀反饋與網頁設計的初衷偏向保持了高度的吻合。以版式2為例，純色應用和高飽和度的得分均值明顯領先于其他兩個版式，而這兩個指標所對應的圖片構成元素維度正是版式2所偏向的簡化部分，這一結果一定程度上驗證了圖片簡化設計概念模型的有效性和合理性。三種版式中，用戶體驗得分總值最高的是版式1，并且明顯高于其他兩個版式的得分。版式1的特征即為重圖片構成元素簡化，包括構成圖形簡化和構成圖標簡化，反映的是在圖片簡化設計路徑模型中，圖片構成元素簡化路徑較色彩簡化路徑和排版簡化路徑效率更高，獲得用戶反饋最好。這一結論可以指導網頁設計師尤其是網頁圖片設計師在考量圖片簡化設計時的偏向，建議偏重構成元素簡化。

參考文獻：

[1]翟健茹.圖片優(yōu)勢效應在網頁設計中的研究與應用[J].美術教育研究，2016（21）：63.

[3]徐超.探究簡約主義的網頁設計[D].上海師范大學，2012.

作者單位：

中南民族大學美術學院