葉聰

摘要：當(dāng)前的移動(dòng)軟件已經(jīng)開(kāi)始重視UI界面設(shè)計(jì)工作，并且引入了多種設(shè)計(jì)技術(shù)，其中視覺(jué)傳達(dá)設(shè)計(jì)為其中的最重要設(shè)計(jì)技術(shù)之一?；趯?duì)視覺(jué)傳達(dá)設(shè)計(jì)中可用因素以及表達(dá)形式的分析，結(jié)合對(duì)移動(dòng)UI界面設(shè)計(jì)中需要關(guān)注重點(diǎn)內(nèi)容的總結(jié)，本文提出了視覺(jué)傳達(dá)設(shè)計(jì)在移動(dòng)UI界面設(shè)計(jì)中的應(yīng)用方法，從而讓界面設(shè)計(jì)的科學(xué)性提升。

關(guān)鍵詞：視覺(jué)傳達(dá)設(shè)計(jì);移動(dòng)UI界面;界面設(shè)計(jì)

中圖分類號(hào)：TP393? ? ? 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1009-3044（2019）25-0308-03

在視覺(jué)設(shè)計(jì)中，其當(dāng)前已經(jīng)成了一門(mén)獨(dú)立的學(xué)科，其在不同的設(shè)計(jì)領(lǐng)域中使用方式和注重的因素有所不同。在移動(dòng)軟件的設(shè)計(jì)中，要從這類軟件的本身角度出發(fā)，依照視覺(jué)傳達(dá)設(shè)計(jì)中的相關(guān)知識(shí)完成所有的設(shè)計(jì)項(xiàng)目，但是對(duì)于移動(dòng)UI界面來(lái)說(shuō)，由于UI界面占用空間過(guò)大會(huì)降低軟件的響應(yīng)速度，所以也要考慮界面設(shè)計(jì)上的簡(jiǎn)潔性。

1視覺(jué)傳達(dá)設(shè)計(jì)中的可用因素以及表達(dá)形式

1.1 版式布局

移動(dòng)APP受到手機(jī)屏幕空間的桎梏較大，為了能夠更好地完成對(duì)所有項(xiàng)目的分析，要通過(guò)對(duì)整個(gè)界面版式的合理布局，提高界面的設(shè)計(jì)美觀性和科學(xué)性。

版式布局設(shè)計(jì)中，當(dāng)前開(kāi)發(fā)出了多種形式，本文將其歸類為多階段分布式布局和整體性布局兩種方式。前者的概念為，界面上分為多個(gè)不同的層次，或者通過(guò)在界面上設(shè)置對(duì)中顏色強(qiáng)度漸變圖片、線條增加復(fù)雜度等方式，提高界面涵蓋信息數(shù)量的樣式。對(duì)于分為不同層次的方式，在當(dāng)前的移動(dòng)UI界面中的應(yīng)用概率較低，原因?yàn)檫@種設(shè)計(jì)方式難以和移動(dòng)APP中的內(nèi)容和內(nèi)涵對(duì)接，并且當(dāng)前的手機(jī)系統(tǒng)中多植入廣告，所以界面會(huì)保持一段時(shí)間，這種方式會(huì)提高對(duì)用戶的感官刺激，只有在特定情況下才可用。而對(duì)于提高信息量的情況，考慮到手機(jī)屏幕尺寸，一味增加信息量的方式作用效果較為一般[1]。從整體上來(lái)看，當(dāng)前這種版式布局方式的使用量較少。

后者的概念為，移動(dòng)UI界面不再只重視對(duì)信息的表達(dá)和傳遞，而是更注重對(duì)用戶的吸引，常用的設(shè)計(jì)方法為“留白”形式，只通過(guò)凸顯出關(guān)鍵信息的方式，展現(xiàn)相關(guān)APP的特色。

1.2 界面色彩

界面設(shè)計(jì)中采用的色彩要考慮多種因素，其中最首要的為整個(gè)底色方面的色彩搭配方案，對(duì)不同的手機(jī)移動(dòng)軟件來(lái)說(shuō)，其具備的內(nèi)涵和發(fā)揮的作用有很大不同，其需要向用戶展現(xiàn)的特點(diǎn)也有所區(qū)別。為了能夠提高用戶的觀感，所以要保證采用的底色能夠和app發(fā)揮的功能以及具備內(nèi)涵方面的完整適配，通過(guò)這種方法方可讓軟件能夠被更多用戶所接受。

