徐亞非

摘 要：隨著移動互聯(lián)網(wǎng)的普及，終端屏幕分辨率和用戶人機互動習慣的變遷，Web設計的流行趨勢正在發(fā)生重大的范型轉(zhuǎn)移。對于各行各業(yè)移動APP開發(fā)者來說，除了抓住用戶的剛需、痛點、高頻之外，還要讓前端和后端技術、用戶體驗、業(yè)務流程優(yōu)化變成不可分割的整體。所以對“互聯(lián)網(wǎng)+”時代下的UI設計發(fā)展趨勢的把控顯得尤為重要。

關鍵詞：“互聯(lián)網(wǎng)+”；UI設計；交互設計；扁平化風格；情感化交互；動態(tài)交互

“互聯(lián)網(wǎng)+”在2015年兩會上被強勢推出之后，僅6月份就有26家傳統(tǒng)行業(yè)涉足互聯(lián)網(wǎng)。上市互聯(lián)網(wǎng)企業(yè)總市值達到4.2萬億元，比去年增長6%，當前互聯(lián)網(wǎng)業(yè)務已經(jīng)成為拉動信息通信業(yè)持續(xù)增長的重要引擎。“互聯(lián)網(wǎng)+”正在成為一股強勁的風潮引領各行各業(yè)。同年4月，在“流量開放合作大會”上，工信部表示中國移動電話用戶累計達12.9億戶，4G用戶數(shù)目達1.78億。4G互聯(lián)網(wǎng)的寬帶性、多媒體性、實時性、易用性、交互性、個性、安全性、方便性等特性促使移動互聯(lián)網(wǎng)占據(jù)用戶大量的上網(wǎng)時間。以至于連傳統(tǒng)行業(yè)都不敢輕易放棄移動互聯(lián)網(wǎng)終端業(yè)務。所以UI設計的優(yōu)化和未來UI設計的發(fā)展趨勢也被自然而然地推向風口浪尖。總結“互聯(lián)網(wǎng)+”時代下的UI設計的發(fā)展趨勢有以下幾點：

1 延續(xù)扁平化風格特點

扁平化設計即無過多的裝飾效果和無用元素，邊界自然干凈利落。扁平化通常顏色飽和、界面美觀、簡潔、降低功耗、提高運算速度、方便用戶操作，使用戶迅速定位到目標功能，從而減少認知上的障礙。簡而言之，扁平化是利用最簡單有效的方式來展示和創(chuàng)造平面功能性的最大值。

完整的扁平化設計風格可以追溯到windows8的windowsUI，被Android系統(tǒng)關注，被IOS系統(tǒng)普及。但是，扁平化風格的根源可以追溯到瑞士國際平面主義風格。瑞士國際平面主義大師艾米爾·路德認為：視覺傳達設計應該在功能與形式之間尋求平衡，文字與版式設計既要有傳達信息的功能，也要傳達視覺審美意義，達到功能與形式的高度統(tǒng)一。所以扁平化設計把具象的形態(tài)抽象化、符號化，大圖文、大色塊的方格磁貼式界面設計。它具有較強的視覺張力，其簡潔明快的風格大膽舍棄了重陰影、重描邊、重浮雕及3D的設計手法，徹底跳出過去對擬真仿物的戀戀不舍，體現(xiàn)了數(shù)字化的形式美感，集中精力于清爽的排版和網(wǎng)格化布局，使布局簡潔、嚴謹，更能適應視覺時代、讀圖時代的需求。

例如，一直受業(yè)界尊重和用戶信賴的蘋果和以蘋果公司為代表的扁平化設計。蘋果是時尚、高科技的產(chǎn)物，用戶一直追逐它的獨特性系統(tǒng)、簡潔性設計語言。明亮的顏色搭配、清晰的對比度、規(guī)范化的線條、標準化字體、經(jīng)典顏色搭配和時尚優(yōu)雅，禪意十足的界面設計都在減輕用戶體驗的負擔，同時滿足用戶的審美需求。蘋果在中國手機通信市場不斷上升的份額證明扁平化將繼續(xù)成為“互聯(lián)網(wǎng)+”時代的發(fā)展趨勢。

2 情感化交互設計增加

由于科技的迅猛發(fā)展，UI界面設計逐漸轉(zhuǎn)變?yōu)閷浖娜藱C交互、操作邏輯、界面美觀和用戶體驗的多重設計。[1]美國著名設計師普羅斯曾說：“設計除具備美學、技術、經(jīng)濟三屬性之外，還包含第四個維度——人性”。[2]產(chǎn)品的美觀性、獨特性、交互性、“傻瓜操作”性、界面的美觀等都是設計應該考慮的點。高科技下的高情感交互設計不但要從整體上把控，而且要從各個模塊、頁面、流程上把控。無論從何處著手，設計師都繞不開用戶，真正的產(chǎn)品設計的過程是從用戶到用戶的過程。從用戶開始，考慮用戶的使用場景，把握用戶的情感，分析用戶的操作流程，把握用戶的感情訴求，清楚用戶使用中和使用后的心情。在把握好這個問題之后，下面要解決的就是怎么樣才能夠滿足上述的感情需求，產(chǎn)品中的哪些部分起了關鍵性的作用，哪些部分會違背和減弱情感需求，從而得出改進產(chǎn)品的方案。

