扁平化風格在網(wǎng)頁界面設(shè)計中的應(yīng)用

楊曄

摘要：扁平風格設(shè)計在現(xiàn)代計算機設(shè)計領(lǐng)域中被廣泛的應(yīng)用，隨著融合了扁平化設(shè)計的Windows8系統(tǒng)發(fā)布之后，在大多數(shù)網(wǎng)站設(shè)計中，逐漸開始應(yīng)用到扁平化設(shè)計這一設(shè)計風格。本文根據(jù)現(xiàn)代網(wǎng)頁設(shè)計中的主要發(fā)展趨勢，將扁平化設(shè)計風格在其中的應(yīng)用以及效果進行詳細的分析。

關(guān)鍵詞：扁平化；網(wǎng)頁界面；設(shè)計；應(yīng)用

扁平化設(shè)計風格在現(xiàn)代網(wǎng)頁設(shè)計中屬于新型的風格設(shè)計類型，主要是將原本網(wǎng)頁中較為擬物化的界面轉(zhuǎn)變?yōu)椤捌健钡慕缑妫@種界面在形式上更加簡單，能夠幫助用戶將思路變得更為明晰，使用戶在進行使用的過程中，能夠高效快速的進行辦公類活動。

一、扁平化風格的基本概念

（一）基本概念

扁平化設(shè)計的基本概念是：追求一種扁平化內(nèi)容，將原本流行多年的透視、紋理、高光等一切有關(guān)于擬真視覺效果的內(nèi)容轉(zhuǎn)變，應(yīng)用顏色幫助用戶實現(xiàn)交互內(nèi)容，排除原本的陰影、羽化、漸變等效果，使界面整體變得干凈利落，突出信息的本身內(nèi)容。

（二）設(shè)計原則

（1）一致性。為了改善用戶的體驗，幫助服務(wù)的更加易用性，采用一致性的設(shè)計形式，讓用戶在使用的過程中，能夠建立起相同的心智模型，保證用戶的快速理解。

（2）對比。色彩等方面的配比能夠幫助用戶將界面中的按鍵和感官中的按鍵進行區(qū)分，將不同的色彩進行渲染，保證用戶在使用的過程中，能夠直接明了的了解內(nèi)容。

（3）布局。在布局上幫助用戶的感官產(chǎn)生平衡的感覺，采用簡單的布局設(shè)計，讓用戶能夠直接進行相關(guān)內(nèi)容的查詢，引導(dǎo)用戶跟隨設(shè)計所指定的路線進行搜尋，使其最大限度的簡潔化。

（4）減少摩擦力。創(chuàng)造用戶的通暢體驗就需要降低用戶實現(xiàn)目標所用的時間和環(huán)節(jié)，所以，在設(shè)計的過程中，不論哪種類型都進行簡潔化的設(shè)計。

（5）用戶需求。用戶需求會根據(jù)不同的類型選擇，多元化用戶的選擇風格自然是多元化的，時尚領(lǐng)域中的用戶可能對扁平化風格的簡潔較為喜愛，而在普通大眾的眼中，這種風格設(shè)計與原本的傳統(tǒng)風格有著較大的差異，用戶可能并不會全部適應(yīng)。

二、扁平化風格在網(wǎng)頁設(shè)計中的運用

網(wǎng)頁設(shè)計在現(xiàn)代計算機領(lǐng)域中是較為重要的一項設(shè)計內(nèi)容，其不僅能夠在視覺上幫助語言的傳導(dǎo)，更能夠根據(jù)排版的不同和布局的不同來轉(zhuǎn)變用戶的視覺視角，使用戶在使用的過程中，能夠產(chǎn)生視覺特效的感覺。為了能夠更享受視覺特效，排版布局的合理性成為了主要設(shè)計的內(nèi)容。

（1）布局排版。扁平化設(shè)計在進行排版的過程中，需要將首頁的標識和導(dǎo)航首先進行編排，一般會將首頁的標示選在主要的視覺區(qū)，導(dǎo)航等內(nèi)容也盡可能的實現(xiàn)簡化的設(shè)計，圖片在設(shè)計的過程中，一般會在大面積的排版內(nèi)，將一些用戶覺得有趣的內(nèi)容進行放置，保證在用戶進入主面時，能夠直接看到感興趣的內(nèi)容，幫助用戶進行更為快捷的活動。

（2）內(nèi)容組織。扁平化風格在設(shè)計的過程中，并不是將設(shè)計的內(nèi)容也變得簡單，而是將設(shè)計的內(nèi)容主要的核心突顯出來，在新的設(shè)計風格影響下，網(wǎng)頁的設(shè)計還需要將內(nèi)容作為主體，不論外觀多么吸引用戶的視覺，但在內(nèi)容的設(shè)計上，還需要進行更深層次的考慮，保證網(wǎng)頁的內(nèi)容能夠有效的將用戶的注意力吸引過來。

（3）網(wǎng)頁欄目。網(wǎng)頁欄目主要是將網(wǎng)頁中的一些主要的內(nèi)容進行歸納，將網(wǎng)頁中的一些核心的內(nèi)容首先突出的顯示出來，保證在用戶進入網(wǎng)站之后，能夠直接將自身需要找尋的內(nèi)容看到，方便用戶的直觀體驗。

