淺探扁平化風格在網頁界面設計中的應用

李立欽 劉潤乾

摘 要：現如今信息網絡技術的日趨發達對于網頁界面設計提出了更高的要求，而以Windows8系統為代表的扁平化風格引領了網頁界面設計領域的全新潮流。本文簡要分析了網頁界面扁平化設計的主要原則，從網頁界面排版布局、網頁界面圖形配色等兩個層面入手，探討了扁平化風格在網頁界面設計中的具體應用，以供參考。

關鍵詞：網頁界面設計;扁平化風格;排版布局;圖形配色

引言

扁平化風格實則是后現代主義理念的延伸，將簡約、經濟設定為設計的核心關鍵詞，強調設計應當追求簡潔化與人文主義風格，將一切多余、繁復的裝飾予以刨除，杜絕渲染與特效，將產品的功能直觀的呈現給受眾，提高信息的識別性與存儲能力，更適用于當前信息爆炸時代現代人的信息獲取需要，符合現代人的審美需求。

一、網頁界面扁平化設計的主要原則

（一）一致性原則

扁平化設計的核心理念便是追求內容與形式的整體扁平化設計，確保能夠在設計樣式方面保持一致性，優化用戶的使用體驗，引導用戶在點擊界面時能夠構建相同的心智模型，深化用戶的理解[1]。

（二）對比性原則

扁平化設計并不意味著視覺效果的單一，相反追求借助色彩的和諧配比增添界面的層次感與濃度，確保能夠將不同按鍵進行有效區分，引導用戶在使用的過程中能夠一目了然的掌握其內容要義。

（三）用戶需求性原則

扁平化設計的最終目標便是滿足用戶需求，為差異性用戶群體提供多元化選擇，以此來滿足絕大多數用戶的共性要求，進而借助其細節設計擴展用戶需求的覆蓋面積，進一步贏得用戶的喜愛。

二、扁平化風格在網頁界面設計中的具體應用

（一）在網頁界面排版布局中應用扁平化風格

作為現代計算機領域不可或缺的一部分，網頁設計主要依托視覺效應將語言向受眾進行傳導，借助排版、布局等方面的差異化設計實現用戶視角的巧妙轉變，為用戶視覺體驗的豐富貢獻了有效價值。因此我們可以立足于現代人需求角度，在網頁界面排版布局中應用扁平化風格，使視覺設計更好的為用戶提供服務。具體來說可以從以下兩方面入手：

一方面從排版布局角度入手，主要需在版面、欄目、導航、標識等方面運用扁平化設計。具體來說，應當注重在排版時將首頁標識與導航進行合理排布，通常在主視覺區內應當放置首頁的標識，這樣可以使用戶點擊網頁時一目了然的明確網頁的大體內容方向，還要注重針對導航內容進行精簡化設計，確保能夠使用戶在最短時間內捕捉到導航的不同功能，選取自己所需要的服務。在面積較大的板塊中，還可以適當結合用戶需求創設部分具有獨特趣味性的內容，使用戶在點進網頁時注意力能夠第一時間被吸引。在進行欄目設計時，通常需要將網頁中涵蓋的主體內容進行概括整理，確保在欄目中突出核心內容，在用戶點進網頁時能夠剛好與用戶需求相符合，賦予用戶以直觀形象的體驗感。在進行首頁標識設計時，通常應將標識排布在界面的左上方位置，便于用戶最短時間內查找到自身所需要的內容。在進行導航設計時，應當基于便捷角度進行導航設計，確保將導航放置在醒目位置，并將其中的一些漸變、陰影等效果去除，確保色彩簡潔、飽和度適中，并添加相應的指示說明，以此確保用戶能夠最短時間內尋求到導航標識，查詢到其所需信息。

另一方面從內容與效果層面入手，應當強化內容在網頁界面設計中的主體性地位，依據用戶需求與注意力進行內容的選擇，確保內容的實用性突出，能夠滿足用戶的知識獲取需求，還要針對主要內容的文字部分進行特殊區分，以此更好的使用戶明確重點，提升網頁的實際使用效率。在進行網頁的視覺效果設計時，應當注重圖片與動畫的選擇，盡量減少繁瑣的裝飾，在圖片設計上也要兼顧整體的簡約風格，使用戶一目了然的明確內容主旨。還應當注重交互性動畫的設計，借助簡潔的點、線等圖形將內容、圖片或視頻信息進行大體展示，以便進一步提高用戶在使用過程中的便捷性。以IOS系統中的網頁界面設計為例，該系統主要使用ultra light作為頁面字體，其無襯線設計既具有時尚感又優化了頁面視覺效果，行距的恰當設計以及文本與圖片位置的巧妙排布給人以較強的舒適感體驗，深受用戶的青睞。

（二）在網頁界面圖形配色中應用扁平化風格

除整體網頁界面的排版布局之外，還可以從圖形、配色等細節層面進行扁平化風格的有機運用。

其一從圖形角度入手，相較于如今網絡環境中大量充斥著的具有仿真效果的圖形形態而言，扁平化風格的圖形通常只運用了圖形的基本形態，例如將幾何形、直線、曲線等圖形進行排列組合，以此來構建簡潔直觀的界面風格。以Mac系統的界面設計為例，其圖形設計便顯著運用了扁平化元素，界面共包含放大鏡、書本、鉆石、靶心、國旗等八個圖形元素，以深色圓形為底，線條簡潔、勾勒清晰，摒棄了繁雜的裝飾，圖像更具簡潔性與凝練性[2]。雖然其圖形設計較為簡潔，但設計難度也相應加大，要求設計者在生活中選取不同素材，將事物的圖形特點進行高度凝練的概括，借助明確主題還原圖形所傳遞出的符號意義，從而更好的給予用戶以直觀的使用體驗，使用戶的時間與精力得到有效節約。

其二從配色角度入手，通常扁平化設計在色彩使用上都運用了平涂手法，摒棄了借助光影手段塑造的立體感，注重界面的簡約潔凈感。以Windows8系統為例，該系統的界面便運用了扁平化的色彩設計風格，雖然所選用的色調差異小，但其層次感與搭配感卻極為豐富，在同一界面中運用了MOCHA、TAUPE、TAN、CAMEL、OLIVE等色調，整體色彩飽和度較低但層次分明，并無過多淡化、柔化效果，進一步營造了舒適的畫面體驗。

結論

總而言之，在當前大數據時代，人們每天都要接受大量龐雜的數據信息，飽受信息量膨脹問題的困擾，相應也催生了人們對于簡潔、高效視覺呈現效果的追求。扁平化設計便依托其顯著的簡約風格，依靠簡化形式、濃縮功能的性能優勢贏得了現代人的喜愛與接受，未來還應著重從情感傳遞、審美效果等層面入手進行相應的調整與創新，從而更好的實現對人們動態需求的有效滿足，進一步提升扁平化設計效果。

參考文獻

[1]陸原.淺談界面設計中的“扁平化”現象[J].南京藝術學院學報（美術與設計），2014，（6）：213-216.

[2]廖騰峰，陳靜.淺談扁平化設計在移動終端界面設計中的優勢[J].中國設備工程，2016，（11）：112-113.

（作者單位：大連工業大學藝術與信息工程學院藝術設計系）