基于用戶體驗的移動端UI設計研究

馬文杰+韓帆

【摘 要】本文以塑造良好的用戶體驗為基本理念，通過對具體案例進行分析，并結合平日設計實踐，總結出幾點以良好用戶體驗為導向的UI設計思路。從而打破了傳統UI設計重功能輕體驗的設計原則，使移動端UI設計更加“打動人心”，對基于用戶體驗的移動端UI設計具有指導作用和借鑒意義。

【關鍵詞】移動端UI設計；用戶體驗；情感化設計

中圖分類號：TP302 文獻標志碼：A 文章編號：1007-0125（2017）22-0218-02

隨著移動技術的迅猛發展，3G、4G等通信技術的廣泛應用，移動數字媒體技術迎來了空前的發展。在此背景下，手機等移動終端正逐漸改變人類的生活方式，無論是學習、閱讀，還是交際、購物，甚至是理財，都由最初的線下轉向了流行的移動終端。為了滿足用戶的需要，移動端各類APP的功能愈加豐富，但是，面對這些錯綜復雜功能，步驟繁瑣的操作，用戶常常無所適從。如何既可以合理容納APP中各類復雜的功能，便于用戶理解，又可以使操作更加便捷呢？設計合理且美觀的UI界面，無疑是一種有效的解決方式。所以如何讓用戶感受更加舒適的使用體驗應是當今移動端UI設計的重要研究方向。

一、何為“用戶體驗”

用戶體驗（User Experience，簡稱UE）是用戶在使用產品過程中對產品產生的直觀感受。這一概念是由20世紀90年代中期的一位用戶體驗設計師唐納德·諾曼提出的，并最早被廣泛認知。用戶體驗涉及的范圍很廣，大到一個城市公交車線路的規劃、展館內展區位置的安排、圖書館內導視系統的設計，小至屋內桌椅高度差的確定、數碼產品不同功能的按鈕位置的次序、網頁表單填寫后信息的反饋。從移動端UI設計來講，“用戶體驗”就是，用戶在使用一款移動端APP時的使用體驗，如它的頁面布局用起來是否方便？它的界面是否通俗易懂？它的整體界面用起來感覺如何？好的視覺體驗不僅可以吸引更多的新用戶，還能促使用戶二次光顧。因此可以說，好的“用戶體驗”可以帶來不可限量的商機。

二、多平臺移動端UI設計

UI即User Interface（用戶界面）的簡稱。UI設計是基于人機交互、操作流程、界面美觀的整體性設計，其中涉及的理論知識也是多種多樣，例如，用戶心理學、色彩心理學、設計學等。好的UI設計不僅可以滿足用戶對于數字媒體產品的視覺需求，同時也可以提升產品檔次，增強產品的識別度，還能使操作更加舒適、方便。隨著移動媒體的迅猛發展，移動端也向著多平臺化演變。移動端已不僅僅局限于手機、平板電腦，如蘋果公司于2014年9月發布的iwatch、谷歌公司于2012年4月發布的Google Project Glass等，這些設備也對UI設計提出了更高的要求，界面不僅是傳統的比例，一些傳統的界面設計原則也將不再適用。因此，對于移動端的UI設計進行深入研究勢在必行。

三、用戶情感因素對移動端UI設計的影響

說到用戶體驗，就要從用戶的情感因素出發，對產品界面進行策劃。凱文·凱利在《失控》中提到：“機器，正在生物化；而生物，正在機器化。”信息時代，人機交互逐漸代替人與人之間傳統的面對面交流，當人們不再面對面交流時，對界面的情感要求越來越高。優秀的移動端UI設計，應該從用戶體驗的表現層、框架層、結構層、范圍層、戰略層進行細致策劃，使產品可以與用戶產生“親切”溝通，與人的情感產生“碰撞”，使數字媒體產品不再是一個冷冰冰的“物”，而是一個更懂得用戶的“老友”。

充分考慮用戶情感因素的UI設計，可以為數字媒體產品帶來更多的商機，在用戶使用產品時，良好的情感化設計可以為用戶帶來更強的幸福感和更深的代入感。一次良好的用戶體驗，不僅可以吸引用戶二次光顧，還可以成為產品的傳播者，在這個人人都是自媒體的時代，每個人都具有強大的信息傳播能力，由于一次良好的體驗，會為產品帶來更多新的用戶。

四、如何通過移動端UI設計“打動人心”

隨著技術的不斷發展，數字媒體產品的開發周期越來越短，這就出現在同一類產品中存在多個品牌。如何從競爭中脫穎而出，除了增加新穎的產品功能外，能夠與用戶建立情感溝通的UI設計也是一個行之有效的方法。那么如何才能令移動端UI設計更能“打動人心”？

（一）提高用戶的操作效率。首先，提高用戶做出正確操作的幾率，減少不必要的操作，以最為簡潔的方式完成用戶的操作目的。其中最簡單的方法就是遵從用戶的操作習慣。由于大多數用戶在此之前都使用過各類軟件，從而形成一個習慣的操作模式。例如，“返回”按鈕大多在界面左上角，而一些拓展菜單則大多在界面右上角。由于長時間的操作習慣，在操作時，用戶會本能在左上角尋找“返回”按鈕。

其次，要減少用戶的點擊次數。如圖1所示，這是時下兩款流行的點餐軟件——餓了么和美團的點餐頁面，如果想要使用訂單查詢這一功能，由于美團導航頁位于界面下方，因此只需點擊一次，而餓了么則是抽屜式菜單，因此需要點擊兩次。雖然相比傳統導航，抽屜式導航更加節省頁面，但是也增加了用戶的操作次數，對一些不熟悉此功能的用戶造成了不必要的操作障礙，降低了用戶體驗。

