移動互聯網軟件產品中的UI設計探討

摘要：自我國正式進入到信息化時代以來，移動互聯網已經得到了廣泛的應用，而移動互聯網的出現為廣大用戶提供了更加便捷的信息交互平臺。但是移動互聯網不能機械的將傳統互聯網的組織架構、界面布置以及使用方法直接應用在移動互聯網終端上，為了可以推廣移動互聯網產品，就需要重視UI設計。本文主要對移動互聯網軟件產品UI設計的類型劃分展開分析，并對于UI設計要素進行探討，最后提出了UI設計的要點。

關鍵詞：移動互聯網；軟件產品；UI設計

信息化時代的到來，使得當前的移動通信技術、互聯網技術等應用范圍在逐漸的擴大，已然成為全球科技領域中發展速度最快的產業。移動互聯網會將移動通信所具有的輕便性特點與互聯網的快捷特點進行結合，以此來提供更加高效化的信息交互平臺。而且移動互聯網軟件的出現為用戶實現了各方面的功能，而我國現如今的移動互聯網軟件產品UI設計大部分仍舊還是采用傳統的互聯網界面布置方式與自制結構，還尚未形成更為創新化的設計體系，這會對于移動互聯網的普及造成嚴重阻礙。所以，如何提升我國當前的移動互聯網軟件產品UI設計水平，成為當前移動互利網軟件設計行業需要解決的問題。

1、移動互利網軟件產品類型

移動互聯網主流客戶端的UI設計類型主要可以分為五類，分別是社交網絡類、產品宣傳類、網絡電商類、媒體信息類以及服務性查詢類。其中，媒體信息類：主要是在各大門戶網站所提供的信息平臺中應用，常見的有網易新聞客戶端等。網絡電商類：主要是在B2C購物網站上交易客戶端的UI設計中應用，例如京東和淘寶等。產品宣傳類：應用在各大獨立品牌宣傳品牌文化或產品的UI設計，例如唯品會等。社交網絡類：在各大論壇、社交網站上的移動線上交流客戶端的UI設計，如微信、微博等UI設計[1]。服務性查詢類：為用戶提供查詢信息服務的移動互聯網軟件產品，常見的主要有百度、谷歌等。

2、UI設計的層次

人類的大腦中認知系統會將食物分為感官層、行為層以及反思層。這三個層次表現出層層遞進的趨勢，其中感官層次具有最高程度的優先級，其作用于邏輯思維與主觀意識之前。感官層的作用是大腦對于產品形成初次印象，這與產品的外觀和用戶最初的體驗具有直接的關系。行為層是大腦對于產品更深層次的認識，是用戶在使用產品后，對于產品更深層次的認識，對于產品功能、操作等的初步了解[2]。最后是反思層，這是大腦認知中的最高層面，大腦對于產品的認知將會由簡單了解轉移到精神層面上。

用戶在感官層的體驗主要是來源于產品本身的外觀效果與外界對于產品自身的評價。在感官層中，有關于產品的視覺設計與基本功能都是形成用戶體驗的原因。在行為層中，用戶對于已經使用過的產品產生的用戶體驗就是操作過程，其重點主要在于人機交互。反思層主要是來源于用戶對于情感方面的理解，這與用戶的個人背景、對產品的熟悉程度以及文化水平等有關，并且還會直接影響到用戶的體驗效果。

3、移動互聯網軟件中UI設計中的設計要素

3.1 移動互聯網軟件中UI設計的色彩設計

色彩視覺效果在整個的移動互利網的軟件設計中，直接關系到用戶的使用體驗。基于色彩心理學的角度，不同顏色將會為用戶產生完全不一樣的心理感受，例如，在UI設計中使用紅色可以吸引用戶的注意力，或是宣傳促銷等商業活動的氛圍。基于生理學、機械工程學等角度，當前的大部分手機屏幕色彩有2000萬左右，但是因為人眼的生理結構是固定的，所以，其色彩的適應范圍較為狹窄，如果屏幕色彩的純度過高的話，還會導致眼睛不適[3]。因此，在UI設計色彩的過程中，需要盡量照顧人體視覺感受，添加一些比較融合的色彩，降低色彩對比度閾值，平衡界面的視覺效果。

