何謂扁平式設計
標簽：
網頁設計
2017.03.30
扁平化設計 (Flat Design)這種簡約的設計手法在近幾年可說是常見的作法。
Flat Design 設計的UI元素，都是以以色塊，排版間距來構建，如再搭配響應式網頁設計 (Responsive Web Design)，用戶在呈現頁麵上的帶來相容於各尺寸的屏幕無差別體驗，當然此款設計不僅單在網頁資料編排技術上，無謂在APP、係統操作平台，目前也廣為被應用，以下是在扁平化設計 (Flat Design)設計上需要注意的幾項原則：
1. 讓各元素簡易
在頁麵上的按鈕、資料區塊、操作UI介紹，都是以簡約的方型、圓(yuan)型(xing)來(lai)做(zuo)設(she)計(ji)，並(bing)且(qie)邊(bian)則(ze)以(yi)圓(yuan)角(jiao)或(huo)以(yi)正(zheng)型(xing)方(fang)式(shi)來(lai)呈(cheng)現(xian)，且(qie)讓(rang)每(mei)個(ge)元(yuan)素(su)區(qu)塊(kuai)的(de)功(gong)能(neng)淺(qian)顯(xian)易(yi)懂(dong)，需(xu)過(guo)瀘(lu)掉(diao)以(yi)往(wang)設(she)計(ji)繁(fan)雜(za)的(de)操(cao)作(zuo)感(gan)，盡(jin)可(ke)能(neng)做(zuo)到(dao)直(zhi)覺(jiao)、且立即互動的用戶體驗。
(圖1)簡約色塊的設計，總是會讓人的視覺感到舒適穩定的感覺，且資料呈現上無過多的累贅。
2. 使用微量的特效
當然設計要從簡，但總不能簡到像看報紙文案的枯燥乏味，這樣子我想會願意細細品嚐的用戶，可能少之又少，以下CRISP SALADWORDS網站就使用HTML5內嵌影片，加上適量在操作元素作動態呈現，讓用戶在瀏覽網頁時增加更多樂趣。
3. 配色及排版
Flat Design 設計的UI元素，都是以以色塊，排版間距來構建，如再搭配響應式網頁設計 (Responsive Web Design)，用戶在呈現頁麵上的帶來相容於各尺寸的屏幕無差別體驗，當然此款設計不僅單在網頁資料編排技術上，無謂在APP、係統操作平台，目前也廣為被應用，以下是在扁平化設計 (Flat Design)設計上需要注意的幾項原則：
1. 讓各元素簡易
在頁麵上的按鈕、資料區塊、操作UI介紹，都是以簡約的方型、圓(yuan)型(xing)來(lai)做(zuo)設(she)計(ji)，並(bing)且(qie)邊(bian)則(ze)以(yi)圓(yuan)角(jiao)或(huo)以(yi)正(zheng)型(xing)方(fang)式(shi)來(lai)呈(cheng)現(xian)，且(qie)讓(rang)每(mei)個(ge)元(yuan)素(su)區(qu)塊(kuai)的(de)功(gong)能(neng)淺(qian)顯(xian)易(yi)懂(dong)，需(xu)過(guo)瀘(lu)掉(diao)以(yi)往(wang)設(she)計(ji)繁(fan)雜(za)的(de)操(cao)作(zuo)感(gan)，盡(jin)可(ke)能(neng)做(zuo)到(dao)直(zhi)覺(jiao)、且立即互動的用戶體驗。
(圖1)簡約色塊的設計，總是會讓人的視覺感到舒適穩定的感覺，且資料呈現上無過多的累贅。
2. 使用微量的特效
當然設計要從簡，但總不能簡到像看報紙文案的枯燥乏味，這樣子我想會願意細細品嚐的用戶，可能少之又少，以下CRISP SALADWORDS網站就使用HTML5內嵌影片，加上適量在操作元素作動態呈現，讓用戶在瀏覽網頁時增加更多樂趣。
3. 配色及排版
當然在顏色在 Flat Design 設計中是很重要的一環，使用色彩配合主題、風格、產業別來呈現不同類型的元素，凸顯元素間的區隔性，色係使用上則以不接近純色為主的柔性色彩。