最后，并不是所有用戶網絡狀況都良好，某些地方可能無法正常接收4G信號，這些用戶想要用有限的流量瀏覽一些圖片就會很困難，優秀的用戶體驗就應照顧到這一群體，如，再刷新一篇文章時可以先刷新出一些關鍵性的，或者占用流量較少的信息，而一些視頻圖片等需要占用大流量的信息則可以隨后刷出或者不刷新。

（二）降低用戶的犯錯幾率。每一個用戶在使用軟件時都會出現錯誤，如何減少用戶的犯錯幾率，或者給予錯誤一些挽回的方式，也會有效提高用戶體驗。例如，遵從用戶的使用習慣，降低界面的復雜度，就是一個有效且直接的方法。此外，在推出一個新功能時，簡潔明了的功能引導頁也是行之有效的方法，這些功能引導不但可以使有經驗的用戶盡快熟悉新功能，也可以讓一部分新用戶了解此軟件的操作方式。好的引導頁可以大大增加用戶的操作效率，提升用戶體驗。如圖2所示，由于產品加入一些新的功能按鈕和操作方式，因此在新版本更新后，打開軟件會出現一個使用說明類的引導頁。頁面介紹簡單明了，可以讓用戶快速了解新功能，避免操作錯誤，同時引導頁字體使用手寫體，更具親近感，在情感上拉近了產品與用戶的距離。

除了必要的引導頁，逃生按鈕也可以使操作界面更加“打動人心”。每一個用戶在操作時出現失誤是在所難免的，這時逃生按鈕就顯得至關重要，它可以使用戶撤銷此次操作，返回上一步重新開始。

（三）簡潔直觀的操作界面。用戶在認識一款移動端產品時，除了產品的具體功能，第一印象往往來自于產品的外觀。在進行界面設計前，應做好充分的市場調研，了解用戶的喜好和操作習慣。根據調研結果，選擇好一個產品的主色調至關重要，例如，商務型產品就應選擇穩重深沉的配色，而針對年輕人的產品，色調則應活潑，彰顯青春。當下各類移動端產品都找到一個屬于自己的品牌色調，如淘寶橙、美團綠、ofo黃，這些品牌色不僅符合此品牌的產品理念，同時也迎合了產品受眾的喜好，使用戶對該品牌留下了深刻的影響。有了一個合適的主色調，合理的界面布局也就必不可少。例如，手機是最常用的移動端設備，人們在操作手機時大多使用拇指，由于手的大小限制，手機界面操作的熱區大多集中在界面右下角，因此在界面設計時，就需要把主要功能、常用功能放入操作熱區，使大多數操作可以一手完成。

（四）為設計注入情懷。設計本身就是一項具有情懷的工作，“打動人心”的設計會在某些情感點上觸動用戶的內心。越來越多的用戶已不僅僅滿足于完善齊備的功能，更會在意移動應用背后的故事，產品的視覺設計是否可以引起共鳴。好的設計在策劃之初就會被注入情懷，在設計的同時，不光關注用戶的操作體驗，更要關注用戶的情感體驗。例如，時下火爆的音樂播放器網易云音樂，它在每首歌的下方設置了評論區，每一位聽到歌曲的人在評論區寫下自己的感悟，而這些感悟又會激起更多用戶的共鳴。此時這款產品不僅是聽音樂的平臺，更是寄托了無數用戶的情懷。

如圖3所示，這是一款照片編輯軟件，同時也可以制作屬于自己的明信片，就軟件本身的功能而言，就極具情懷，可以讓用戶輕松制作出具有藝術感的明信片，同時在界面設計上大量留白，刪掉了不必要的按鈕，使界面干凈清新，意味深刻，頗有佛家禪意。這樣別具一格的設計，令用戶眼前一亮，關注點不僅是產品本身的功能，更有產品為用戶帶來的情感觸動。

五、結語

UI設計在移動端的數字媒體產品設計中是關鍵的一環。面對技術的不斷更新、用戶需求的不斷提高，需要設計師在設計時關注用戶體驗，并基于用戶的情感因素，對設計進行修改與革新，以符合不同時期、不同用戶的需求。

UI設計的最終目的就是令用戶操作起來更加方便，其形式是區域簡潔化、實用化，在此基礎上注重設計的美感。照此趨勢，最終UI設計就是省去不必要的界面，讓用戶在體驗功能的同時享受快樂。

感謝以下項目支持：

江蘇省社科應用研究精品工程課題，17SYA-033。

江蘇省大學生實踐創新訓練計劃重點項目，201710300009。

參考文獻：

[1]周峰，李秀梅.以用戶體驗為導向的電商界面情感化設計[M].設計， 2015，（3）：122-123.

[2]肖施然.設計與用戶體驗[M].金田，2015（5）.

[3] 賀景衛，成文昊.以接受美學的角度探討用戶體驗設計[M].藝術科技，2015，（6）：11.

[4]趙森，王婷.如何提高網站的用戶體驗[M].城市建設理論研究（電子版），2011（14）.

[5]李雪蓮，楊真，許佳. c2c電子商務平臺用戶體驗設計研究[M].美術界，2013，（6）：102.

[6]羅毅.閉合用戶體驗研究[M].華東理工大學學報（社會科學版），2011，26（2）：111-116.