2014年,Google推出一種新的設計語言——Material Design。如今,它成了最頻繁使用、也最受人青睞的一種視覺設計語言。至於這背後的原因,主要有2大因素:
- 兼容性:作為視覺語言,它可以跨平台兼容使用。
- 直覺性: Material Design的核心原則,是如何將「材料/表面元素」展現得淋漓盡致,要讓用戶簡單地了解整個交互過程。
但Google對Material Design的定義,並不僅僅停留在視覺語言上。Google還開發了一些工具,用以提升設計開發工作流程。
2018年Google I/O大會,Material Design又有了新變化:
材料主題(Material Theming)
材料主題的推出,是對Material Design的重磅升級。所謂材料主題,可以讓你「系統化」定製Material Design語言,也就是說品牌可以藉助它來定制更加符合自身品牌風格的Material Design主題。
關於「系統化」,需要多解釋幾句:
一個品牌,從視覺上來講,是由色彩、字體和圖形來呈現的。
因此,需要通過新的方式來改變材料組件裡的元素。之前的做法,是在 Sketch (一款矢量繪圖應用)中,透過多個插件更新符號(Symbol)和組件庫(Library)。但現在,我們推出了「材料主題編輯器」。
編按:Library 本質上就是一個包含了各種符號(Symbol)的 Sketch 文件。如果在 Library 文件中修改任意「符號」,那麼所有使用了該「符號」的子文件都會提示該文件已經被更改,是否需要同步更新?這樣,設計師能在第一時間確認「符號」的變化,保持使用最新的設計組件。在團隊協作中,共享的 Library 可以覆蓋到每一個工作文件,只要進行添加,每個團隊成員都能使用,並在第一時間知悉它們的變化。
材料主題編輯器的推出,可以讓你新建並定制你的材料主題。你還可以新建個人符號組件庫,並通過色彩、圖形和字體進行編輯。
現在,在Sketch下載材料插件(Material Plugin),即可使用材料主題編輯器。
以下,是關於材料主題的4個亮點:
1. 更改/添加/更新色彩
這部分的亮點在於,它通過對色彩運用的了解,特別是了解具體位置的特定色彩運用,可以一次性更改設計中的一種色彩,還可以自動生成暗調(Shades)和明調(Tints) 。
2. 字體管理
通過管理字體,能直觀地了解字體的層次結構。一個主題中可以允許最多 3 種字體,同時也有更多主流 Google 字體,比如Roboto、Raleway、Alegreya、Merriweather等字體供你使用。
3. 圖形
這是全新功能。就圖形而言, Material Design的核心在於更新材料,比如卡片或者卡片形狀!根據品牌需求,你可以自定義截角或弧形等各種形狀。
4. 全新的圖標樣式
不少設計師都會抱怨圖標數量過少,樣式過於死板。現在,推出了全新的5種圖標樣式:填充圖標(filled icon)、圓形圖標(rounded icon)、銳利圖標(sharp icon)、輪廓線圖標(outlined icon)以及雙色圖標(two-tone icon)。
簡化協作流程工具Gallery
你們還記得去年發布的這款工具嗎?這是Google發布的一款工具,其宣稱能簡化設計工作流程。但實際上,用戶只能在各種圖片版本上進行評論而已!
現在,Google Gallery 再次重磅更新。這一次在功能上的更新,終於能夠解決讓你頭疼的設計問題了。 Gallery 的更新,主要有 5 大方面:
- 你可以在Gallery中添加Google文檔(包括文件、試算表、簡報,類似於微軟三件套 Word, Excel, PowerPoint)。所以,無論是需求文檔、用戶調研,還是視覺設計稿,你都可以放在一個地方;
- Gallery中添加了「項目和收藏」功能。這個功能,類似於Sketch內建的文檔管理系統,並且涵蓋了多個頁面。這對不少設計師來說,都是非常實用的功能;
- 如果你上傳文件名相同的文檔,Gallery會自動生成不同的文件版本。這個功能也非常有用,特別是能幫你了解線框圖如何最終成為設計成品的,以及這些反饋是如何影響UI設計走向的;
- 檢查模式(超讚)。檢查模式不僅僅是單純的檢查,它還能檢測符號,甚至能追溯到相應的原始碼。此外,它還能識別 Font Family,並且也能提供連結至 Google 字體;
- 完全免費!所以,你可以告別Sketch Measure、Zeplin、Marvel或者InVision這些收費插件了!
其它重要更新
- 在iOS客戶端、Android客戶端、Web網頁端和Flutter(一款新的用於創建移動應用的開源庫)更新了材料組件
- Google透過定製材料主題帶來全新的體驗
- 材料合作夥伴研究:了解Lyft、Genius、NPR、Pocket Casts和Zappos等app 如何運用Material Desig新功能
本文授權轉載自:愛范兒