字體更多、全新圖標——Google I/O 宣佈設計更新!你的手機App可能會變成這樣

2018.05.18 by
愛范兒 ifanr
愛范兒 ifanr 查看更多文章

愛范兒連接全球創新者及消費者,跨界技術、文化、消費及創新,致力消費科技領域的產業評論、產品報導及社群連接,創造高品質的消費樂趣。

Material Theming
2018年Google I/O大會,Material Design又有了新變化,其中最重要的就是推出Material Theming。

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新功能

本文授權轉載自:愛范兒

每日精選科技圈重要消息