- 作(zuò)者:admin
- 發表時(shí)間(jiān):2015-09-25 18:10:12
- 來(lái)源:未知
讓我們一起看下扁平化設計(jì)和(hé)Material design是怎樣入場(chǎng),并為(wèi)我們帶來(lái)了怎樣的設計(jì)趨勢的。
更輕量的設計(jì)
是什麽
放棄了使用漸變或陰影(yǐng)等效果,現在App中更流行(xíng)使用“扁平化設計(jì)”風格,給人(rén)一種“更輕”的體(tǐ)驗。這意味着設計(jì)師(shī)要善于利用負空(kōng)間(jiān)(指物體(tǐ)和(hé)物體(tǐ)的間(jiān)隙)——來(lái)取代漸變、陰影(yǐng)等效果,以創造一個(gè)更加簡潔的界面,讓用戶的注意力可(kě)以集中在界面的核心信息上(shàng),将對用戶無效的設計(jì)元素去掉。
為(wèi)什麽
更輕的設計(jì)将多(duō)餘的設計(jì)元素去掉,這樣可(kě)以讓用戶的眼睛隻注意對他們有(yǒu)意義的信息上(shàng),這樣也降低(dī)了用戶在該界面的導航成本,同時(shí)也使品牌更具時(shí)尚感。
統一字體(tǐ)
是什麽
減少(shǎo)不同種類字體(tǐ)的使用更能體(tǐ)現排版美學。與其用不同的字體(tǐ)形式表現不同的特性——比如,斜體(tǐ)、加粗、半加粗,不同的字号更能将不同部分的內(nèi)容加以區(qū)别。
為(wèi)什麽
在整個(gè)App中隻是用一款字體(tǐ)可(kě)以為(wèi)品牌帶來(lái)一緻性的感受,這種效果是跨平台的,比如App,移動端網站(zhàn)、PC端網站(zhàn)。因此,優化移動端的設計(jì)細節是可(kě)以全方位提升用戶體(tǐ)驗的。同時(shí),用戶更喜歡統一的字體(tǐ)帶來(lái)的簡潔化。
卡片和(hé)留白
是什麽
過去,我們使用線條來(lái)将不同的內(nèi)容主題或分類明(míng)顯地劃分開(kāi),但(dàn)是這些(xiē)線條卻創造出一個(gè)笨拙的擁擠的界面。取而代之,我們可(kě)以将不同的內(nèi)容放置于不同的卡片塊兒上(shàng),使用空(kōng)白将不同內(nèi)容塊劃分開(kāi),這樣我們就可(kě)以騰出空(kōng)間(jiān),搭建一個(gè)幹淨的界面。
為(wèi)什麽
分界線的棄用是為(wèi)了帶來(lái)一個(gè)具有(yǒu)現代感的外觀,使用戶注意力集中在功能性上(shàng)。比如,我們放大(dà)圖片和(hé)字體(tǐ)的大(dà)小(xiǎo),這樣一來(lái),視(shì)覺體(tǐ)驗更加清晰,産品易用性也得(de)到了提高(gāo)。利用空(kōng)間(jiān)來(lái)取代分界線是一個(gè)順應用戶使用習慣的選擇。
聚焦數(shù)據
是什麽
因為(wèi)用戶傾向于使用更加簡潔的界面,所以利用大(dà)字号和(hé)醒目的顔色來(lái)顯示具體(tǐ)的數(shù)據可(kě)以使用戶的注意力更加集中。可(kě)以通(tōng)過高(gāo)亮數(shù)據來(lái)吸引不同的目标客戶。
為(wèi)什麽
利用更大(dà)的字号或者一種流行(xíng)色,來(lái)吸引用戶的注意力到一個(gè)屏幕的一個(gè)特定區(qū)域——這完全不會(huì)給用戶帶來(lái)強迫感。所以,用戶可(kě)以更快地接收到有(yǒu)效信息,導航和(hé)閱讀信息的體(tǐ)驗也會(huì)更好。
微交互
是什麽
微交互在使用場(chǎng)景中是一個(gè)很(hěn)小(xiǎo)的用戶體(tǐ)驗的改變。這些(xiē)場(chǎng)景包括完成一個(gè)交易,收藏喜歡的物件或者彈出一個(gè)消息。這些(xiē)交互都是很(hěn)細節的,但(dàn)是産品的差異性就在于給合适的用戶使用合适的效果。
為(wèi)什麽
這些(xiē)微交互像是信号一樣驅動這用戶去完成一項任務——比如調試設置——創建一個(gè)新的內(nèi)容彈出窗口。有(yǒu)微交互的那(nà)些(xiē)App可(kě)以給用戶帶來(lái)更簡潔、更有(yǒu)趣、更有(yǒu)參與感的感覺。
用更少(shǎo)的顔色
是什麽
在2013年扁平化設計(jì)推出後,在主題中使用更少(shǎo)的顔色變成了一個(gè)流行(xíng)趨勢,這樣可(kě)以使設計(jì)變得(de)清晰和(hé)簡潔。所以,設計(jì)師(shī)和(hé)用戶都更喜歡顔色更少(shǎo)的設計(jì),以求一個(gè)更幹淨的外觀。
為(wèi)什麽
顔色的運用在表達情緒、引導用戶注意力、品牌深化上(shàng)都有(yǒu)着重要作(zuò)用。采用更少(shǎo)的顔色能更容易突出品牌特性。另外,用戶也喜歡這樣美觀的界面,關鍵元素可(kě)以被輕易突出,導航體(tǐ)驗也更好。
分層界面
是什麽
過去,界面設計(jì)遵守拟物化的原則,就是模拟一個(gè)物體(tǐ)的真實形态(比如,數(shù)字日曆對紙質日曆的模仿,App圖标的3D縱深,手機快門(mén)的咔嚓聲等等)。現在,扁平化設計(jì)已經不再采用這一原則,它使産品設計(jì)者可(kě)以用新的方式展示縱深效果——分層設計(jì),可(kě)以更好地體(tǐ)現出縱深和(hé)規格化的感覺,為(wèi)用戶提供一種更直觀的體(tǐ)驗。
為(wèi)什麽
扁平化設計(jì)最終導緻的結果可(kě)能是“過于扁平”——随着設計(jì)越來(lái)越簡化,用戶還(hái)怎麽被引導和(hé)吸引,畢竟這和(hé)他們在3D現實世界裏的經驗并不一緻(或者說和(hé)過去的産品體(tǐ)驗也不一緻)?分層提供了将一個(gè)條目放在另一個(gè)之上(shàng)顯示的可(kě)能,它充分利用了Z軸。分層和(hé)增加深度可(kě)以幫助用戶理(lǐ)解不同條目之間(jiān)的關系,并且把他們的注意力吸引到你(nǐ)需要他們關注的地方。
幽靈按鍵
是什麽
幽靈按鍵是指沒有(yǒu)被填上(shàng)顔色的透明(míng)按鈕。它們有(yǒu)着非常細化的邊緣,并且形狀往往很(hěn)基礎,比如矩形、正方形或者直角、軟化邊緣等。這些(xiē)按鈕中的文字往往很(hěn)簡單且很(hěn)小(xiǎo)。
為(wèi)什麽
這些(xiē)設計(jì)得(de)很(hěn)微妙的按鈕可(kě)以吸引用戶注意力,而且看上(shàng)去還(hái)很(hěn)幹淨、時(shí)髦、不會(huì)惹人(rén)煩。它使你(nǐ)可(kě)以在屏幕上(shàng)放置更多(duō)層級的按鈕,如果在同一頁面上(shàng)有(yǒu)不同的按鈕,你(nǐ)可(kě)以根據優先度排列他們(比如那(nà)些(xiē)提供選項的或作(zuò)為(wèi)中間(jiān)步驟的幽靈按鈕)。在一些(xiē)Materialdesign的情況下,你(nǐ)可(kě)以通(tōng)過陰影(yǐng)來(lái)提示用戶某一按鈕所屬的層級和(hé)優先度。
手勢
是什麽
随着用戶設備集成了陀螺儀和(hé)動作(zuò)傳感器(qì)的功能,它能夠更好地感知動作(zuò)。有(yǒu)了這些(xiē),用戶和(hé)設備之間(jiān)的交互方式從鼠标點擊拓展到了真實手勢上(shàng)。
為(wèi)什麽
用戶對一些(xiē)手勢有(yǒu)着出于直覺的敏感。當要删除某個(gè)條目時(shí),不管哪個(gè)年齡段哪個(gè)性别的用戶都會(huì)試圖把它移出屏幕。事實上(shàng),更少(shǎo)的點擊和(hé)更多(duō)的滾動可(kě)以提升用戶體(tǐ)驗,通(tōng)過用手勢在屏幕定位而非點擊目标可(kě)以讓你(nǐ)的應用看上(shàng)去交互性更強。
動作(zuò)
是什麽
通(tōng)過軟件創新,設計(jì)師(shī)現在可(kě)以利用樣式表控制(zhì)運動。基于動作(zuò)的設計(jì)元素能夠以多(duō)種多(duō)樣的形式呈現,包括過渡、動畫(huà)效果甚至模仿3D效果的紋理(lǐ)。設計(jì)中對動作(zuò)的使用可(kě)以幫助用戶接觸和(hé)吸收內(nèi)容,這和(hé)以往通(tōng)過數(shù)據和(hé)對象來(lái)突出內(nèi)容重要性的方式已大(dà)有(yǒu)不同。
為(wèi)什麽
動作(zuò)元素能夠将用戶注意力吸引到一個(gè)明(míng)确的區(qū)域——或者把他們的注意力從那(nà)兒移開(kāi)。通(tōng)過視(shì)覺響應,它可(kě)以增進用戶對內(nèi)容的理(lǐ)解,并促使用戶産生(shēng)一種愉快的體(tǐ)驗。
更短(duǎn)的使用流程
是什麽
相比通(tōng)過複雜的頁面介紹如何使用産品,一個(gè)簡單的界面就可(kě)以幫你(nǐ)省去教育用戶的麻煩,并且減輕你(nǐ)投入到App上(shàng)的不必要的時(shí)間(jiān)和(hé)精力。例如,當用戶完成前面的字段輸入後,一個(gè)表單可(kě)以自動打開(kāi)或突出後續的輸入區(qū)域,以此提示用戶後續操作(zuò)。
為(wèi)什麽
手機用戶更喜歡在一個(gè)App中簡潔、快速地完成操作(zuò),尤其在他們忙碌的時(shí)候。根據人(rén)們的這個(gè)需求,在設計(jì)上(shàng)縮短(duǎn)用戶的使用流程,這可(kě)以增加轉化率以及人(rén)們打開(kāi)App的頻度。
設計(jì)标準:實踐是真
是什麽
設計(jì)标準是從項目啓動之初就注入其中的視(shì)覺語言,它涉及到顔色、圖标和(hé)整體(tǐ)風格的設定等。
為(wèi)什麽
設定設計(jì)标準可(kě)以幫助産品在不同平台上(shàng)形成更好的統一體(tǐ)驗。它能将産品投入市場(chǎng)後可(kě)能産生(shēng)的錯誤壓到最低(dī),并使其在未來(lái)更易于被修正。
原型設計(jì):實踐是真
是什麽
原型可(kě)以是對一個(gè)産品的演示,也可(kě)以是早期的可(kě)上(shàng)線版本。使用原型能夠提供一個(gè)更直觀的視(shì)角去觀察産品功能設計(jì),以及産品想要讓人(rén)看到的充滿亮點的更新,這可(kě)以提升用戶體(tǐ)驗而不必浪費設計(jì)師(shī)太多(duō)時(shí)間(jiān)和(hé)精力。
為(wèi)什麽
通(tōng)過創造這些(xiē)低(dī)成本的“試驗品”,可(kě)以方便地厘清項目的關鍵因素,包括功能特征和(hé)需求等。它留給我們必要的時(shí)間(jiān)和(hé)資源從“試驗品”了解産品,用內(nèi)部驅動的過程推進産品叠代