3.2 移動互聯網軟件產品中UI設計的文字編排

文字在移動互聯網軟件產品UI設計中，具有非常重要的作用，主要承擔分區分類、補充說明、協調畫面整體感等作用。而在選擇字體的時候，當前所使用的字體大部分為宋體、黑體[4]。但是，宋體又可以分為華文仿宋、仿宋體、華文中宋以及傳統宋體等等，這些字體都可以將內容充分表達出來，并且還會使軟件閱讀過程過于乏味，主要是在各種說明性文字中進行應用。黑體則主要包括華文細黑、微軟雅黑、華為黑體一級微軟正黑等，這些字體具有十分強烈的現代感，比較適合應用在標題中。許多手繪字體與現代化字體開始應用在文字設計中，這些字體具有十分鮮明的個性，常常應用在logo中。而對于文字的組合與編排，設計人員需要考慮手機屏幕的大小，同時還需要考慮大部分用戶的閱讀習慣，并盡量簡潔界面。文字的排列方式中，居中排列適用在軟件啟動界面，而橫排的適用范圍十分廣泛，豎排比較少見[5]。而設計的過程中需要根據實際情況進行處理，并且還需考慮字間距與壓角、留白等效果，使文字的疏密恰到好處。

3.3 移動互聯網軟件產品中UI設計版式

在軟件產品中UI設計中，版式同樣非常關鍵，版式設計的科學性與否直接關系到軟件的頁面布局，可以使頁面布局更為優化，從而有效的提高信息的傳輸效率。而移動互聯網終端設備屏幕的尺寸不同的話，產品的界面細節設置同樣也會存在差異，但是其設計思路在總體上大致是相同的。首先需要了解內容的主次性，然后選擇適合的位置。其次，在設計界面版式時，需要盡可能將主題內容凸顯出來，可以通過設計可逆選項的方式，使用戶方便重復點擊主要內容，從而提高出現頻率[6]。再次，嚴格遵守布局無障礙的設計原則。界面如果涉及的過于擁擠，將會導致用戶出現視覺疲勞的情況，因此必須要注意軟件的界面布局，以平衡布局為設計原則，重點凸顯出功能區的作用。

3.4 移動互聯網軟件產品中UI設計的動畫

圖形是點、線、面三個要素構成，以物體的等比無限縮小成為點，隨著點在進行規律性移動的過程中會產生軌跡，而運動軌跡就是線，多條線經過組合與變動，成為圖形，對于圖形進行整體性移動，將會成為面。移動互聯網軟件產品的UI設計目的是為了能夠滿足用戶的使用需求，并實現與客戶之間的互動。從當前各種移動互聯網軟件產品的發展狀況來看，軟件產品上開始應用傳輸信息量豐富、流量占用小的動畫。許多想要突出軟件功能的廣告都喜歡應用動畫效果；而設計網站上未來推廣產品，也會添加gif廣告圖形。要想表達清楚設計人員的設計意圖，動畫效果是最為高效的一種手段。當靜態設計圖無法充分表達出產品意圖的時候，一個簡單地的動畫就能代替文字語言表達出更完整的信息。動畫的要素為周期、行為以及關鍵幀。一個流量小，制作簡單的動畫要比一張普通的靜態圖片具有更高的點擊率，靜態圖片容易被人忽視，即使打開也會被很快遺忘。而伴隨著當前人們審美水平的提高，缺乏創新的作品已經很難受到人們的關注，在此背景下開始應用交互式動畫，而交互式動畫對于提高產品的可用性具有重要作用。

而體現動畫元素運動有許多的方法，例如，（1）積累一定數量，并對畫面進行重復、相交；（2）模仿運動軌跡，基于透視法則，可以使畫面獲得立體感、動感；（3）通過利用不確定因素，例如，非確定物體運動軌跡、非確定物體運動方向等可以營造出動感氛圍[7]。

4、移動互聯網產品UI 設計要點

4.1 設計風格要與內容統一

移動互聯網軟件產品的UI設計風格要與產品的形象相統一，設計人員不能過于追求界面的簡潔設計或是新穎化，但是卻忽略了整體的商業效果，需要使用戶在充分了解產品的基礎上，能夠在視覺上接受線上的服務終端。

