視覺(jué)要素設(shè)計(jì)在App 交互界面中的應(yīng)用分析

湯繪曄

（蘭州交通大學(xué)，甘肅 蘭州 730070）

引言

隨著科技的進(jìn)步，信息傳播的模式和形式呈現(xiàn)出多樣性、多元化特點(diǎn)，隨著社會(huì)的進(jìn)步和發(fā)展，生產(chǎn)生活方式也發(fā)生了變革，通過(guò)PC 端瀏覽器來(lái)訪問(wèn)網(wǎng)頁(yè)的傳統(tǒng)方式已經(jīng)逐漸地被App 而代替。但大多數(shù)App 在產(chǎn)品設(shè)計(jì)的細(xì)節(jié)上內(nèi)容繁雜，沒(méi)法突出重點(diǎn)，給用戶造成閱讀障礙，致使用戶體驗(yàn)始終達(dá)不到較高水平；為此可以通過(guò)某些視覺(jué)要素對(duì)交互界面進(jìn)行優(yōu)化設(shè)計(jì)，使界面簡(jiǎn)潔，從而提升用戶使用的體驗(yàn)感。

1 用戶體驗(yàn)下的交互界面設(shè)計(jì)原則

用戶體驗(yàn)和交互界面設(shè)計(jì)的核心是“以用戶為中心”，無(wú)論什么設(shè)計(jì)都離不開用戶的感受，只有簡(jiǎn)單易懂、操作方便、功能完善的界面，才能不斷滿足用戶的需求。一方面是用戶理解原則，我們要充分地了解用戶的需求，使用戶可以輕易地理解設(shè)計(jì)的各個(gè)過(guò)程[1]；另一方面是用戶友好性原則，如果在交互界面操作過(guò)程中出現(xiàn)失誤對(duì)用戶是非常不友好的，容易導(dǎo)致用戶產(chǎn)生沮喪、厭惡等負(fù)面情緒，因此在設(shè)計(jì)中要盡量避免用戶出錯(cuò)的概率。

1.1 易用性原則

不同用戶之間存在差異，因此在交互界面設(shè)計(jì)中我們需要迎合用戶的使用習(xí)慣，進(jìn)行全面調(diào)研和深入思考，使設(shè)計(jì)產(chǎn)品簡(jiǎn)單易懂，讓用戶能夠快速掌握產(chǎn)品的操作流程。例如：通常人們都是自上而下、自左而右的閱讀順序，確認(rèn)按鈕在左、取消按鈕在右等等，因此界面設(shè)計(jì)就要符合用戶的這些使用習(xí)慣。而陌生的、新奇的事物帶著未知性，可能會(huì)使用戶產(chǎn)生抵觸和抗拒的心理。

1.2 規(guī)范性原則

交互界面要遵循規(guī)范性原則，在界面中，文字是App 主要信息的表現(xiàn)，尤其新聞閱讀等產(chǎn)品本身文字較多的App，因此就要制定標(biāo)準(zhǔn)的設(shè)計(jì)規(guī)范和良好的排版方式，使用戶在使用時(shí)不會(huì)產(chǎn)生視覺(jué)疲勞。

1.3 一致性原則

設(shè)計(jì)時(shí)要考慮用戶審美，在App 界面設(shè)計(jì)時(shí)，不同的模塊之間也要有相同的交互特性，在視覺(jué)、功能、信息構(gòu)架和操作等方式上具有一致性，防止用戶產(chǎn)生迷茫、混亂的心理[2]。因此在界面設(shè)計(jì)時(shí)，可以使用相同的顏色、字體來(lái)表達(dá)相同的內(nèi)容，統(tǒng)一的顏色可以保持交互界面設(shè)計(jì)的整體性、一致性，使用戶能在使用過(guò)程中快速區(qū)分信息。

1.4 協(xié)調(diào)與美觀性原則