而對(duì)于版式設(shè)計(jì)工作來(lái)說(shuō)，雖然在設(shè)計(jì)中經(jīng)過(guò)多種設(shè)計(jì)上的變更方案在， 即從小內(nèi)存階段的簡(jiǎn)約設(shè)計(jì)，到智能機(jī)普及時(shí)的復(fù)雜設(shè)計(jì)，再到當(dāng)前最為常見(jiàn)的簡(jiǎn)約設(shè)計(jì)方式，設(shè)計(jì)思想經(jīng)過(guò)了對(duì)此變更，但是具體的設(shè)計(jì)中都需要能夠通過(guò)對(duì)移動(dòng)UI設(shè)計(jì)工作，凸顯出所要向用戶傳達(dá)的信息和意圖[2]。

在界面設(shè)計(jì)工作中，要注意整個(gè)界面設(shè)計(jì)過(guò)程中的選用顏色，尤其是對(duì)于整個(gè)界面中的文字信息，由于文字為整個(gè)界面的升華和相關(guān)信息歸納，所以需要其能夠與背景顏色之間有較高的差別，可以讓用戶在第一時(shí)間通過(guò)閱讀文字發(fā)現(xiàn)該手機(jī)移動(dòng)軟件的具體應(yīng)用特點(diǎn)和功能。

1.3 文字線條

界面設(shè)計(jì)中針對(duì)文字線條的設(shè)計(jì)工作必不可少，原因?yàn)橹煌ㄟ^(guò)設(shè)置的照片很難讓用戶找到這一軟件中涵蓋的信息，而通過(guò)對(duì)文字和線條的應(yīng)用，可以實(shí)現(xiàn)對(duì)相關(guān)因素的有效融合和連接。在完成對(duì)所有項(xiàng)的歸類和融合后，用戶可以第一時(shí)間發(fā)現(xiàn)這一界面所具備的信息量和信息內(nèi)容，最終讓用戶能夠根據(jù)自身所求，確定是否下載相關(guān)軟件。

文字線條設(shè)計(jì)一方面要注意這些信息的傳達(dá)方式，以確定文字的構(gòu)成以及表達(dá)方式，文字和線條信息為軟件的整體升華項(xiàng)目，所以要保證設(shè)計(jì)的專業(yè)性，尤其是對(duì)于文字方面，這一因素需要有專業(yè)的文案撰寫(xiě)人員完成設(shè)計(jì)。而對(duì)于字體的其余構(gòu)造因素，包括字體顏色、字體大小、字體字號(hào)、字體設(shè)置位置等多種因素，這些因素將由界面設(shè)計(jì)人員完成，就在所有因素合理搭配的情況下，才可確保用戶能夠提前通過(guò)閱讀文字找到整個(gè)軟件的特點(diǎn)和相關(guān)信息。

1.4 元素符號(hào)

元素符號(hào)的概念為，通過(guò)對(duì)字母、相關(guān)圖形等因素的使用和融合，完成對(duì)整個(gè)移動(dòng)UI界面的設(shè)計(jì)，并且這些因素要能夠與軟件的整體運(yùn)行方式和運(yùn)行內(nèi)涵銜接，通過(guò)這種方法最終讓軟件能夠被更多用戶接受。

對(duì)于不同類型、不同功能的軟件來(lái)說(shuō)，其具備的元素符號(hào)類型也有所不同，例如對(duì)于圖形元素當(dāng)前常用的為圓形因素以及其余不具備較為尖銳角度的圖形，原因?yàn)閺男睦韺W(xué)上來(lái)看，當(dāng)前常用的圖形能夠更好地與用戶的心理契合，并且這類元素最大限度降低了信息傳達(dá)中的攻擊性因素。

2 移動(dòng)UI界面設(shè)計(jì)中需要關(guān)注的重點(diǎn)內(nèi)容

2.1 搭配合理性

移動(dòng)UI界面設(shè)計(jì)中要關(guān)注使用元素的搭配量和搭配效果，需要考慮的因素包括整體版式設(shè)計(jì)、選用的因素設(shè)計(jì)、移動(dòng)UI界面中設(shè)置的文字以及線條等，只有在所有項(xiàng)目都符合要求的情況下，才可以保證整個(gè)UI界面的搭配合理性。

考慮到移動(dòng)UI界面的特殊性，即展現(xiàn)屏幕較小，所以在搭配方面需要考慮的內(nèi)容為文字的確定位置、相關(guān)圖形的表現(xiàn)形式等[3]。

