熊 昭 （武漢工程大學(xué) 430000）

論界面設(shè)計中的扁平化設(shè)計現(xiàn)象

熊 昭 （武漢工程大學(xué) 430000）

“扁平化設(shè)計”一詞開始在界面設(shè)計中頻繁出現(xiàn)，這種設(shè)計風(fēng)格更是逐漸被廣泛運用。扁平化設(shè)計并不單單只是一種簡單的設(shè)計風(fēng)格，它通過簡潔理性的界面編排、扁平的界面層級、多運用幾何造型元素以及溫和的平涂式色彩搭配，來達(dá)到操作更加簡易、生動、直觀的效果。用戶操作時軟件的功能性更夠得到更好的體現(xiàn)、使用過程更加簡單流暢、操作反饋也更加清晰直接，極大的降低了用戶操作上的認(rèn)知學(xué)習(xí)成本，從而達(dá)到更好的用戶體驗。正因為扁平化設(shè)計的這些獨特優(yōu)勢和造型美感，使得它逐漸在交互設(shè)計中占據(jù)主導(dǎo)趨勢，成為界面設(shè)計中的主流設(shè)計風(fēng)格。

扁平化設(shè)計；界面設(shè)計；用戶體驗；交互

扁平化設(shè)計是近年來視覺傳達(dá)設(shè)計領(lǐng)域中出現(xiàn)的一種新的設(shè)計風(fēng)格，在界面設(shè)計中更是被廣泛運用，成為一種新的設(shè)計潮流。扁平化設(shè)計相比擬物化設(shè)計，除去了界面中一些繁瑣的設(shè)計因素，崇尚簡約，平面化的表現(xiàn)形式，在現(xiàn)代快節(jié)奏生活中，更易被人們欣賞和接受。

一、對扁平化設(shè)計理念的認(rèn)識

過去界面設(shè)計就一直在強調(diào)交互的易操作性和優(yōu)質(zhì)的用戶體驗，扁平化設(shè)計的出現(xiàn)，是對這些設(shè)計目標(biāo)的總體概括。它不僅是一種簡約的設(shè)計風(fēng)格，更是一種設(shè)計理念：讓內(nèi)容能夠更加直接的呈現(xiàn)，以更低成本實現(xiàn)功能作用，同時讓用戶獲得更加良好的用戶體驗。運用簡潔、直接的的方式將信息和事物的工作方式展示出來，減少用戶認(rèn)知障礙。扁平化的界面設(shè)計，是以用戶為中心的設(shè)計原則的必要要求，也是當(dāng)代主義的集中體現(xiàn)。

1.扁平化設(shè)計成為交互設(shè)計主流風(fēng)格的原因

扁平化對于互聯(lián)網(wǎng)而言意味著兩個詞：快速，突出。時間就是金錢，快速同時代表更低成本的運作。扁平化設(shè)計的界面,能夠在短時間內(nèi)完成更新，也方便再更新。其次在大數(shù)據(jù)時代下，信息突出是網(wǎng)站取勝的關(guān)鍵。扁平化的界面設(shè)計通過把重要的信息放在首要位置，弱化其他次要元素，讓用戶的注意力能夠集中放在產(chǎn)品和重要信息上，而不會被網(wǎng)站界面上的其他設(shè)計元素干擾。達(dá)到突出核心信息和操作的目的，網(wǎng)站的易用性和可用性大大增強。

對于用戶而言在一個布局簡潔邏輯清晰扁平化設(shè)計網(wǎng)站里，能夠快速完成自己的需求，自然也就能夠得到良好的用戶體驗。越復(fù)雜的界面設(shè)計，提取信息的時間就越長，用戶的注意力會被繁瑣的交互形式分散，華麗的界面元素過多也會造成用戶的閱讀和使用障礙。而使用清晰直觀的扁平化界面，大腦提取和轉(zhuǎn)換信息所用的時間會大大減少。

二、扁平化界面設(shè)計的特點

實現(xiàn)扁平化界面的可用性，首先需要清楚了解整個交互層級之間的結(jié)構(gòu)，在用戶能夠快速又準(zhǔn)確的找到交互對象的前提下，再去實現(xiàn)界面的美觀性。所以扁平化界面設(shè)計不僅只是界面設(shè)計風(fēng)格上的變化，更是一種思維邏輯層面的提升。

1.形式結(jié)構(gòu)簡易化

整個交互過程中，最重要的就是界面的結(jié)構(gòu)設(shè)計，可以界面結(jié)構(gòu)就是交互的基礎(chǔ)。而界面布局和界面層級是界面結(jié)構(gòu)的基本，可以看做界面結(jié)構(gòu)中縱橫的兩個層面，這兩者之間的邏輯是否合理，直接影響著用戶的操作。所以簡易化界面層級之間的形式結(jié)構(gòu)，讓用戶能夠更加直接的進(jìn)行操作，降低用戶操作中的錯誤率，這是扁平化設(shè)計最核心的目標(biāo)。

