用戶界面中的圖形元素應(yīng)用分析
——以生鮮平臺(tái)為例

□王 磊 華南農(nóng)業(yè)大學(xué)藝術(shù)學(xué)院

一個(gè)健康優(yōu)質(zhì)的生鮮電子商務(wù)平臺(tái)和好的用戶界面設(shè)計(jì)是溝通供需兩端的橋梁。人機(jī)交互技術(shù)的不斷發(fā)展使圖形能夠在用戶界面設(shè)計(jì)中發(fā)揮它的作用，界面設(shè)計(jì)師們也必須領(lǐng)會(huì)和了解用戶的心理需求，根據(jù)他們的操作習(xí)慣和要求來(lái)不斷地改進(jìn)設(shè)計(jì)思維，這樣才能給用戶呈現(xiàn)完美的視覺(jué)效果且突出界面設(shè)計(jì)，從而使用戶產(chǎn)生身臨其境的感覺(jué)。

一、市場(chǎng)現(xiàn)狀分析

由于網(wǎng)絡(luò)信息和智能化手機(jī)的飛速發(fā)展，各大商家都開(kāi)始把目光瞄準(zhǔn)線上銷售，除了淘寶、京東之外，越來(lái)越多的電商平臺(tái)壯大起來(lái)，隨之而來(lái)的競(jìng)爭(zhēng)也越發(fā)激烈。各大電商除了在原有規(guī)模的基礎(chǔ)上繼續(xù)占領(lǐng)市場(chǎng)外，也一直在尋找新的消費(fèi)者需求熱點(diǎn)，力爭(zhēng)先人一步獲得市場(chǎng)先機(jī)。健康生鮮食品類電子商務(wù)平臺(tái)發(fā)展時(shí)間并不算長(zhǎng)，已經(jīng)成為各大電商爭(zhēng)奪的下一個(gè)目標(biāo)。國(guó)內(nèi)知名電商除了1 號(hào)店，還有幾個(gè)較成熟的健康食品電子商務(wù)平臺(tái)，如本來(lái)生活、順豐優(yōu)選等。2017 年阿里巴巴籌備兩年多的盒馬鮮生從幕后走到臺(tái)前，這種既是超市又是餐飲店和菜市場(chǎng)的銷售模式，可以說(shuō)是生鮮平臺(tái)的重構(gòu)與整合，也代表了最新的零售業(yè)態(tài)。

二、生鮮平臺(tái)用戶界面圖形元素分析

（一）用戶界面圖標(biāo)設(shè)計(jì)分析

生鮮平臺(tái)在網(wǎng)頁(yè)界面設(shè)計(jì)和手機(jī)APP界面設(shè)計(jì)的定位上，將圖形符號(hào)作為網(wǎng)站的主要導(dǎo)航形態(tài)，以圖代替文字，整個(gè)頁(yè)面圖形化，集成網(wǎng)站的功能塊，盡量減少圖片占用太多的空間，把用戶的視線吸引到必要的圖形上，縮短用戶的選擇時(shí)間，給用戶帶來(lái)一種簡(jiǎn)單直觀、容易操作的心理。

圖標(biāo)是一個(gè)網(wǎng)站和APP 界面的標(biāo)志性符號(hào)，它代表了該企業(yè)的形象，因此，在設(shè)計(jì)時(shí)，設(shè)計(jì)師一定要突出企業(yè)和產(chǎn)品的特點(diǎn)。圖形符號(hào)的設(shè)計(jì)可以擬物化、精簡(jiǎn)化，這樣能給客戶帶來(lái)更強(qiáng)烈的視覺(jué)效果。對(duì)于消費(fèi)者而言，其看到手機(jī)界面首先要有一種歸屬感，這也需要設(shè)計(jì)師更加注重設(shè)計(jì)的品質(zhì)，這是使用戶產(chǎn)生共鳴的根本。設(shè)計(jì)師可以通過(guò)結(jié)構(gòu)和色彩贏得客戶的好感，如使用黃色、綠色來(lái)表現(xiàn)食物，是食品行業(yè)最常用的，也是生鮮企業(yè)的行業(yè)色之一。圖標(biāo)的整體風(fēng)格大多采用扁平化設(shè)計(jì)，它的最大特點(diǎn)就是去掉冗余的裝飾效果，盡可能不添加紋理和使用漸變手法，讓圖形本身的信息能夠凸現(xiàn)出來(lái)，保持圖形設(shè)計(jì)的極簡(jiǎn)和符號(hào)化特征。而且扁平化設(shè)計(jì)還可以減少圖形過(guò)多的設(shè)計(jì)，從而降低系統(tǒng)功耗，提高運(yùn)算速度。

（二）用戶界面圖形風(fēng)格分析

