- 相關(guān)推薦
扁平化設(shè)計需要遵從的原則
在網(wǎng)頁設(shè)計中,扁平化風(fēng)格的逐漸盛行固然有它的道理,但本質(zhì)上它只是設(shè)計美學(xué)當(dāng)中的一種;與仿古、高光、金屬質(zhì)感、木質(zhì)等視覺效果相同,對視覺風(fēng)格的選擇必須以良好的信息架構(gòu)及交互模式為基礎(chǔ)。以下是小編整理的扁平化設(shè)計需要遵從的一些原則,就跟隨百分網(wǎng)小編一起去了解下吧,想了解更多相關(guān)信息請持續(xù)關(guān)注我們應(yīng)屆畢業(yè)生考試網(wǎng)!
尤其在移動設(shè)備上,過于復(fù)雜的效果非但很少能為應(yīng)用吸引用戶,反而時常讓用戶在視覺上產(chǎn)生疲勞,對產(chǎn)品界面中最基本的功能產(chǎn)生認知上的障礙。因此我們在網(wǎng)頁設(shè)計中就需要參考“扁平化”的美學(xué)。
什么是扁平化設(shè)計
在實際當(dāng)中,“扁平化設(shè)計”一詞所指的是拋棄那些已經(jīng)流行多年的漸變、陰影、高光等擬真視覺效果,從而打造出一種看上去更“平”的界面。
網(wǎng)頁設(shè)計的好壞不是“美學(xué)”可以決定的
對網(wǎng)頁設(shè)計風(fēng)格的選取最終還是要取決于具體產(chǎn)品的實際情況。在我個人看來,相比于擬物化而言,扁平風(fēng)格的一個優(yōu)勢就在于它可以更加簡單直接的將信息和事物的工作方式展示出來,減少認知障礙的產(chǎn)生。
無論采用怎樣的風(fēng)格,優(yōu)秀的界面設(shè)計都需要遵從一些共通的設(shè)計原則:
一致性
通過具有一致性的設(shè)計模式及視覺風(fēng)格,為用戶建立起完整一致的心智模型,使產(chǎn)品更加易用,提升整體體驗。
對比
通過對配色、尺寸和布局的調(diào)整,使可點擊的界面元素在視覺上與其他元素形成鮮明的對比。
布局
可以嘗試使用960gs一類的網(wǎng)格布局為界面設(shè)定視覺規(guī)范,使用戶的視線可以跟隨內(nèi)容本身所界定出的路徑自然的移動,增強界面的視覺平衡。
層級化
最重要的東西要比相對次要的東西更容易被看到。關(guān)于這個話題我可以寫一整篇文章出來,簡單的說,就是在界面設(shè)計中著重突出那些與核心功能與常見用例相關(guān)的交互元素,而將其他操作元素置于次要位置,這可以使界面得到最有針對性的優(yōu)化和簡化。
“我個人的經(jīng)驗是,無論扁平化還是擬物化都沒什么所謂,最重要的是界面能夠讓用戶在最短的時間內(nèi)清楚的識別出信息和功能的層級關(guān)系,并且很容易的知道接下來應(yīng)該做什么。” – Caroline Keem
目標(biāo)用戶
不同類型的用戶所青睞的網(wǎng)頁設(shè)計的界面風(fēng)格也有所不同。建筑、設(shè)計、時尚等領(lǐng)域的用戶可以更好的擁抱扁平化風(fēng)格,而其他更加“普通”的用戶則更容易接受相對傳統(tǒng)的擬物化界面。
反饋
當(dāng)點擊行為發(fā)生時,要立刻向用戶提供清晰明確的視覺反饋。動畫過渡效果就是一種比較常見的反饋方式,例如在用戶執(zhí)行操作后,使用旋轉(zhuǎn)圖標(biāo)提示用戶系統(tǒng)正在進行響應(yīng)。
降低“摩擦力”
無論采用怎樣的網(wǎng)頁設(shè)計視覺風(fēng)格,都要使界面盡量簡化,減少用戶完成目標(biāo)所需執(zhí)行的操作,打造更加流暢的交互體驗。任何一點障礙或額外的步驟都會提高操作成本,增加功能的復(fù)雜度,進而降低轉(zhuǎn)化率。
鼓勵探索
了解目標(biāo)用戶有可能對產(chǎn)品進行哪些方面的探索。一旦他們習(xí)慣了產(chǎn)品的界面與基礎(chǔ)功能,并開始向“高級用戶”的階段進發(fā)時,要為他們的探索和學(xué)習(xí)行為進行必要的指引與“獎勵”回饋。
原型
無論風(fēng)格如何,界面形式都取決于實際的功能。好的網(wǎng)頁設(shè)計方案離不開產(chǎn)品前期的規(guī)劃工作,特別是通過草圖或線框原型進行的探索。識別出最核心的用例需求,使用原型不斷嘗試和驗證,為接下來的網(wǎng)頁界面設(shè)計工作打下堅實的基礎(chǔ)。
【扁平化設(shè)計需要遵從的原則】相關(guān)文章:
社會工作者考試制定學(xué)習(xí)計劃要遵從的原則06-18
簡潔的網(wǎng)頁設(shè)計原則04-23
2017薪酬設(shè)計原則06-28
設(shè)計的一般原則教學(xué)設(shè)計06-22
教學(xué)板書設(shè)計原則04-23
移動網(wǎng)頁設(shè)計原則06-14