（4）交互性動畫。交互性動畫在主要指的是，在鼠標停住在圖片或者視頻上時，能夠直接將視頻或者圖片中所包含的信息顯示出來，另外，還有一種是點、線之間的交互設(shè)計，通過鼠標的拖動將點、線構(gòu)成多樣化的圖形內(nèi)容，在邏輯的層面上，極大的減少了繁瑣的層次，使用戶在使用時，能夠更加簡潔快速。

（5）首頁設(shè)計。一般在用戶進行瀏覽網(wǎng)頁的過程中，首先進入的是網(wǎng)頁的首頁界面，在這一過程中，設(shè)計者需要保證首頁界面能夠第一時間將用戶的視覺停駐，讓用戶在瀏覽的同時，找尋到自身所關(guān)注的內(nèi)容。

（6）標識設(shè)計。標識設(shè)計主要在網(wǎng)頁中的特定位置，一般情況下將其放置在網(wǎng)頁的左上方，為了更加方便用戶的尋找，這也是大多數(shù)的網(wǎng)頁的設(shè)計方式。

（7）導(dǎo)航設(shè)計。在進行導(dǎo)航設(shè)計的過程中，首先考慮的使用戶的使用方便性，為了防止用戶在使用過程中，產(chǎn)生迷路的情況，在設(shè)置導(dǎo)航功能的時候，要將導(dǎo)航的位置選在明顯的地方，同時，還要將導(dǎo)航中的一些漸變的效果去除，將簡單的色彩作為主要的使用背景，并將導(dǎo)航的說明附加其上，這樣就能夠幫助用戶最快的識別導(dǎo)航的標識。

（8）文本設(shè)計。為了讓使用者在使用的過程中，能夠?qū)⒂杏玫男畔⒖焖俚奶釤?，在設(shè)計這些內(nèi)容時，需要將實用性放在首位，通過扁平化設(shè)計的風格，將網(wǎng)頁主要內(nèi)容中的文字區(qū)域進行特殊的區(qū)分，這樣才能有效的幫助用戶分辨選擇的內(nèi)容，從而提升了使用的效率。

（9）圖片設(shè)計。這一部分的設(shè)計也能夠主要突出網(wǎng)頁中的重要內(nèi)容，選用圖片能夠直接影響到網(wǎng)頁的瀏覽效果，越是全新的設(shè)計風格類型，越能夠吸引用戶的眼球，在扁平化風格的影響下，能夠讓設(shè)計的內(nèi)容變得簡單有效，通過極少的裝飾內(nèi)容來進行設(shè)計，不僅能夠?qū)D片設(shè)計的內(nèi)容突顯出來，更能夠節(jié)省用戶的找尋時間，快速的幫助用戶提升辦公活動速度。

三、扁平化風格在網(wǎng)頁設(shè)計中的效果分析

（一）效果分析

扁平化風格設(shè)計的使用，能夠讓用戶在信息層面上將應(yīng)用的過程簡化，一定程度上幫助系統(tǒng)更為流暢的運行，傳統(tǒng)的設(shè)備運行的過程中，會因為有些資源不能使用同一軟件進行設(shè)定而出現(xiàn)下載多軟件的情況，極大的降低了設(shè)備運行的速度。而扁平化風格設(shè)計在使用的過程中，能夠有效的將設(shè)計的內(nèi)容簡單化，信息資源在進行多層次的表現(xiàn)時，沒有多余的內(nèi)容，直接由前一層轉(zhuǎn)移到下一層的信息中不用多余的操作就能將信息快速的瀏覽完畢。

（二）優(yōu)化設(shè)計

交互設(shè)計的方式要保證按鍵和圖片的表現(xiàn)更加簡單，和整體的搭配要協(xié)調(diào)，同時還要將各個頁面之間的跳轉(zhuǎn)變得指向性更加鮮明一些。在進行文字設(shè)計的過程中，選用文字的類型要更加突顯文字的線條感，使其在展現(xiàn)出來時，能夠更加飽滿。而在色彩的搭配中，需要將網(wǎng)頁設(shè)計的主要內(nèi)容體現(xiàn)出來，色彩要選用一些鮮明的進行填充，同時，還要保證輔助色的搭配，保證在選擇的過程中，能夠和主體內(nèi)容形成一種富有層次感的效果。

四、結(jié)論

扁平化設(shè)計風格主要是將原本的多元化的表現(xiàn)形式進行簡化，方便用戶體現(xiàn)的同時，也能考驗設(shè)計人員的表現(xiàn)能力，怎樣在簡潔的設(shè)計中找出突顯設(shè)計內(nèi)容的方式，成了現(xiàn)代設(shè)計人員主要思考的問題。

參考文獻：

[1]秦歲明，何夢楠.扁平化風格在網(wǎng)頁界面設(shè)計中的應(yīng)用[J].包裝工程，2015（3）.

[2]龔波.網(wǎng)頁界面設(shè)計的視覺要素探究[J].信息記錄材料，2018（3）.