比較 Material Design 和 iOS 7 設計風格，他們各自的優缺點是什麼？

01-18

從2011年開始，Google開始重視設計，經過4年左右的努力，在2014年，Google推出了其全新的設計語言Material Design。

Material和iOS的規範出來很久了，現在才回答他們倆的差異可能有點晚。不過近日重溫了這兩套規範，發現了它們倆的一些突出差異點，與樓主分享一下。

個人認為，如果說ios是清新日本妹子，那麼Material就是火辣歐美女郎。兩者之間有三個突出的差異點：

1.Z軸空間

Material，顧名思義是「材質」的設計。代表的材質是「紙張」，由此衍生出卡片（Cards）／紙片（Chips）等組件。
由於取材於現實世界，Material很講究反應出組件之間的（物理世界）層次關係，典型代表就是投影（Z軸）的運用。通過控制元素的投影來反映其海拔高度，z值（海拔高度）越高，元素離界面底層（水平面）越遠，投影越重。

iOS非常扁平化，在iOS上很少看到多層不同海拔高度的元素層疊在一起，最多是兩層例如Actionsheet，或者是用於舉列項目的提醒事項（Reminders），很少看到頁面上的元素本身是有處於多個不同海拔高度的。
iOS的的層疊具有半透明效果（磨砂玻璃），Material則是不允許層次之間相互穿透。

即使是天氣這種元素之間有遞進關係的app，iOS的處理方式也非常扁平——上一層元素停靠在屏幕頂部，下一層元素上滑時消失於分界線，元素之間沒有明顯的Z軸關係。

2.動畫

Material強調動畫要貼近真實物理世界，所有的動畫都與現實生活有關聯，具體形象指示性強（但過多的動畫難免會顯得繁瑣低效）。例如，點擊任意的元素，都應伴隨著水波漣漪的動畫效果；界面切換的過渡動畫中，對象會放大縮小變形摺疊（Material的材質特性），或者發生Z軸的變化（例如進入二級頁面時，二級頁面沿Z軸上升浮起伴隨有投影效果）。

iOS強調以內容為主，動畫乾淨利落，不作過多的修飾（以免分散用戶注意力）。淡化（Fade）、推擠（MoveIn）、揭開（Push）、覆蓋（Reveal），結合進出的方向（上下左右），就構成了iOS最常用的過渡動畫。
當然，iOS也有一些擬物化的動畫，用於增強直接操作的感覺，但使用的地方並不廣泛，往往是用於特定類型的app（例如ibook的翻頁動畫）或是圖標之間的變換。遊戲另當別論。

3.配色

Material提倡在大片區域使用醒目、高飽和度的色彩以表達應用的張力，尤其是主要操作按鈕以及組件（如開關），特別需要用到對比度強烈的強調色。
Material建議基礎色的飽和度為500（use the 500 color of the primary color of your app），其他元素以此為基準調整飽和度，而主操作則配以強調色反（或作補色）。

iOS並沒有提倡用使用低調或鮮明的顏色，它只希望設計師們用色時要注意溫柔細膩的質感。選擇一種顏色作為基準色後，需要確保應用中的其它顏色不會與它發生衝突（更別使用補色了）。這樣的例子隨處可見，例如系統自帶的calendar，應用以紅色為基準色，每個組件、界面都是紅燦燦的，我們不會在這裡看到任何綠色（補色）的元素。

總而言之，我無法直接評論iOS與Material孰優孰劣，兩者風格迥異的，即使是小細節摳出來也不能單純地做出優劣評判，因為它們的設計思路本身已經決定了細節。只能說，iOS扁平簡潔，Material貼近真實世界。

回答的拙劣，請多多指教。

附：

iOS設計規範－UIKit Framework Reference

Material設計規範－Introduction

ios7出來對新人入行的技術門檻降低了…

apple做了個漂亮ui，但只倡導扁平設計風格。而google也是做了套漂亮的ui，但試圖讓所有設計開發者去使用它。

相比之下我認為apple的做法更高明一些，官方規範只是一些簡單介紹，沒做約束，包容了如paper by 53、yahoo news digest之類的漂亮應用。相反google給我的感覺是希望安卓的所有app都是MD的ui，這樣安卓的設計將鮮有創新。