另外也要按照整個(gè)app發(fā)揮作用的角度出發(fā)，確定該軟件的作用形式以及內(nèi)涵和功能特點(diǎn)，在此基礎(chǔ)上確定采用何種版式布局形式，雖然常見(jiàn)的版式為簡(jiǎn)約性設(shè)計(jì)，但是在一些特殊情境下的軟件中，簡(jiǎn)約現(xiàn)設(shè)計(jì)涵蓋的信息量過(guò)低，降低了這一系統(tǒng)的發(fā)揮作用。

2.2 界面簡(jiǎn)約性

在當(dāng)前的網(wǎng)絡(luò)信息技術(shù)發(fā)展中，用戶會(huì)在短時(shí)間之內(nèi)收集到大量的信息，長(zhǎng)此以往，會(huì)使用戶產(chǎn)生信息收集疲勞癥狀，所以可以看到當(dāng)前用戶對(duì)界面設(shè)計(jì)簡(jiǎn)潔性提出的要求逐漸升高。

移動(dòng)UI界面設(shè)計(jì)的兩個(gè)重要因素為對(duì)相關(guān)信息的傳達(dá)和對(duì)用戶心理預(yù)期的滿足，甚至在一定條件下或特定的軟件中，后者的優(yōu)先級(jí)要遠(yuǎn)高于前者。從這一角度來(lái)看，當(dāng)前和今后的移動(dòng)界面發(fā)展研發(fā)中，采用簡(jiǎn)約性設(shè)計(jì)的軟件類型會(huì)逐漸增高。

但是這種認(rèn)知只是一種普適性的認(rèn)知模式，對(duì)于一些特殊類型的軟件來(lái)說(shuō)，其移動(dòng)UI界面的設(shè)計(jì)復(fù)雜都需要大幅提高，達(dá)到刺激用戶感官、吸引用戶興趣以及大量傳達(dá)信息的目的，這類軟件最常見(jiàn)的為各類手機(jī)移動(dòng)游戲軟件，當(dāng)前已經(jīng)確定這類游戲軟件的UI界面設(shè)計(jì)舒適程度和對(duì)用戶的感官刺激程度，會(huì)直接決定該游戲今后一段時(shí)間內(nèi)的用戶熱度和發(fā)展表現(xiàn)。

2.3 界面適配性

對(duì)于界面的適配性來(lái)說(shuō)，要從該軟件發(fā)揮作用、發(fā)揮功能以及作用內(nèi)涵的角度出發(fā)，完成對(duì)各類信息的傳達(dá)，并在此基礎(chǔ)上確定采用的整體性設(shè)計(jì)思路。而對(duì)于當(dāng)前的移動(dòng)軟件來(lái)說(shuō)，其功能區(qū)別性較高，除了上文中提及的游戲的軟件采用非簡(jiǎn)約型設(shè)計(jì)思想，對(duì)于其余一些類型的軟件界面設(shè)計(jì)中，其跳脫傳統(tǒng)設(shè)計(jì)思想的概率越來(lái)越高。

在信息傳達(dá)量以及軟件界面設(shè)計(jì)方式的確定中，也可以分析該軟件需要向用戶傳達(dá)的思想和軟件本身涵蓋的信息量，研究軟件界面是否需要提高復(fù)雜度。例如對(duì)于中國(guó)大學(xué)MOOC軟件的說(shuō)，其界面就屬于非簡(jiǎn)約原型設(shè)計(jì)模式，軟件界面上覆蓋的信息量較高，通過(guò)界面上設(shè)置的文字表述了該軟件發(fā)揮的作用和功能，所以從這一設(shè)計(jì)思想和產(chǎn)品表達(dá)上來(lái)看，可以確定要能夠提高對(duì)移動(dòng)UI界面的設(shè)計(jì)精度和設(shè)計(jì)科學(xué)性，需要分析軟件的運(yùn)作方式，在此基礎(chǔ)上讓整個(gè)軟件和UI界面之間能夠更好銜接。

3 視覺(jué)傳達(dá)設(shè)計(jì)在移動(dòng)UI界面設(shè)計(jì)中的應(yīng)用方法

3.1 版式布局設(shè)計(jì)應(yīng)用

在移動(dòng)UI界面設(shè)計(jì)中，最基礎(chǔ)也是最重要的工作為版式布局設(shè)計(jì)，在此基礎(chǔ)上才可以完成對(duì)后續(xù)內(nèi)容的研究和完善。在本文的分析中已經(jīng)按照軟件的用途實(shí)現(xiàn)對(duì)版面布局方式的分類，并且從用戶的心理預(yù)期和心理期待角度出發(fā)，提出版面設(shè)計(jì)的具體操作方式[4]。