4.2 具有完備的界面語言體系

語言是用戶與移動互利網之間產生交互的有效工具，而設計人員與軟件開發工作人員要給予用戶群來構建界面語言體系，同時要使界面語言具有較廣的覆蓋面，并且也需具有較低的系統占用率[8]。

4.3 界面效果要清晰

智能手機屏幕的分辨率與像素在當前已經非常高了，在這一背景下對于移動互聯網軟件的顯示效果提出了更高的要求。工作人員要最大程度上選擇更為高清的素材，這樣才可以有效的提高界面的清晰程度以及軟件的畫質，通過這一特點能夠吸引更多的用戶。

4.4 具備及時性

移動互聯網產品的UI設計需要具備及時性的特點，主要指的是對于重要信息及時提醒，這一要求是為了可以指導用戶正確操作軟件，并保障用戶的信息安全。因為用戶可能會因為對于操作界面不夠熟悉，從而發生操作錯誤的問題，因此軟件要及時提醒用戶，并指導用戶正確的操作方式。

4.5 UI設計要體現出簡潔性

移動互聯網終端需要最大程度上滿足用戶的需求，并為客戶提供更為便捷的使用過程。所以，這也導致在設計過程中，要盡量遵守簡潔性。簡潔的界面設置、功能可以為用戶提供更為高效化的服務，并且還可以降低用戶出現錯誤操作的概率。例如，將不同界面的開始與結束位置固定下來，不能隨意對其進行更改；在設置功能鍵的時候，需要盡量簡單明了、并且還需具有統一清晰的特點[10]。

4.6 充分發揮出藝術設計的特點

UI設計其本身是一種藝術設計，所以，需要將藝術設計的特點盡可能的發揮出來，基于此來設計出更加具有創新特點的作品，以此來迎合用戶對于移動互聯網的審美需求以及天然存在的好奇心理。例如，可以將界面上的書籍設計為竹簡形式，提高作品的視覺傳達效果，同時還可以為用戶營造出一種豐富、濃郁的文化氛圍。

總結

綜上所述，我國近幾年來的移動互聯網軟件產品UI設計得到了飛速的發展，并且呈現出多元化的發展態勢與迅猛的發展趨勢，并且打破了以往的互聯網所存在的局限性，設計出更加創新的應用空間，而這也正是我國的科技水平的一種體現。隨著時代的發展以及技術的不斷革新，UI設計需要不斷地進行創新，這樣才會更加符合時代的發展需要。

參考文獻

[1] 屈鵬， 周家會. 基于淺談UI設計在移動應用交互中的模式研究[J]. 現代婦女（下旬）， 2014（4）：328-328.

[2] 薛文峰.移動互聯網軟件產品中的UI設計研究[J].包裝工程， 2016，37（6）：45-48.

[3] 王真.移動互聯網金融App的UI界面設計及互聯網式推廣[D].河北：河北大學，2015.

[4] 徐亞非， 王勤勤. “互聯網+”時代下的UI設計發展趨勢[J]. 藝術科技， 2015（9）.

[5] 劉程程， 張凌浩. 移動互聯網時代手機服務型APP產品設計研究[J]. 包裝工程（12）：76-79.

[6] 朱長永，張欣，班乃明.移動互聯網產品的“外衣”——圖形化的界面設計（UI）[J].電腦知識與技術，2015（4）：214—215.

[7] 蔣飛燕. UI設計的交互性與界面視覺設計研究[J]. 美與時代（上）， 2019（5）.

[8] 饒衛民， 林道貴. 略談智能手機App開發中的UI設計技巧[J]. 電子測試， 2016（13）：41-42.

[9] 張藝弋. 移動互聯網UI設計中視覺界面的應用設計研究[J]. 藝術品鑒， 2019（2X）：312-313.

[10] 馮陽. 移動端智能手機軟件產品的UI設計研究[D]. 青島理工大學， 2016.

作者簡介：

賈麗娜，碩士，任職于武漢船舶職業技術學院計算機信息技術學院，工程師，研究方向：互聯網軟件。