從用戶的角度來說，Material Design明顯比IOS HIG漂亮，交互更是強出幾條街，IOS HIG粗暴的底攔、按鈕簡直讓人無力吐槽，我一直認為iPhone比較偏女性化、老年化的手機。

ios7不是很熟悉，只說說material design吧，material design主要標誌著Google想要建立一個整體的生態系統，想要將Android手機，chrome筆記本，Google穿戴設備，Google auto，甚至以後的其他設備融為一體，採取統一的設計標準，統一的界面風格（個人很喜歡新的風格，論壇里反應也很好）。當然，具體的細節我不是搞開發的不太懂，缺點也很明顯，Android對軟體的審核不像蘋果那樣，每個軟體都得通過審核才能上市，這也就是說，這個設計語言雖然推出了，但是設計者完全可以不鳥你，現在太多的Android應用還是直接吧蘋果的那一套搬過來，根本沒針對Android進行設計，更不用提使用新的設計語言和方式了。當然，比較靠譜的軟體廠商肯定還是會去支持material design的，畢竟這是Android的一次在外觀方面的革新，意義非凡，是google美學的一次新的突破。

MD對視覺更有衝擊力，色彩更鮮明。flat design個人感覺搭配蘋果的工業設計很符合。不過我還是更喜歡MD一點，帶一點未來感！

根據 @馬豐冊回答整理

只談談material design

1、Z軸的存在可以表現更多的效果，表現更多的信息結構。

對Z軸的運用好的不多，像FAB、toolbar 這些本身很難運用，做得太凸顯，容易搶眼，影響關鍵信息的獲取，做的太弱，存在感得不到運用。

陰影的運用，陰影的存在讓許多在iOS上不好表現的形式，在android上有了很好的表現，卡片式的布局比許多線狀的嵌入式的表達方式更加優雅。

2、設計與控制項的配合，能提高開發效率

假如能完全依照MD來做的話，開發效率是極高的。各種控制項都是全套的，不需要重複造輪子，然而大部分業務都需要定製，導致其實完全運用MD是比較難的。

3、簡約的設計形式

MD給人的感受是容易理解，不易混淆。相比iOS各種嵌入式的效果，MD從理解上比ios容易，能較好的分辨哪些可點擊，哪些是可操作。當然這也需要設計師理解到位才能設計的簡約

4、過於簡單的結構容納不了複雜的業務需求

中國的應用，包括國人的習慣，能在一個應用上幹完所有的事是最好的，這導致很多應用其實需要較多的流量入口以及轉化率，然而md沒有底部導航的方式，導致許多業務形式得不到展開。

Material Design在我看來是講究色彩和動畫之間的碰撞帶來的美感，而iOS Design則是為了讓用戶操作更加方便的感覺，同時也比較講究色彩。

從以上來講，Material Design的優點就是較iOS Design更為美觀，但多數情況下沒有那麼方便，比如說側邊欄的拉出沒有低欄那麼直觀。

（2）app應用
在已下載的253個app，歸納了以下四種形式：
包含搜索框
包含標籤
包含logo
包含分段控制項
1）包含搜索框
操作控制項加搜索框，多用於搜索需求優先順序較高的頁面。與搜索欄的區別是，搜索欄不包含管理當前頁面的操作控制項。
操作控制項加多個標籤，一般不多於3個，若多餘三個可以考慮另設標籤欄。
2）包含標籤
3）包含logo
4）包含分段控制項
http://985.so/bzECU

谷歌的這種設計過於強調模擬現實，目前安卓機質量各式各樣，是很難做到的，比如動畫，各種投影，ios的規範相對比較模糊，更加強調內容本身，個人建議在設計的時候提煉出兩個適合自身app的特點進行設計是最好的。

Material Design 在動畫和交互上是遠遠優於 ios的，這裡Z軸的效果就明顯體現出來了。什麼過渡啊滑動啊都非常有感覺，各種形狀之間的變換很漂亮。手機用起來會超爽。

不過靜態的時候，大家不覺得就算有Z軸，一堆單色塊堆一起看久了很單調么？靜態還是喜歡ios的毛玻璃+細白線和UI的風格，非常漂亮也非常耐看。