國(guó)內(nèi)幾個(gè)知名的生鮮類網(wǎng)購(gòu)平臺(tái)品牌，如1 號(hào)店、順豐優(yōu)選、本來(lái)生活、盒馬鮮生等，從其標(biāo)志形態(tài)來(lái)看，文字類圖形占有的比重比較大，這也是文字的優(yōu)勢(shì)，其既可以圖形化，又可以傳達(dá)信息。在網(wǎng)站用戶界面設(shè)計(jì)中，設(shè)計(jì)師可以通過(guò)對(duì)網(wǎng)站標(biāo)識(shí)的設(shè)計(jì)來(lái)對(duì)整體風(fēng)格定位，如圖形形態(tài)可以奠定網(wǎng)頁(yè)裝飾風(fēng)格，標(biāo)識(shí)色彩也可以作為整個(gè)網(wǎng)站的色彩來(lái)源。

從品牌圖形設(shè)計(jì)上看，1 號(hào)店是知名的電商企業(yè)，標(biāo)識(shí)醒目且被消費(fèi)者熟悉。在設(shè)計(jì)上，1 號(hào)店大大的“1”字形設(shè)計(jì)占據(jù)了整個(gè)標(biāo)志的主體，也是最為醒目的。紅色也是1 號(hào)店的主體顏色，另兩個(gè)字形設(shè)計(jì)也頗有特點(diǎn)，方圓搭配的處理較為合理，整體感比較強(qiáng)，而且還把網(wǎng)頁(yè)域名結(jié)合進(jìn)來(lái)，給用戶很直觀的感覺(jué)。這種設(shè)計(jì)比較有特點(diǎn)，如哥倫比亞國(guó)家旅游形象標(biāo)識(shí)設(shè)計(jì)就把國(guó)家域名“CO”作為了標(biāo)志圖形的一部分來(lái)展示；順豐優(yōu)選是順豐速運(yùn)旗下的一個(gè)網(wǎng)購(gòu)商城，在原有順豐標(biāo)志基礎(chǔ)之上設(shè)計(jì)了一款生鮮網(wǎng)購(gòu)專用LOGO，圖形簡(jiǎn)潔大方，在“SF”的形象上結(jié)合太陽(yáng)外形設(shè)計(jì)，陽(yáng)光的形象也比較符合該行業(yè)特點(diǎn)，象征著大自然的生機(jī)。在網(wǎng)頁(yè)界面設(shè)計(jì)上以色塊來(lái)區(qū)分不同區(qū)域，以紫紅色為底，色調(diào)整體上比較明快，中上部重要區(qū)域是滑動(dòng)圖片展示區(qū)，這樣可以更好地吸引用戶的視線，在視覺(jué)效果上也比較大氣。但是，界面左右兩端布滿了各類的廣告圖片，增加了該界面的復(fù)雜程度，破壞了整體效果，還有產(chǎn)品的文字信息比較累贅，不夠直觀簡(jiǎn)潔，忽略了符號(hào)的使用，其可以直接用評(píng)價(jià)人數(shù)和好評(píng)率數(shù)值代替，如京東的產(chǎn)品信息處理方式就很不錯(cuò)；本來(lái)生活的設(shè)計(jì)定位就比較有現(xiàn)代感，它的文字標(biāo)志設(shè)計(jì)非常容易辨識(shí)記憶，色彩搭配簡(jiǎn)潔明快，也突出了本來(lái)生活的文化理念，即回歸本有的自然情懷。其標(biāo)識(shí)顯示區(qū)域處理得非常干凈整潔，頁(yè)頭區(qū)域也是非常整齊有條理，整個(gè)界面布局相當(dāng)有層次感，簡(jiǎn)潔明了，沒(méi)有過(guò)多的色彩，只用綠色統(tǒng)一整個(gè)頁(yè)面，圖形感也比較強(qiáng)。

藝術(shù)是人類情感和想象的表達(dá)，也是人類知識(shí)、情感、意念的有機(jī)產(chǎn)物，更是人們現(xiàn)實(shí)生活和精神世界的形象表現(xiàn)。通過(guò)審美創(chuàng)造和情感表現(xiàn)，設(shè)計(jì)師讓界面設(shè)計(jì)更加突出藝術(shù)元素的美感，增強(qiáng)了界面的視覺(jué)表現(xiàn)力。用戶界面設(shè)計(jì)是藝術(shù)與技術(shù)相互結(jié)合的產(chǎn)品，圖形讓用戶能夠跨越地域、時(shí)間和空間而產(chǎn)生互動(dòng)，無(wú)論是動(dòng)態(tài)的還是靜態(tài)的方式，都使圖形信息的處理手法更加多樣化，從而適應(yīng)了當(dāng)今互聯(lián)網(wǎng)時(shí)代的發(fā)展。