Material Design

Material Design 是 Google 於2014年所提出的設計概念,翻譯為「本質設計」,這種設計概念其實是一種考慮事物本質的設計,將數位世界當中的 UI 元素,當作是一種不存在於現實世界的新材質,並且賦予它物理特性,但並非是去做擬物化的設計。

目前主流上與 Google Material Design 概念類似的,有 Apple 的 Guidelines、Windows 的Modern UI 及 Facebook 的 Paper,這些概念的大方向是相同的,但各方在細節上著重的部分卻不太一樣。

紙張形態的模擬

我們知道電子螢幕是屬於完全平面化的,不像實體書本,我們可以看到每一頁紙張之間是有空間關係的,然而,雖然電子螢幕無空間感,但資訊內容是有空間層級的關係。因此,透過Material Design 將紙的特性帶到數位世界當中,讓資訊內容間的層級關係,有如紙張的空間感。


轉場動畫

過去傳統只有二維的概念,當點選打開一個新頁面時,就是直接刷新畫面,並沒有顯現出空間層級關係。因此轉場動畫即是增加轉場過程中的空間層級關係,另外,也不單只是頁面層級的動畫過渡,同時也能動畫中感受到作業過程中的變化,例如刪除時,垃圾桶圖標會有傾倒的動畫。

ICON 動畫

互動動畫在 app 當中已蔚為風行,那緊接而來的是設計師將焦點轉移到 icon 身上,透過 icon動畫的設計,突顯「選取」、「反向選取」兩種狀態間的切換,例如 Facebook 上對貼文「按讚」、「收回讚」的動畫。

大面積色塊 action bar

除了互動動畫之外,Material Design 也透過大面積鮮豔色塊,讓畫面呈現出一種距離感,或是用色塊突顯主要內容或標題,讓畫面的層次感更為豐富。


FAB 按鈕 (Floating Action Buttons)

FAB 按鈕是 Material Design 中,非常引人注目的一塊,因為它跳脫了以往新建、增加、收藏…等制式按鈕的形式,而是透過反差配色的設計,突顯這個按鈕 (如圖的圓形+按鈕),同時這類按鈕通常會是這個畫面的主要功能。


無邊框按鈕

將一般按鈕典型的樣子去掉按鈕邊框,只保留圖示或文字的部分,甚至直接使用 icon 的方式來呈現按鈕,而 Material Design 的 action bar 也是採用類似的設計概念。

聚焦大圖

使用與螢幕等寬,幾乎佔據掉大半的圖像,去掉 action bar,只保留部分無邊框的功能鍵 (返回、功能清單等),給人一種延伸的感覺。


程式語言編年史

程式語言編年史原文 下面這張圖片描繪了整個程式語言的歷史。包括各種程式語言的發明人、程式語言的特點和適用領域、被什麼網站或公司使用等 (檢視 完整高清圖 )。 之所以會有那麼多不同的程式語言是因為設計程式語言的初衷不同、對語言學習曲線的追求不同、不同程式之間的執行成本差異...