嚴(yán)甜甜?。ㄠ嵵葺p工業(yè)學(xué)院　450000）

?

移動(dòng)互聯(lián)網(wǎng)產(chǎn)品界面的視覺設(shè)計(jì)探析

嚴(yán)甜甜（鄭州輕工業(yè)學(xué)院450000）

摘要：移動(dòng)互聯(lián)網(wǎng)產(chǎn)品界面的視覺設(shè)計(jì)是一門跨專業(yè)的綜合學(xué)科，它包含了諸如美學(xué)、心理學(xué)、人體工程學(xué)、計(jì)算機(jī)科學(xué)、社會(huì)學(xué)等多學(xué)科內(nèi)容。界面設(shè)計(jì)始終貫穿于用戶需求研究、新產(chǎn)品投放市場、產(chǎn)品周期化迭代的整個(gè)過程。本文分析了移動(dòng)互聯(lián)網(wǎng)產(chǎn)品產(chǎn)生的時(shí)代背景及界面視覺設(shè)計(jì)的重要性，從美學(xué)和用戶體驗(yàn)的角度探討了應(yīng)然的界面設(shè)計(jì)，最后總結(jié)了移動(dòng)互聯(lián)網(wǎng)軟件產(chǎn)品界面視覺設(shè)計(jì)的要點(diǎn)。

關(guān)鍵詞：移動(dòng)互聯(lián)網(wǎng)；產(chǎn)品界面；視覺設(shè)計(jì)

移動(dòng)通信技術(shù)和互聯(lián)網(wǎng)技術(shù)成為當(dāng)下科技領(lǐng)域中發(fā)展最為迅猛的兩大信息產(chǎn)業(yè)。在這樣一個(gè)科技背景下，移動(dòng)互聯(lián)網(wǎng)兼具移動(dòng)通信的便攜性和互聯(lián)網(wǎng)的即時(shí)快捷性，為廣大用戶提供了更為高效便捷的信息交互平臺；移動(dòng)互聯(lián)網(wǎng)產(chǎn)品在智能手機(jī)上的應(yīng)用，深刻影響著人們衣食住行的各個(gè)方面。

移動(dòng)互聯(lián)網(wǎng)產(chǎn)品的界面作為用戶體驗(yàn)的最直接內(nèi)容，是產(chǎn)品設(shè)計(jì)理念和使用功能的重要體現(xiàn)，界面視覺設(shè)計(jì)是移動(dòng)互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)中應(yīng)關(guān)注的核心問題之一。

一、界面視覺設(shè)計(jì)的美學(xué)

用戶對應(yīng)用界面視覺美的體驗(yàn)是多維度而全方位的，正如約翰·杜威（John Dewey）將審美視作一種整體性、完整性和豐富性的體驗(yàn)過程。移動(dòng)互聯(lián)網(wǎng)應(yīng)用的界面設(shè)計(jì)美學(xué)就是設(shè)計(jì)人與界面的關(guān)系，界面視覺設(shè)計(jì)要滿足用戶需求，要選擇有效的被受眾理解和快速被受眾接受的表達(dá)方式，喚起用戶情感體驗(yàn)和自我認(rèn)同的作用。

審美活動(dòng)是感性的，因此審美過程具有從感官刺激到精神升華的過程。界面視覺的美感體驗(yàn)與用戶對產(chǎn)品的認(rèn)知過程是分不開的，移動(dòng)互聯(lián)網(wǎng)應(yīng)用界面的視覺審美過程，主要表現(xiàn)為愉悅的感官體驗(yàn)、流暢的操作體驗(yàn)、使用時(shí)的樂趣以及情感的喚起，其中的美包含人與界面的無障礙溝通、用戶需求與界面設(shè)計(jì)的協(xié)調(diào)、良好的認(rèn)知及情感化體驗(yàn)。主要體現(xiàn)在界面的視覺吸引力和趣味性以及遵循用戶對界面視覺的心理預(yù)期，使產(chǎn)品界面的視覺效果不僅能夠吸引用戶，還能符合用戶的心理模型、體現(xiàn)人性化的關(guān)懷。