2.界面布局簡潔化

界面中的布局指的是將界面中的各種設(shè)計元素，根據(jù)需求及其之間的聯(lián)系進(jìn)行合理的排列組織。扁平化界面的基本是布局簡潔，同時定位好元素之間的主從關(guān)系，這樣界面中的重要功能能夠直接凸顯，以便于用戶能夠更迅速準(zhǔn)確的獲得信息。

3.界面層級扁淺

為了是用戶能夠快速完成需求，扁平化界面設(shè)計中應(yīng)盡量避免界面之間不必要的切換。盡可能的把低層級信息合并上移，減少不必要的界面層級的劃分。只有層級越少，用戶才會覺得是方便的好用的。這就要求在一個層級中需要顯示更多的內(nèi)容，所以核心功能一定要著重突出，這樣界面才更加針對性也更加便捷。

4.功能表達(dá)簡便化

互聯(lián)網(wǎng)技術(shù)發(fā)展的同時界面上也誕生了更多的功能，五花八門的功能讓用戶難以直接判斷其真實作用，我們稱這種現(xiàn)象為“認(rèn)知摩擦”。好的界面設(shè)計一定要最大程度減少認(rèn)知摩擦，讓用戶可以直觀準(zhǔn)確的了解界面中不同功能的作用，節(jié)省操作時間。所以，扁平化的界面設(shè)計要根據(jù)用戶的慣性去設(shè)計功能，從用戶行為模式出發(fā)做設(shè)計，同時操作方式要簡易。

5.操作反饋明晰化

用戶在APP或者網(wǎng)頁上操作時反饋一定要及時并清晰。這是用戶衡量自己操作的標(biāo)準(zhǔn)。及時，正面的反饋信息可以幫助用戶更加合理的操作，例如可以防止用戶錯誤或無意刪除一些他們本身不想刪除想內(nèi)容。如果反饋不夠及時，那么及時這個網(wǎng)站或者APP的界面設(shè)計多美觀，動效多生動，功能多強大，也還是會造成不好的用戶體驗。以至用戶粘性降低，最終造成用戶的流失。因為清晰及時的反饋信息在整個交互設(shè)計里都是至關(guān)重要的。

三、如何在界面設(shè)計中合理運用扁平化設(shè)計

一些偉大的設(shè)計中所運用的“形式跟隨功能”和“少即是多”的理念依然是我們今天還在談?wù)摵蛯W(xué)習(xí)的。扁平化設(shè)計要求設(shè)計師必須清楚的知道設(shè)計對象最本質(zhì)，最重要的功能。然后在設(shè)計里去合理的體現(xiàn)這點。

扁平化界面設(shè)計的前提是好的界面排版。排版是界面信息的具體展現(xiàn)方式，這就要求界面排版要具有視覺導(dǎo)向性，能夠更加有效地清晰地傳達(dá)信息。而扁平化界面設(shè)計的核心是交互層級，所以，優(yōu)秀的界面設(shè)計，既要做到層級扁淺有邏輯，還要做到頁面布局美觀功能設(shè)計合理。不能僅僅是為了簡單而扁平化，而是為了更優(yōu)質(zhì)的用戶體驗而扁平化。

所以優(yōu)秀的扁平化界面設(shè)計，界面的排版布局一定不能忽略，也就是要協(xié)調(diào)好界面中的圖形、色彩、文字等內(nèi)容，只有合理分配好它們，整個界面布局才能做到既簡潔美觀，同時還具有一定的視覺導(dǎo)向性。做到扁平化的視覺和交互設(shè)計相融合。

1.色彩

“色彩一定要酷點再酷點”。扁平化設(shè)計幾乎都是平涂色彩，沒有光影的立體效果。因為少了些質(zhì)感，所以顏色的運用變得更加重要。而色彩之間是否和諧在扁平化界面設(shè)計中尤為重要，扁平化設(shè)計中的色彩大多給人鮮亮、強撞色的印象。高飽和度的色彩，往往更容易吸引人，給用戶強烈的視覺沖擊。同時不管在什么樣的背景前，高飽和、鮮艷明亮的色彩都能不被背景掩蓋。也正是因為如此，在扁平化界面中通常鮮亮的色彩中所包含的信息或代表的功能，就是界面要傳遞的主要信息和主要功能。

2.圖形