包豪斯著名設計師夢合理·納基曾說：“設計并不是對制品表面的裝飾，而是以某一目的為基礎，將社會的、經(jīng)濟的、技術的、藝術的、心理的多種因素綜合起來，使其能納入工業(yè)生產(chǎn)的軌道，對制品的這種構思和計劃技術即設計。”[3]這里所說的工業(yè)生產(chǎn)同樣適用于“互聯(lián)網(wǎng)+”時代下的UI設計當中。移動互聯(lián)網(wǎng)的小屏幕迫使設計師去設計更大的控件來解決尋找按鈕的問題或者通過滑動交互的形式讓用戶快速定位到自己想要的內(nèi)容。

從整體上把控情感化需求比局部抓住用戶的情感要簡單。它只需要在準備產(chǎn)品之前奠定好情感基調(diào)即可，在整個產(chǎn)品研發(fā)的過程中不斷地改進以免發(fā)生偏離。從各個模塊、頁面、流程上的把控用戶需求比較復雜，需要注意的是各個模塊需求的總和大于整個產(chǎn)品情感化的需求。它不是簡單的相加。例如，上網(wǎng)有上網(wǎng)的需求、閱讀有閱讀的需求、看視頻有看視頻的需求、訂閱有訂閱的需求、下載有下載的需求。每一個情感化的增加都要符合用戶的操作狀態(tài)和使用環(huán)境。當我們還原用戶使用場景的時候要盡量做到開放性的思路。不但考慮用戶在使用某一應用時會出現(xiàn)什么樣的狀況，而且要考慮用戶在使用應用之前是什么狀態(tài)?？紤]用戶是有目的的使用還是隨便瀏覽。對于某些產(chǎn)品來說，從理清楚產(chǎn)品的需求到優(yōu)化設計到確定產(chǎn)品，這需要時間和交流，所以正確的交流也是很好地完成情感化設計的重要一環(huán)。

《原研哉的設計》一書中提到：“二十世紀是視覺時代，二十一世紀是觸覺時代”。越來越焦躁和懶惰的用戶沒有耐心在眾多的信息中不斷地點擊鼠標，篩選自己想要的內(nèi)容信息。他們更希望通過移動互聯(lián)網(wǎng)快速找到自己想要的內(nèi)容，定位到自己想要的目標，并隨時隨地把自己的新鮮事分享出去。但是傳統(tǒng)的網(wǎng)頁分成無數(shù)個tag和頁面讓用戶點擊選擇的設計已經(jīng)滿足不了當下的用戶。想要給用戶提供更流暢的上網(wǎng)體驗，需要提供高清的圖片、顯眼的搜索條、熱門的新聞，并且隱藏相似的選項、給出推薦或查看相似選項等效果來猜測用戶在不同場景下的心理活動。與隱蔽的按鈕和慢慢拖動的滾動條相比，用戶更喜歡用手勢和語言瀟灑的互動。盡情地享受高科技帶來的快感，這就需要大量地分析用戶需求，并對用戶需求做出情感化的設計，以滿足用戶的體驗。

3 動態(tài)交互設計增加

在互聯(lián)網(wǎng)剛剛興起的時候，網(wǎng)頁設計中充斥著擬物化效果和Flash動畫。設計師和用戶都認為擬物化的設計是美的設計。但是擬物化設計會增加網(wǎng)頁加載負擔，致使上網(wǎng)體驗不佳。隨著人們壓力的變大，生活節(jié)奏的加快，我們越來越覺得效率是第一位的。所以扁平化風格設計慢慢地取代了擬物化的設計，因為扁平化的設計占據(jù)更少的空間，加載的數(shù)據(jù)更少，用戶體驗更流暢，所以會被更多人選擇。調(diào)查顯示：“網(wǎng)絡加載的速度和用戶放棄等待的數(shù)量是呈幾何增長的”。即：速度越慢，放棄等待的人越多。扁平化風格的界面設計適應了上網(wǎng)的加載時間，但是扁平化風格的靜態(tài)設計是枯燥的。這時需要動態(tài)的設計來建構一個良好的交互環(huán)境，讓用戶融入其中，身臨其境。靈動的動態(tài)交互提升了人與界面、人與信息、人與機、人與人的連接。除了視覺上給用戶放松之外，還能有效地引導用戶操作界面，實現(xiàn)完美的體驗。

