WFU

2015年2月17日

簡報設計:Material Design

簡報架構與視覺設計工作坊2015-02-08 場次,有不少朋友發現我使用一種叫做「Material Design」的設計,實作出另一種風格的 Presentation UI。

另一種風格?是的,我曾在 2015-01-10 場次融合 Metro UI 與 iOS,實作出第一種 Presentation UI。

朋友們很好奇,曾私下與我討論一些問題;我整理一下,與大家分享囉。

什麼是 Material Design?


網路上關於 Material Design 的說明很多,有興趣的朋友們,可以瀏覽官方網站《Google Design》,我也是參考這份文件,實作出 Material Design for Presentation UI,讓我回想起當年實作 Java 程式語言的光陰呢。

針對忙碌的非設計專科的專業職人(這樣描述非常繞口;簡單說,就是像我這種原本就有一種專業的簡報設計素人),細看這篇《Material Design 引領的設計趨勢》,我想就差不多了。

Google Design 又臭又長內容繁多,可以介紹重點、幫大家省點時間嗎?


沒問題,底下跟大家分享兩大重點:

顏色先決


Google 大神很佛心,在這邊幫大家設計並示範各種色彩應用。簡單應用的話,primary palette 使用某色系之 100、500 與 700,accent color 選擇 A100 與 A400 即可。

簡報架構與視覺設計工作坊》「簡報基本功」投影片之一

圖示應用


如果您想自己動手畫 icon,相關規格可以參考這邊;或者,使用 Google 提供的 Material Design iconsCC BY 4.0

Material Design 的動畫有辦法實作嗎?


可以的。請看底下這個示範,像不像您滑手機的 fu 呢?XD


想試試看嗎?

歡迎到這邊一起討論,也歡迎展示您的作品唷!