對(duì)于非簡(jiǎn)約性設(shè)計(jì)的版面布局形式來(lái)說(shuō)，界面發(fā)揮作用的最主要形式為能夠?qū)崿F(xiàn)對(duì)大量信息的傳達(dá)和能夠刺激用戶的感官，另外與一些特定用戶的審美思想集合。

在具體的設(shè)計(jì)中要嚴(yán)格分析這一軟件發(fā)揮的作用，在此基礎(chǔ)上完成對(duì)后續(xù)內(nèi)容的開(kāi)發(fā)和完善，針對(duì)大量信息傳達(dá)內(nèi)容來(lái)說(shuō)，主要包括的軟件類型為教育學(xué)軟件、各類行業(yè)專用軟件等，這類軟件需要具備一定文化基礎(chǔ)的人才能使用，尤其是對(duì)于各類專業(yè)性軟件，所以其采用的布局模式可以為較為復(fù)雜性的布局模式。但是對(duì)于大部分這類軟件來(lái)說(shuō)，由于具備一定知識(shí)量的人員通常對(duì)復(fù)雜信息處理效率較高，并且對(duì)這類軟件的界面具備信息量追求較低，所以當(dāng)整個(gè)設(shè)計(jì)復(fù)雜度過(guò)高時(shí)，通常情況下，無(wú)法實(shí)現(xiàn)對(duì)用戶注意力的有效吸引，同時(shí)該過(guò)程中設(shè)計(jì)人員需要考慮大量的因素，導(dǎo)致整個(gè)軟件界面的設(shè)計(jì)成本提升。

對(duì)于需要通過(guò)界面刺激用戶感官的軟件來(lái)說(shuō)，主要為各類游戲軟件，其設(shè)計(jì)的界面通常為游戲的更新內(nèi)容、游戲的主要玩法等，并且為了進(jìn)一步提高用戶的感官刺激，可以采用動(dòng)態(tài)圖片的方式完成對(duì)整個(gè)UI界面的設(shè)計(jì)。

而對(duì)于有一些只針對(duì)特定用戶審美情境的軟件來(lái)說(shuō)，需要從該軟件發(fā)揮功能的角度出發(fā)，確定整個(gè)軟件中涵蓋的信息量和信息內(nèi)容的表述。

對(duì)于其余的簡(jiǎn)約性軟件設(shè)計(jì)方法來(lái)說(shuō)，最主要的設(shè)計(jì)思想為在確定底色的基礎(chǔ)上，完成對(duì)其余因素的增加，通常情況下要配置的底色為單一性顏色，通過(guò)這種方式才能夠更好凸顯其實(shí)設(shè)計(jì)內(nèi)容中涵蓋的信息。在當(dāng)前的大量軟件設(shè)計(jì)中，已經(jīng)開(kāi)始采用這種設(shè)計(jì)思想實(shí)現(xiàn)對(duì)各類信息的輸出。

3.2 界面色彩設(shè)計(jì)應(yīng)用

在界面色彩的設(shè)計(jì)中，要考慮整個(gè)軟件需要向用戶傳達(dá)的信息，并且要防止采用的顏色搭配模式對(duì)用戶的心理情況造成過(guò)大影響，另外也要考慮該顏色是否會(huì)對(duì)用戶的感官產(chǎn)生刺激。

通常情況下，冷色系和暖色系的顏色都可以作為UI設(shè)計(jì)界面的底色，但是也要考慮這一軟件的整體氛圍和整體風(fēng)格。比如對(duì)于運(yùn)動(dòng)類軟件來(lái)說(shuō)，需要讓用戶才能一種沖動(dòng)性行為，以刺激用戶能夠參與到運(yùn)動(dòng)項(xiàng)目中，由于冷色系通常會(huì)讓用戶產(chǎn)生冷靜行為和冷靜心里，這與整個(gè)軟件的功能范圍不協(xié)調(diào)，所以要通過(guò)對(duì)暖色系的顏色應(yīng)用，讓最終設(shè)計(jì)的移動(dòng)UI界面和整個(gè)軟件的功能協(xié)調(diào)。另外發(fā)現(xiàn)也具有一些特殊類型的軟件，采用色調(diào)顛倒的方式提高用戶的黏度，例如對(duì)于keep運(yùn)動(dòng)軟件來(lái)說(shuō)，其移動(dòng)UI界面主要采用冷色系，原因在于該軟件強(qiáng)調(diào)一種用戶需要長(zhǎng)期堅(jiān)持的觀念，從最終的作用效果上來(lái)看，其已經(jīng)屬于提高用戶冷靜程度的范圍，所以采用這種設(shè)計(jì)方法具有很高的科學(xué)性。

