Material Design是Google公司推出的Android系統(tǒng)的招牌設(shè)計,大家都非常熟知,這里不多解釋。Material,顧名思義是“材質(zhì)”的意思。這里代表的材質(zhì)是“紙張”,由此衍生出卡片/紙片等組件。

Material design非常重視信息層級和板塊之間的層級關(guān)系,典型代表就是投影的運用。由于Material Design經(jīng)常會在一個模塊中有兩層以上的信息疊加,通過元素板塊之間的投影關(guān)系來加大信息、板塊之間的從屬關(guān)系,這里信息離底層背景越遠,投影越重。

而flat design(扁平化設(shè)計)作為蘋果IOS7之后推出的改變整個設(shè)計趨勢的風(fēng)格。是如今就各公司普遍運用的。其風(fēng)格特點區(qū)別Material Design刪除了所有樣式,純粹的追求圖標之間的認知、字體和顏色等規(guī)范性。在信息上特點,很少看到2層以上的信息堆積在一起,一般最多就是兩層。


此外,它加速加載時間和高或低分辨率屏幕上看起來顯示一樣好,提供更加可靠的用戶體驗。正因為如此,降低了設(shè)計師的設(shè)計門檻,使我們可以更專注的投入設(shè)計本身,讓用戶體驗變得更容易。
在一些微交互上,Material強調(diào)動效要貼近真實物理世界,所有的動效都與現(xiàn)實生活有關(guān)聯(lián),具體形象指示性強(但過多的動效難免會顯得繁瑣低效)。例如,點擊任意的元素,都應(yīng)伴隨著水波漣漪的效果;界面切換的過渡動效中,對象會放大縮小變形折疊(Material的材質(zhì)特性)投影也會跟著發(fā)生變化。

iOS強調(diào)以內(nèi)容為主,動畫干凈利落,不作過多的修飾(以免分散用戶注意力)。淡化(Fade)、推擠(MoveIn)、揭開(Push)、覆蓋(Reveal),結(jié)合進出的方向(上下左右),就構(gòu)成了iOS最常用的過渡動畫。當然,iOS也有一些擬物化的動效,用于增強直接操作的感覺,但使用的地方并不廣泛,往往是用于特定類型的app(例如ibook的翻頁動畫)或是圖標之間的變換。游戲另當別論。

顏色方面,Material design提倡在大片區(qū)域使用醒目、高飽和度的色彩以表達應(yīng)用的張力,尤其是主要操作按鈕以及組件(如開關(guān)),特別需要用到對比度強烈的強調(diào)色。Material design建議基礎(chǔ)色的飽和度為500(參考https://material.io/guidelines/style/color.html#),其他元素以此為基準調(diào)整飽和度,而主操作則配以強調(diào)色反(或作補色)。

iOS并沒有提倡用使用低調(diào)或鮮明的顏色,它只希望設(shè)計師們用色時要注意溫柔細膩的質(zhì)感。選擇一種顏色作為基準色后,需要確保應(yīng)用中的其它顏色不會與它發(fā)生沖突(更別使用補色了)。這樣的例子隨處可見,例如系統(tǒng)自帶的calendar,應(yīng)用以紅色為基準色,每個組件、界面都是紅燦燦的,我們不會在這里看到任何綠色(補色)的元素。
結(jié)論,就我個人了解,現(xiàn)在各大公司都是雙端統(tǒng)一化(目的就是改變更換手機時也能讓用戶體驗上一致)。這樣既能省去設(shè)計師不必要的工作量,適配起來也更為簡單。至于哪些地方要按照安卓的來,優(yōu)先照顧哪部分用戶可以根據(jù)數(shù)據(jù)來看。同時,伴隨著2017年設(shè)計新趨勢的流行,扁平化開始向著半扁平的方向發(fā)展。陰影和漸變都開始出現(xiàn)在移動端的界面設(shè)計中,因此可見,兩種設(shè)計風(fēng)格并不是絕對化的。


