扁平化設(shè)計(jì)與可訪問(wèn)性
這幾年互聯(lián)網(wǎng)變化好多,我們?cè)诰W(wǎng)上瀏覽的方式也一樣。在本文中,我們將看一下最近扁平化設(shè)計(jì)帶來(lái)的可訪問(wèn)性提升以及使得互聯(lián)網(wǎng)或多或少更開(kāi)放和可用性。
什么是扁平化設(shè)計(jì)?
實(shí)際上,扁平化設(shè)計(jì)意味著在設(shè)計(jì)中不使用常用的漸變、像素完美的陰影,然后通常是近年來(lái)蔓延的用來(lái)實(shí)現(xiàn)看起來(lái)“平面”的用戶界面。
Layervault的Allen Grinshtein或許最初定義了“扁平化設(shè)計(jì)”。在一篇發(fā)表于HackerNews的文章中,他說(shuō):
“網(wǎng)頁(yè)中廣受歡迎的產(chǎn)品通常都有一些類似的設(shè)計(jì)美學(xué),比如一些立體、內(nèi)陰影、外陰影等。對(duì)設(shè)計(jì)師來(lái)說(shuō),他們會(huì)以實(shí)現(xiàn)這種“媚俗”的界面而感到自豪。但對(duì)我們,對(duì)其它的少數(shù)設(shè)計(jì)師來(lái)說(shuō),這樣做很2。。。“
~ Allan Grinshtein (Layervault)
如果你去看Layervault,它的美在于其簡(jiǎn)潔,甚至沒(méi)有任何我們作為設(shè)計(jì)師常常會(huì)去挖空心思實(shí)現(xiàn)的額外的細(xì)節(jié)設(shè)計(jì)。了解和琢磨作為當(dāng)前趨勢(shì)來(lái)使用的漸變和其它樣式是件蠻有趣的事情,這些慢慢在變化~~
扁平化設(shè)計(jì)實(shí)例
在新版Squarespace網(wǎng)站中,他們選擇了一個(gè)幾乎完全扁平的界面, 你可以估算出它們花在原型和設(shè)計(jì)UI上的時(shí)間,這個(gè)界面相當(dāng)復(fù)雜,但是卻非常易用。
盡管我只看過(guò)而從來(lái)沒(méi)有自己用過(guò)LayerVault,新的扁平化UI看起來(lái)真的很簡(jiǎn)潔易用。
Facebook幾乎一直擁抱扁平化設(shè)計(jì)美學(xué)——只是最近才加入一些輕微的立體化。
“Facebook是一個(gè)扁平化設(shè)計(jì)趨勢(shì)的完美例子。它們的主要操作按鈕依然使用輕微的立體化,但大量的次要按鈕采用了完全的扁平化設(shè)計(jì)。而且依據(jù)事實(shí)判斷,它們從未改變過(guò)界面風(fēng)格,它一直是這樣的。“
~ Ian Storm Taylor (Segment.io)
盡管它們?cè)谶^(guò)去這些年一直被批判要大改它們的界面,它依然是網(wǎng)上被使用最多的網(wǎng)站之一,嗯,用戶是不會(huì)錯(cuò)的。。。
最新的Rdio的界面亦是如此扁平和極簡(jiǎn),它幾乎完全沒(méi)有陰影、漸變、甚至是顏色。。。
在Nest上
本文地址:http://m.pkvc.cn/tutorial/ui1366.html
您可能還喜歡
- 經(jīng)典網(wǎng)頁(yè)配色方案之無(wú)色系
- 對(duì)齊!框框框!ps中對(duì)齊和參考線詳解
- banner實(shí)戰(zhàn)技巧-版式平衡構(gòu)圖
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏大視
- 如何成功運(yùn)用扁平化設(shè)計(jì)與色彩趨勢(shì)
- 做有思想的網(wǎng)頁(yè)設(shè)計(jì)-banner實(shí)例講解
- [圖趣]色彩搭配的核心原則和聯(lián)想
- 扁平化設(shè)計(jì)與可訪問(wèn)性
- 網(wǎng)頁(yè)設(shè)計(jì)專題技巧淺析
- WEB設(shè)計(jì)中的排版
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問(wèn)題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