二、用戶體驗(yàn)與界面視覺設(shè)計(jì)

用戶需求決定了產(chǎn)品的定位以及產(chǎn)品設(shè)計(jì)的目的和理念，而界面的視覺設(shè)計(jì)會(huì)直接作用用戶體驗(yàn)的結(jié)果，因此界面的視覺設(shè)計(jì)應(yīng)遵循產(chǎn)品的體驗(yàn)規(guī)律，以用戶需求為中心來指導(dǎo)設(shè)計(jì)活動(dòng)。產(chǎn)品體驗(yàn)分為感知體驗(yàn)、理解體驗(yàn)和情感體驗(yàn)三個(gè)層次，這與馬斯洛關(guān)于人的需求理論是相對應(yīng)的遞進(jìn)關(guān)系。感知體驗(yàn)是用戶使用產(chǎn)品界面的直觀感受，對界面的結(jié)構(gòu)、形狀、質(zhì)感、色感、尺寸感等，是對物感特征進(jìn)行的一種反應(yīng)；理解體驗(yàn)是用戶在操作應(yīng)用時(shí)對產(chǎn)品整體的認(rèn)知理解，滿足用戶對視覺界面的心理預(yù)期；情感體驗(yàn)更多的是產(chǎn)品對人性化關(guān)懷的體現(xiàn)，是用戶在使用過程中所產(chǎn)生的一系列情感因素。情感體驗(yàn)是用戶體驗(yàn)的最高環(huán)節(jié)，德國青蛙設(shè)計(jì)公司（Frog Design）就曾提出形式跟隨情感的設(shè)計(jì)理念。情感化設(shè)計(jì)是“設(shè)計(jì)師在創(chuàng)作產(chǎn)品的過程中通過分析用戶群體的情感，結(jié)合自身的情感體驗(yàn)，將人內(nèi)心的情感需求和精神需求真正融入到設(shè)計(jì)中，并使群體用戶能在使用產(chǎn)品的過程中感受到快樂和感動(dòng)”。

三、移動(dòng)互聯(lián)網(wǎng)軟件產(chǎn)品界面視覺設(shè)計(jì)的要點(diǎn)

1.視覺設(shè)計(jì)風(fēng)格要與產(chǎn)品內(nèi)容統(tǒng)一

移動(dòng)互聯(lián)網(wǎng)軟件產(chǎn)品的界面視覺設(shè)計(jì)風(fēng)格要同產(chǎn)品內(nèi)容相統(tǒng)一。形式服務(wù)于功能，實(shí)現(xiàn)產(chǎn)品的使用功能是首先需要考慮的，而界面的視覺設(shè)計(jì)本身也具有實(shí)現(xiàn)交互的使用功能。因此視覺設(shè)計(jì)不能單純追求形式上的特異，應(yīng)依據(jù)產(chǎn)品定位和目標(biāo)用戶的需求，找準(zhǔn)視覺風(fēng)格并確定設(shè)計(jì)標(biāo)準(zhǔn)，使用戶能夠快速地從視覺上理解產(chǎn)品的理念、功能和操作流程。

2.圖形語言兼具良好的隱喻性與識別性

界面的視覺設(shè)是通過視覺符號來傳達(dá)信息，隱喻修辭方式在圖形界面設(shè)計(jì)中能簡化一些操作過程，用戶更易于通過恰當(dāng)?shù)碾[喻圖形符號迅速的了解圖形視覺元素所表達(dá)的含義，促成用戶與產(chǎn)品界面良好的互動(dòng)。因?yàn)榻缑嬉曈X中隱喻修辭方式的運(yùn)用是基于用戶群以往生活經(jīng)驗(yàn)和習(xí)慣，可以減少用戶操作時(shí)的學(xué)習(xí)成本、更便于用戶理解和記憶界面圖形符號的含義。

3.明確界面的視覺層級關(guān)系