微軟Surface系列平板電腦的觸摸式操控更具有動態(tài)交互的特質(zhì)，這使得微軟的設計團隊將動態(tài)體驗作為設計的首要任務之一。20世紀美國最重要的平面設計大師之一索爾·巴斯將平面設計與電影結合，設計了多部電影片頭，被譽為動態(tài)圖形設計的開山鼻祖。微軟強烈的贊同索爾·巴斯的設計理念，讓動態(tài)的交互體驗融入靜態(tài)的UI設計之中。在這方面WindowsUI是最具創(chuàng)新性的，它促使我們仔細審視過去對UI設計的認識。微軟對UI流行趨勢的判斷和把握一直走在整個UI設計行業(yè)的前列，它的設計理念和方法也是最具創(chuàng)新性的。增加動效的方法就是增加視覺提示，快速一次性的動效也很容易被用戶察覺。靜態(tài)的界面和隨時準備響應的動態(tài)的交互形式給用戶帶來引人入勝的沉浸式交互體驗，從而緩解嘈雜的頁面。這無疑不是“互聯(lián)網(wǎng)+”時代的發(fā)展趨勢。

4 目的性更強

360董事長周鴻祎在創(chuàng)新研習社的演講中說：“所有的戰(zhàn)略都要歸結成從用戶角度出發(fā)，尋找一個需求，一定是中等以上的頻度、痛點、剛需。這個服務可以非常不起眼，但是它一定是對用戶有價值的”。[4]這就告訴我們將設計語言根植于中國傳統(tǒng)，要善用現(xiàn)代手法堆砌精髓進行提煉和詮釋。所以設計的目的性就變得尤為重要。換句話說設計的界面應為內(nèi)容服務。一個優(yōu)秀的icon和優(yōu)秀的界面設計可以成功地吸引用戶下載并嘗試使用一個產(chǎn)品。但是沒有很好的內(nèi)容，用戶會毫不猶豫地卸載。但相反，如果用戶有意無意之間發(fā)現(xiàn)很一般的APP，下載之后發(fā)現(xiàn)很實用，是用戶當前或?qū)肀仨毷褂玫臇|西，那么用戶會遷就界面設計的不美觀或體驗的不順暢。

信息化時代的UI設計和傳統(tǒng)的UI設計相比，就像工藝美術運動和包豪斯追求的現(xiàn)代主義類似。繁雜的設計元素堆疊，反而加重了對用戶體驗的干擾。試想當我們驚嘆一個APP界面設計的精美絕倫時，卻處于無限加載時的心情。用戶體驗順暢是用戶對于產(chǎn)品最基本的客觀心理訴求。這就要求UI設計師必須認真反思設計的初衷。我們發(fā)現(xiàn)用戶在使用產(chǎn)品時，其實就是獲取和處理各種信息。所以UI設計必須回歸到信息內(nèi)容上，以強調(diào)內(nèi)容為核心弱化次要元素，這樣用戶可以更快、更容易地獲取自己想要的信息，完全沉浸在內(nèi)容中而不是其他。包豪斯所倡導的現(xiàn)代主義運動是一種完全忽略情感化的設計，這一點在“互聯(lián)網(wǎng)+”時代下的UI設計中是行不通的。所以，只看內(nèi)容而不注重設計的產(chǎn)品也是失敗的產(chǎn)品。UI的美感和內(nèi)容是相輔相成，缺一不可的。

“互聯(lián)網(wǎng)+”時代下的UI設計除了簡約的視覺架構、情感化的用戶體驗、流暢的動態(tài)感受和強烈的目的性之外，還將全面開啟響應式布局，盡可能地用滑動代替點擊，越來越注重人機交互的順暢體驗，顏色上雖然與過去差別不是很大，但是更傾向于高保真色調(diào)。放大不失真的矢量圖形得到更廣泛的運用，引導頁的溫情回歸也將繼續(xù)溫暖著每一個瀏覽新產(chǎn)品的用戶。

參考文獻：

[1] 設計對消費者品牌認知的影響——以蘋果手機為例[Z].百度文庫.

[2] 李綱.非物質(zhì)界面設計[D].

[3] 黃娟.設計的反思——論實用原則在設計中的體現(xiàn)[J].美術大觀.

[4] 周鴻祎.剛需、痛點、高頻是一款好產(chǎn)品的六字真言；免費模式絕不是忽悠，而是羊毛出在豬身上[Z].銳度—IT時代周刊.

[5] 李亞男. UI設計中體現(xiàn)的符號學原理[J].藝術天地，2015：152.

[6] 王正林. UI設計的理念和方向：以WindowsUI為例[J].裝飾，2015（2）：138.

[7] 白雪. UI設計在產(chǎn)品設計中的應用研究[J].學研探索，2015：132.

[8] 林陽. UI設計中扁平化理念應用研究——創(chuàng)造平面功能化[J].藝術科技，2015：267.

[9] 任懷琎，周著.視覺UI設計——漫談信息圖形化[J].科技視界，2015（14）.

[10] 周鴻祎.互聯(lián)網(wǎng)好產(chǎn)品六字法則——剛需、痛點、高頻[DB/OL].品途網(wǎng)，2015-6-15.