視覺(jué)設(shè)計(jì)很大程度上影響著用戶是否愿意進(jìn)一步了解該產(chǎn)品，操作界面是否協(xié)調(diào)，對(duì)于用戶而言，則會(huì)直接影響到用戶是否能夠流利地操作?，F(xiàn)如今，簡(jiǎn)化交互界面設(shè)計(jì)成為一種設(shè)計(jì)潮流，簡(jiǎn)潔的界面設(shè)計(jì)不僅能使用戶在視覺(jué)上放松，內(nèi)容也能更加明顯地展示出來(lái)，引起用戶的注意，使使用的困難程度降低，從而提升用戶的滿意度。

2 移動(dòng)端下的用戶交互的體驗(yàn)需求

2.1 舒適的交互手勢(shì)

觸控互動(dòng)的方式是主要交互方式之一。界面信息的位置排布受手指活動(dòng)范圍的影響[3]。多點(diǎn)觸摸手勢(shì)中包括點(diǎn)擊手勢(shì)、長(zhǎng)按手勢(shì)、滑動(dòng)手勢(shì)等，點(diǎn)擊手勢(shì)和長(zhǎng)按手勢(shì)是手勢(shì)設(shè)計(jì)中的基礎(chǔ)操作手勢(shì)，分別用于打開所選信息等等；滑動(dòng)手勢(shì)是手勢(shì)設(shè)計(jì)中的導(dǎo)航操作手勢(shì)，主要用于目標(biāo)的移動(dòng)[4]。易操作且好用的交互手勢(shì)可以讓人與設(shè)備之間的交流更加自然流暢。

2.2 清晰的信息

移動(dòng)設(shè)備的屏幕尺寸是有限的，如果界面上展示的東西越多，用戶瀏覽所花的時(shí)間就會(huì)越長(zhǎng)。例如為了突出了文案所要表達(dá)的含義可以運(yùn)用放大圖片再配上簡(jiǎn)單文字的形式，這樣既清晰地展示了圖片也清楚地表達(dá)了文字所要說(shuō)明的含義。因此在設(shè)計(jì)界面時(shí)，要使信息清楚而有序地傳遞給用戶，從而提升使用效率。

2.3 良好的動(dòng)態(tài)效果

運(yùn)用合適的動(dòng)態(tài)效果有助于用戶更快地了解、使用界面，一但運(yùn)用過(guò)多的動(dòng)態(tài)效果可能會(huì)帶來(lái)負(fù)面印象，沒(méi)有及時(shí)反饋從而影響用戶體驗(yàn)[3]，同時(shí)也會(huì)混淆用戶的操作，增加使用障礙，因此適量的動(dòng)畫才能使界面達(dá)到最好的效果。

3 視覺(jué)元素在手機(jī)App 界面中的應(yīng)用分析

界面的整體結(jié)構(gòu)、色彩與顯示的清晰度是影響界面設(shè)計(jì)的重要視覺(jué)因素。在界面布局設(shè)計(jì)上，如果不能將信息進(jìn)行合理排列，信息過(guò)多，從而增加用戶的瀏覽時(shí)間，就會(huì)給用戶帶來(lái)較為糟糕的用戶體驗(yàn)。因此整個(gè)畫面應(yīng)規(guī)范對(duì)稱，不要讓用戶產(chǎn)生視覺(jué)疲勞，防止影響其心理預(yù)期，從而接受錯(cuò)誤信息[5]。

3.1 符號(hào)元素

現(xiàn)如今，交互界面的視覺(jué)效果隨著人們審美的變化而變化，近年來(lái)扁平化設(shè)計(jì)一直是交互界面設(shè)計(jì)的主流風(fēng)格，它刪減掉了多余的立體效果使得整體設(shè)計(jì)更加簡(jiǎn)潔、美觀。從三維到二維，只保留最基本的圖形形狀，刪除可有可無(wú)的裝飾效果，從而極大地減輕了用戶的視覺(jué)負(fù)擔(dān)，符合當(dāng)代用戶的審美要求，突出App 的主要功能信息[6]，使信息高效地傳達(dá)給用戶。

