【Material Design視覺設計語言】開篇

標籤：

郭孝星
微博：郭孝星的新浪微博
郵箱：[email protected]
部落格：http://blog.csdn.net/allenwells
Github：https://github.com/AllenWells

Material Design，即原質化設計，是Google官方退出的視覺設計語言，目的在於統一Android應用介面設計，提升使用者體驗。事實上不僅僅在Android上，在HTML等其他領域，Material Design也表現出了旺盛的生命力。

一 設計目標

Material Design的設計目標就是構建Android跨平台和裝置尺寸的統一使用者體驗，遵循基本的移動設計原則，同時支援觸摸、語音、滑鼠和鍵盤等多種輸入方式。

二 設計原則2.1 應用介面組件具有實體感

實體感即實體隱喻，是構建系統化和空間合理化的統一，與眾不同的觸感是實體感的基礎。

實體感的效果體驗來源於兩個方面：

• 實體的表面
• 實體的邊緣

實體的表面和邊緣提供基於真實效果的視覺體驗，熟悉的觸感讓我們的使用者可以快速地理解和認知。實體的多樣性可以讓我們呈現出更多反映真實世界的設計效果，但同時又不會脫離客觀的物理規律。

那麼如何在應用的設計中向使用者闡述組件的運動規律、互動方式、空間關係呢？

解答這個問題不得不提到光效、表面質感、運動感這三個重要的概念。

尤其是光效，真實的光效可以解釋應用組件之間的交合關係以及空間關係，如所示：

2.2 組件的顏色和布局要鮮明和形象

在組件的布局和顏色搭配上，要從排版、網路、空間、比例、配色和映像使用等方面去考量，精心選擇色彩、映像和合乎比例的字型和留白，構建出鮮明和形象的使用者介面。

在組件功能設計上要根據使用者行為凸顯核心功能，進而在應用上為使用者提供友好高效的操作指引。

2.3 為組件添加有意義的動畫效果

動畫效果是作為獨立的情境呈現，表現出組件的連續變化，讓使用者吸引使用者的注意裡，以及維持整個系統的連續性體驗。

動畫效果在設計時應該做到：

• 動畫效果應該是有意義的、合理的。可以有效暗示和指引使用者。
• 動畫效果的設計應該根據使用者的行為而定，能夠改變整體設計的觸感。
• 動畫效果反饋應該細膩、清爽。轉場動畫應該高效、明晰。

開篇文章大致就說到這裡，後續的文章會詳細討論樣式、布局、動畫和組件設計等內容。

著作權聲明：當我們認真的去做一件事的時候，就能發現其中的無窮樂趣，豐富多彩的技術宛如路上的風景，邊走邊欣賞。

【Material Design視覺設計語言】開篇