在扁平化界面設(shè)計中，通常使用基本形簡單明確的圖形，取代以往的具有仿真效果的有機圖形。這些基本形多由幾何形、曲直線條等組合形成。在圖標(biāo)設(shè)計上也采用更加精簡的方式表現(xiàn)，將圖形進(jìn)行概括提煉，用以簡潔的線條來展示，幾乎不具備裝飾性。這樣的表現(xiàn)形式去除或減少了多余的修飾，直接突出主題，用戶能夠更加關(guān)注內(nèi)容本身，而不被裝飾所打擾，視覺效果直接，功能清晰直觀，減少了用戶接受、適應(yīng)信息時花費的時間和精力。

3.文字

扁平化界面設(shè)計中的重要元素之一就是文字，合理使用能夠讓界面整體的編排更加簡潔。扁平化的界面在編排過程中，應(yīng)最多使用兩個系列的字體，通過改變文字的大小、粗細(xì)以及形態(tài)來區(qū)分內(nèi)容的主次，例如大小字號、段落以及文字特別的排列組合等，使頁面主次信息一目了然，同時兼具節(jié)奏感。正因為文字的這些特性，在扁平化設(shè)計中使用基本的設(shè)計手法就可起到保持頁面的簡潔和準(zhǔn)確傳遞頁面信息的作用。

4.具體案例分析

Windows 8的主要界面風(fēng)格就是典型的扁平化界面設(shè)計，其實從2006年起，微軟的應(yīng)用軟件就以經(jīng)開始使用這種設(shè)計風(fēng)格。相比之前的Windows7，不僅減少了頁面之間的跳轉(zhuǎn)，同時在主界面上直接添加了用戶經(jīng)常使用的工具，以更清爽的排版和突出重點來方便用戶使用。把這些工具全部集中擺放在開始界面上，圖標(biāo)采用方形外輪廓，加以高度凝括的圖形和純色填充，給用戶直觀，醒目的視覺感受。用戶使用也更加方便快捷，直接通過開始界面，就可以進(jìn)入到一些常用應(yīng)用，相比之前的版本減少了操作流程節(jié)約了時間，不在需要需要分別點開不同的工具和子菜單才能看到。微軟的這一設(shè)計靈感源于美國華盛頓州的巴士站牌、機場和地鐵的指示牌設(shè)計，它采用大量醒目的字體，以次吸引受眾注意力。微軟認(rèn)為扁平化的設(shè)計原則應(yīng)該是“光滑、快、現(xiàn)代”。而這也正是當(dāng)下現(xiàn)代設(shè)計的一種趨勢。

如今的微軟產(chǎn)品，會越來越多的出現(xiàn)更多這種“扁平化”的設(shè)計風(fēng)格，而少見傳統(tǒng)的Windows視窗界面。其實不僅僅只是微軟，我們可以看到越來越多的界面設(shè)計、APP設(shè)計都在運用扁平化的設(shè)計風(fēng)格，這種以文字為主的界面導(dǎo)航，功能圖標(biāo)高度凝括、摒棄多余裝飾的界面設(shè)計。

四、結(jié)語

扁平化設(shè)計用一種簡潔明了，卻又十分吸引用戶注意的方式，實現(xiàn)了對界面設(shè)計的革新。扁平化的界面設(shè)計中，用戶能夠清楚直接的獲得信息，能夠快速的完成操作目標(biāo)，達(dá)到最優(yōu)質(zhì)的用戶體驗。扁平化設(shè)計不單單只是做減法的設(shè)計，它傳遞的是一種“少即是多”的設(shè)計理念。在扁平化設(shè)計中，看似簡單的圖形，單調(diào)的色彩，單一的字體加以組合設(shè)計，卻能夠比那些花哨的設(shè)計更具視覺沖擊和視覺導(dǎo)向性。這種設(shè)計的優(yōu)勢顯而易見，它能夠快速、準(zhǔn)確、清晰的完成用戶需求，實現(xiàn)界面設(shè)計為提升用戶體驗而服務(wù)。

[1]開源中國.深入探討扁平化設(shè)計[EB/OL].（2013-07-10）[2014-03-07].

[2]馬娜娜.簡潔而不乏味——淺談扁平化界面設(shè)計[J].大眾文藝，2013（16）：137—138.

[3]視覺中國.扁平化設(shè)計的色彩選擇[EB/OL].（2013-04-28）[2014-03-07].

[4]張蕓.扁平化設(shè)計在網(wǎng)頁應(yīng)用上的優(yōu)勢[J].藝術(shù)科技，2013（6）：229.

[5]楊帆.基于扁平化的界面設(shè)計美學(xué)思想的探討[J].藝術(shù)科技，2014（1）：59.

熊昭（1995.07- )，女,湖北大冶人，民族：漢族，武漢工程大學(xué)藝術(shù)設(shè)計研究生在讀，學(xué)歷：研究生在讀，研究方向：數(shù)字媒體設(shè)計，作者單位:武漢工程大學(xué)。