3.2 文字元素

文字在App 界面設(shè)計(jì)的作用一般為提醒、按鍵功能解釋以及輔助操作等等。但文字不同于符號(hào)，平面設(shè)計(jì)中文字也可以作為一種視覺(jué)元素進(jìn)行版式的編排、構(gòu)圖等。除了傳遞信息內(nèi)容外還能增強(qiáng)交互界面的視覺(jué)化效果。例如出現(xiàn)按鈕時(shí)，在引導(dǎo)用戶點(diǎn)擊或選擇的過(guò)程中，字體上可以加粗或者放大，使其有明顯的對(duì)比。

3.3 色彩元素

在交互界面視覺(jué)化設(shè)計(jì)最重要的就是色彩的運(yùn)用，搭配不同色彩使之具有合理性和協(xié)調(diào)性。在色彩使用時(shí)，合理運(yùn)用色彩的主次關(guān)系，注重色彩主色調(diào)的選擇，同時(shí)顏色搭配最好不超過(guò)三種。同時(shí)App 的功能和色彩可以具有一定的聯(lián)系性，注重用戶使用時(shí)的視覺(jué)感受。

4 界面現(xiàn)存的一些問(wèn)題

4.1 信息過(guò)分飽和

在界面排版過(guò)程中，有時(shí)會(huì)將過(guò)多的信息強(qiáng)行植入，給用戶造成一定的心理壓力。相比內(nèi)容繁雜的頁(yè)面，其實(shí)簡(jiǎn)單的界面更容易引起使用者的注意力，界面簡(jiǎn)單會(huì)給使用者帶來(lái)輕松愉悅的閱讀效果，不會(huì)給用戶造成心理負(fù)擔(dān)。但當(dāng)下的大部分界面設(shè)計(jì)沒(méi)法突出重點(diǎn)，反而是大量?jī)?nèi)容的堆砌，造成界面繁雜混亂。

4.2 易產(chǎn)生視覺(jué)疲勞

大多數(shù)App 在設(shè)計(jì)時(shí)，并沒(méi)有對(duì)用戶需求進(jìn)行深度的調(diào)研，沒(méi)有深入分析功能結(jié)構(gòu)，更沒(méi)有模擬用戶使用設(shè)計(jì)產(chǎn)品時(shí)的場(chǎng)景，致使現(xiàn)大多同類App產(chǎn)品的界面布局、功能結(jié)構(gòu)都毫無(wú)改進(jìn)、毫無(wú)亮點(diǎn)，造成用戶一定的審美疲勞。

4.3 實(shí)時(shí)的反饋

實(shí)時(shí)反饋是尤為重要的，使用者進(jìn)行任何操作必須要及時(shí)地反饋給他們。但如果操作者在實(shí)際操作過(guò)程中在對(duì)軟件進(jìn)行點(diǎn)擊或指令時(shí)，并沒(méi)有顯示任何信息的反饋，就會(huì)導(dǎo)致用戶體驗(yàn)感快速下降。例如：當(dāng)我們將手機(jī)音量增大或減小時(shí)，屏幕上會(huì)跳出彈窗，告知用戶此時(shí)音量的大小，給用戶一個(gè)及時(shí)的反饋，告知用戶這個(gè)動(dòng)作此時(shí)是生效的；但如果沒(méi)有實(shí)時(shí)的反饋會(huì)使用戶在使用過(guò)程中產(chǎn)生茫然和困惑，一定程度上降低了用戶的體驗(yàn)感。

5 總結(jié)

在App 界面設(shè)計(jì)中，使用讓用戶看著舒適的排版至關(guān)重要。因此要合理運(yùn)用圖形、文字和色彩元素，大膽創(chuàng)新，給用戶帶來(lái)全新的視覺(jué)沖擊。只有將用戶體驗(yàn)作為基礎(chǔ)和出發(fā)點(diǎn)，設(shè)計(jì)出來(lái)的交互界面才能滿足用戶的需求，提供更好的用戶體驗(yàn)。