產(chǎn)品界面設(shè)計(jì)需要通過視覺的形式區(qū)分不同的信息內(nèi)容以及主次模塊，與此同時(shí)還需要保證同類信息與操作在視覺上的一致性?？梢圆扇^(qū)域劃分、間隔劃分、色彩劃分、形態(tài)符號劃分、頁面層級劃分等方法，區(qū)分信息的同時(shí)也揭示視覺信息間的內(nèi)在聯(lián)系，幫助用戶理解、記憶，使用戶在使用應(yīng)用時(shí)能直觀了解到界面的層次、快速尋找到所需要的信息。

4.遵循不同移動(dòng)系統(tǒng)平臺布局特點(diǎn)

移動(dòng)互聯(lián)網(wǎng)產(chǎn)品的界面設(shè)計(jì)需要遵循各類系統(tǒng)平臺的特點(diǎn)，比如IOS系統(tǒng)和Android系統(tǒng)是有差異的，不同型號的iPhone界面布局也有所不同，因此設(shè)計(jì)師要遵循不同移動(dòng)系統(tǒng)平臺布局特點(diǎn)進(jìn)行界面視覺設(shè)計(jì)。

5.以用戶為中心，遵循交互設(shè)計(jì)原則

目標(biāo)用戶的群體性差異決定了各類移動(dòng)互聯(lián)網(wǎng)產(chǎn)品在界面視覺設(shè)計(jì)上的不同，例如針對老年人的產(chǎn)品界面在視覺設(shè)計(jì)一定更側(cè)重于無障礙設(shè)計(jì)的，要避免視覺噪音，在字體大小和設(shè)計(jì)風(fēng)格上更加體現(xiàn)對這類群體的人性關(guān)懷；在色彩傾向上，通常年長的用戶群更傾向于選擇保守穩(wěn)重的色調(diào)，而年輕用戶群則喜好更明快的色彩。界面視覺設(shè)計(jì)時(shí)需要考慮的因素包括用戶的年齡段、視覺特點(diǎn)、文化背景、受教育程度、以往的生活經(jīng)驗(yàn)與習(xí)慣、情感偏向等。除此之外還需要遵循交互設(shè)計(jì)的相關(guān)原則，例如產(chǎn)品的簡單易用性、尊重用戶的心理模型、友好的視覺反饋、一致性（界面的整體視覺風(fēng)格、色彩、布局和眾視覺元素的一致性）等。

結(jié)語：移動(dòng)互聯(lián)網(wǎng)產(chǎn)品構(gòu)架了一個(gè)信息雙向互動(dòng)的傳播模式，其界面視覺設(shè)計(jì)是以用戶為中心，在交互設(shè)計(jì)的基礎(chǔ)上進(jìn)行的，在美學(xué)、符號學(xué)以及心理學(xué)的宏觀引導(dǎo)下，通過一定的視覺設(shè)計(jì)方法與原則對界面的視覺要素與內(nèi)容進(jìn)行優(yōu)化設(shè)計(jì)的過程，良好的用戶體驗(yàn)則是檢驗(yàn)界面視覺設(shè)計(jì)的標(biāo)準(zhǔn)。移動(dòng)互聯(lián)網(wǎng)產(chǎn)品的界面設(shè)計(jì)是一個(gè)系統(tǒng)的設(shè)計(jì)體系，在工作中更注重與產(chǎn)品經(jīng)理、交互設(shè)計(jì)師、用戶體驗(yàn)研究人員、計(jì)算機(jī)工程師等協(xié)同合作，因此，視覺傳達(dá)設(shè)計(jì)師不可拘泥于視覺表現(xiàn)的技法上，重要的是要補(bǔ)充相關(guān)理論知識，如此才能更好的融入團(tuán)隊(duì)，開展設(shè)計(jì)工作。

參考文獻(xiàn)：

［1］楊煥.智能手機(jī)移動(dòng)互聯(lián)網(wǎng)應(yīng)用的界面設(shè)計(jì)研究［D］.武漢理工大學(xué)，2013.

［2］Pieter Desmet， Paul Hekkert.Framework of product experience［J］.International Journal of Design， 2007， 1（1）：57-66.

［3］蔡敏.情感化設(shè)計(jì)理論在網(wǎng)絡(luò)界面設(shè)計(jì)中的應(yīng)用研究［D］.武漢理工大學(xué)，2010.