3.3 文字線條設(shè)計(jì)應(yīng)用

文字線條應(yīng)用能夠在很大程度上提高整個(gè)界面的復(fù)雜性程度，所以要在具體的設(shè)計(jì)工作中考慮這些因素對(duì)界面的具體影響效果。

由于文字的作用為完成對(duì)所有關(guān)鍵信息的表述和傳達(dá)，所以文字要能夠被凸顯，而凸顯的方式包括文字顏色和底色之間的差別、文字的字號(hào)大小和文字的表達(dá)形式，要確保所有的因素都能夠?yàn)樾畔鬟_(dá)過(guò)程奠定基礎(chǔ)。比如在各類用戶多年的文字閱讀中，已經(jīng)養(yǎng)成了宋體為信息表達(dá)過(guò)程的最佳字體思想，所以通常使用這種字體表述信息[5]。

而對(duì)于設(shè)計(jì)的顏色來(lái)說(shuō)，要根據(jù)背景顏色確定文字顏色，比如背景為偏白色的顏色，為提高對(duì)比度，文字顏色為黑色即可，需要注意的是，要嚴(yán)格避免出現(xiàn)形如粗體紅色類型的字體，防止對(duì)用戶的感官造成過(guò)大刺激。

對(duì)于線條設(shè)計(jì)，則起到對(duì)UI界面的因素鏈接和氛圍烘托作用，要根據(jù)具體的軟件功能確定線條形式、顏色等因素，由于需要提高簡(jiǎn)約性，則要降低線條顏色和背景之間的對(duì)比度。

3.4 元素符號(hào)設(shè)計(jì)應(yīng)用

因素符號(hào)的設(shè)計(jì)中，需要考慮的因素為軟件的整體運(yùn)行形式和發(fā)揮的功能，為了能夠讓這一系統(tǒng)更好運(yùn)行，則要考慮的因素為文字的形式、圖形表現(xiàn)形式等，只有在所有的項(xiàng)目符合要求情況下，才可讓整個(gè)界面的設(shè)計(jì)科學(xué)性提高。

設(shè)計(jì)的符號(hào)因素要從軟件的作用形式考慮，選用正確合理的圖形，從最終的表現(xiàn)形式來(lái)看，當(dāng)前的設(shè)計(jì)方法為，對(duì)于商標(biāo)等信息來(lái)說(shuō)，通常不做出變更，需要對(duì)軟件中具備信息的分析，合理確定其余各類信息的傳達(dá)形式。

4 結(jié)論

綜上所述，在視覺(jué)傳達(dá)設(shè)計(jì)中，需要考慮的因素包括版式布局設(shè)計(jì)、文字線條設(shè)計(jì)、色彩視圖設(shè)計(jì)和融入因素設(shè)計(jì)，移動(dòng)UI界面的設(shè)計(jì)過(guò)程要研究的項(xiàng)目包括界面的簡(jiǎn)潔性、搭配合理性等，要通過(guò)對(duì)相關(guān)軟件需要涵蓋信息的分析和研究，完成對(duì)整個(gè)界面中所有項(xiàng)目的具體深入了解，最終制定出相應(yīng)的設(shè)計(jì)方案。

參考文獻(xiàn)：

[1] 王蒙蒙.視覺(jué)傳達(dá)設(shè)計(jì)在移動(dòng)UI界面中的運(yùn)用[J].西部皮革，2019，41（07）：70.

[2] 周璨.視覺(jué)傳達(dá)設(shè)計(jì)在移動(dòng)UI界面設(shè)計(jì)中的應(yīng)用[J].教育教學(xué)論壇，2019（12）：263-264.

[3] 陶少奇.視覺(jué)傳達(dá)設(shè)計(jì)在移動(dòng)UI設(shè)計(jì)中的運(yùn)用初探[J].新聞研究導(dǎo)刊，2019，10（04）：172.

[4] 韓婷婷.移動(dòng)互聯(lián)網(wǎng)時(shí)代視覺(jué)傳達(dá)設(shè)計(jì)的方法和表現(xiàn)特性[J].工業(yè)設(shè)計(jì)，2019（02）：145-146.

[5] 許琛.UI界面設(shè)計(jì)在視覺(jué)傳達(dá)設(shè)計(jì)專業(yè)教學(xué)中的應(yīng)用研究[J].科教導(dǎo)刊（上旬刊），2016（12）：98-99.

【通聯(lián)編輯：光文玲】