APP軟件界面設計之Material產品圖標的五個設計要點 | ||||
發布時間:2016-12-17 16:22:24 瀏覽:2012
今天又來跟大家分享一節非常實用的產品圖標設計的要點和知識點??梢园堰@些知識應用到我們日常的logo設計、圖標設計、圖形設計上都可以的。 那就是要學會解剖產品圖標結構。 下面內容是摘錄自Material Design 中文版。 對于一個給定的品牌,在這些圖標中,元素的一致性是形成一個共享視覺語言的關鍵。熟悉這些元素可以更容易地理解每個 logo 和它們之間細微差異的特征。它也將幫助你學會識別 logo 設計的底層結構。 都會包含下面五個設計要點: 1、拋光 2、material 背景 3、material 前景 4、色彩 5、陰影 如下圖所示:直接從上方看,組件相互重疊。
第一步:構建視角 顯示圖標構造中各成分的立體分解圖。 根據上面那個五個識別logo設計結構的步驟我們來看下Material Design風格的圖標設計
1、拋光 換句話說就是 實現漸變特效 在所有元素之上,自左上到右下逐漸變淡,提供照明的柔和色彩。 2、看下Material Design的前景色和背景色:
上圖當中material 背景色是最底層的藍色,而上面的白色為前景色。
中心圓圈的色彩為Material Design的斑點色:即增加到元素中一小部分的顏色。
3、色彩 色彩從當代建筑、路標、人行橫道以及運動場館中獲取靈感,由此引發出大膽的顏色表達激活了色彩,與單調乏味的周邊環境形成鮮明的對比。強調大膽的陰影和高光。引出意想不到且充滿活力的顏色。 設計師一定要善用你的調色板。如下圖的色彩光暈效果。 4、圖標陰影設計 在一個上層元素周圍的加上柔和陰影效果。 如上圖。
下面是Material產品圖標的設計欣賞:
其實上面這些優秀的Material Design Icons圖標設計,都是遵循以上Material產品圖標的五個設計要點。 希望各位APP設計師在設計安卓界面的時候,也是可以遵循這些設計規范來弄。
什么是網站策劃,顧名思義,就是給網站做規劃。有些人可能會說,不就是個網站嘛,有什么好策劃的呀,找個美工來排排版,找個程序員來加程序,不就...
最近一段時間,對網站訪問日志關注比較多,一來擔心網站安全問題,因為互聯網中網站被攻擊或者掛馬的現象實在是太多了,很多網站動不動就被攻擊或者被...
![]() 有朋友問,用asp方式,如何將同一個數據庫中,不同字段內所記錄的數字之和進行統計?下面藍頓小編就將統計代碼發出來供大家參考。
假設有數據庫...
![]() 以前,小伙伴們要處理一個圓形的時候,大都是先做一個圓形的背景圖片來進行處理,或者用js腳本來進行處理,而現在,用DIV圓角樣式來處理就簡單方...
|
