為什麼使用材料設計? 權衡利弊

已發表: 2022-03-11

五年多前推出的 Google 材料設計指南已成為其網站和基於應用程序的服務的標誌性外觀。 他們立即被識別為隸屬於谷歌,這對公司的品牌來說是一個福音。

Material Design 也被更廣泛的設計社區採用,現在可以在遠離谷歌原生平台的網站和應用程序上找到(甚至在競爭平台上)。 例如,Simplenote 在其桌面和移動平台應用程序中使用了 Material Design 美學。 這只是為什麼 Material Design 是各種設計實現的絕佳選擇的一個例子。

為什麼要使用材料設計
Simplenote 是基於 Material Design 的界面的一個示例,它在 Google 的原生平台之外使用。

什麼是材料設計?

Material Design 由 Google 於 2014 年創建,部分基於 Google Now 中使用的基於卡片的佈局。 對基於紙張的設計風格的認可使其與當時廣泛使用的平面設計風格區分開來。

與大多數設計系統一樣,Material Design 旨在為各種設備、平台和輸入法帶來統一的用戶體驗。 與 Apple 將扁平化設計原則作為標準實施的方式類似,Google 使用 Material Design 來確保無論用戶如何訪問他們的產品,他們都將獲得一致的用戶體驗。

Material Design 規範包括所有方面的指南:排版、網格、空間、比例、顏色和圖像。 但材料設計比僅僅告訴設計師如何讓事物看起來更進一步。 它使設計人員能夠在最終結果中創建具有層次結構、意義和重點的有意設計。

什麼是材料設計
Basil 的基於卡片的結構在很大程度上植根於 Material Design 的佈局指南。

為什麼使用材料設計?

與任何完善的設計系統一樣,設計師應該考慮使用 Material Design 的一些主要優點。

Material Design 實際上是一個完整的設計生態系統,而不僅僅是一組樣式指南。 如果存在潛在的設計情況,Material Design 可能有一套全面的規則來處理它。 這包括複雜的用例,這些用例往往被不太全面的設計系統所忽視。 對於想要這種結構的設計師來說,這可能是非常令人欣慰的。

Google 維護 Material Design 並保留了大量關於如何使用和實現它的文檔。 許多現代設計系統可能缺乏這種支持和文檔。

材料設計框架
Shrine 使用了許多複雜的佈局,包括基於卡片的產品頁面。

儘管有這些全面性和文檔,Material Design 仍然是一個相當靈活的設計庫。 在指南中,如何實現設計的許多細節完全由設計人員決定。

Material Design 更精細的優勢包括微妙的擬物化,這使它與平面設計不同,並使其對許多用戶來說更直觀。 另一個用戶友好的功能是,用戶反饋以觸覺反饋、微妙的動畫和類似的形式被內置到指南中。 它也具有非常簡化的物理意義,這使得交互更加直觀。

誠聘美國全職自由 UI 設計師

Material Design 建立在移動優先的敏感性之上,考慮到其最初的目的是設計 Android 應用程序,這是有道理的。 它還促進設計中的動畫,既用於用戶反饋,也用於暗示不同功能的功能。

最後,提供了深色主題選項,為設計師增加了更多的視覺靈活性。 最初,Material Design 非常輕巧明亮,與某些品牌的美學不符。 添加深色主題指南可解決該問題。

谷歌材料設計模式
Rally 在實現深色 Material Design 主題方面做得很好。

使用 Material Design 的缺點

雖然 Material Design 有非常明顯的優點,但這並不意味著使用它就沒有缺點。

首先,Material Design 可以立即識別,並且與 Google,特別是 Android 密切相關。 雖然這對每個人都不一定是壞事,但對某些人來說可能是負面的。

它可能是負面的一個重要原因是它在使用設計系統時限制了其他品牌的有效性。 是的,設計師可以結合徽標、調色板(在 Material Design 指南中)和其他差異化因素來支持品牌標識,但遵循 Material Design 規範的產品幾乎總是與 Google 相關聯。

由於動畫和動畫是在 Material Design 指南中推廣的,因此不包含它的網站或應用程序在用戶看來似乎缺少某些東西。 人們將Material Design的運動特性與視覺特性聯繫起來,可以讓設計不缺乏運動。

當然,一種解決方案是始終在遵循 Material Design 規範的設計中加入運動。 但大量動畫在移動設備上可能會佔用大量資源,從而導致更高的數據使用量和更快的電池消耗。 這是設計師在按照 Material Design 指南工作時必須考慮的平衡行為。

初學者可能會發現 Material Design 規範比平面設計等其他風格更複雜,更難實現。 因為 Material Design 系統非常全面,所以需要考慮和堅持的事情比許多新設計師可能感到舒服的要多得多。

谷歌材料設計組件
Crane 使用淺色和深色主題來創建複雜且美觀的設計。

它的全面性也可能導致一些設計師感到束縛,無法充分發揮自己的創造力。 它還可能扼殺創新,因為幾乎所有設計挑戰都已計劃好並提供了解決方案。 雖然在許多情況下很有幫助,但這會阻止設計師採用新的方法來解決問題,同時也會限制可能出現的新想法的數量。

Material Design 中也存在一些可用性問題,這些問題會使網站和應用程序對用戶非常不友好。 最大的問題之一是在許多移動設計應用程序上遇到的所謂的“神秘肉”導航。 圖標通常用於代替文本,雖然有時圖標可以立即識別並且相當可用,但在其他時候則不然。

與以前在大多數 Android 界面中使用的房子圖標相比,表示“主頁”的圓圈更難識別。 這是將形式置於功能之上的一個典型例子,這是 Material Design 扁平化設計根源的延續。

而且它不只是在較低的導航欄中。 Material Design 對包含圓形浮動操作按鈕的偏好也是一個可用性問題。 這些圓形按鈕僅包含圖標空間,不包含輔助文本。 而且由於圖標可以如此開放地解釋,在許多情況下,用戶會質疑這些按鈕的實際作用。

谷歌材料設計元素
回复通過包含文本標籤的更詳細的滑出菜單解決了浮動導航圖標。

結論

如果一個應用程序主要是為 Android 平台構建的,那麼使用 Material Design 是一個簡單的選擇。 由於 Google 的廣泛採用,任何基於 Material Design 原則的應用都會感覺像是原生應用。

也就是說,在 Android 平台之外還有很多其他用例,Material Design 是一個不錯的選擇。 隨著設計系統的進一步成熟,這些情況必然會增加。 設計師至少應該熟悉這些指南,以便他們自己確定何時適合使用 Material Design,以及何時可能更適合其他系統。

• • •

進一步閱讀 Toptal 設計博客:

  • 如何構建有效的設計框架(帶有免費草圖文件)
  • 為更好的用戶體驗創建 UI 樣式指南
  • 了解設計系統和模式
  • 基於組件的框架的 A/B 測試 UX
  • 設計心理學和真棒用戶體驗的神經科學