午夜勾魂曲-午夜福利自怕-午夜福利在线观看6080-午夜福利院电影-国产精品毛片AV久久97-国产精品麻豆高潮刺激A片

「玻璃擬物化」你知多少?

2021-4-13    ui設計分享達人

去年大家看到更多的設計和文章都在圍繞“新擬物化”展開行動,隨著各種硬件的提升,代碼的優(yōu)化,更多的風格和效果一一出現(xiàn)在我們的生活中,而今天呢,我們一起探索一下生活中最常見的,你可能沒有注意到的設計風格——“玻璃擬物化”風格,英文“Glassmorphism”,這也可能會成為新的設計趨勢。 




什么是玻璃擬物化呢? 


在生活中的攝影,通過玻璃的層次感,給人以朦朧的美感,那什么是玻璃擬物化呢?



顯而易見,Glassmorphism 這個詞是 Glass(玻璃)和 Skeumorphism(擬物化)的結合,我們姑且將其稱之為「玻璃擬物化設計」。 




油管一管主Malewicz 小哥對于這種風格特征歸結為4點:


  • 透明:使用帶有模糊磨砂質感背景的透明效果

  • 懸浮:帶有明顯懸浮感的多個層級

  • 鮮明:使用鮮艷色彩作為強調色并且從半透明層中透出

  • 微妙:使用輕薄微妙的邊框來強化物理質感



簡單的來說,「玻璃擬物化」在某些方面和「新擬物化」是一脈相承的,但是它有著相對更加具體的視覺隱喻,也就是我們日常接觸的「玻璃」。  



玻璃擬物化的優(yōu)點有哪些? 


1.愉悅感 

玻璃擬物化的應用,讓扁平的UI界面不那么單調,打破了人們的視覺疲勞,增添歡快、愉悅的設呈現(xiàn)效果。 

2.層次感 


通過玻璃透明,加周圍顏色環(huán)境的烘托,頁面的層次能更容易的呈現(xiàn)出來。 
















3.呈現(xiàn)語境 

你在哪,從哪里來,玻璃擬物化就很明白的告訴你了。通過透明的玻璃材質,能告訴你所覆蓋的層級。



4.微妙高級感 


例如,以往的電商產(chǎn)品設計界面,更多的體現(xiàn)材質或者簡約風體現(xiàn)產(chǎn)品本身,但玻璃擬物化會讓產(chǎn)品在呈現(xiàn)中更顯高級。  







玻璃擬物化的設計風格從哪里來呢?

追根溯源。其實還是要追更到蘋果頭上。  



蘋果的合計將玻璃擬物化的風格運用的惟妙惟肖,無論是mac,iPhone還是iPad,設計風格都保持著相對一致的玻璃擬物化風格。 


重點來了,

玻璃擬物化如何用Sketch來設計一個玻璃面呢? 

首先:我們打開sketch,建立一個畫板,隨便找張圖片作為背景,畫一個白色矩形 



接下來:調整矩形的屬性,再填充色中設置透明度為50%,邊框可以吸取一個30%透明的白色,2px,再添加一個環(huán)境色的10%陰影,做出層次感,最后就是調整玻璃模糊的效果了,玻璃擬物的關鍵就在于sketch自帶的背景模糊功能,我們常常以為這里只有一個高斯模糊,但卻忽略隱藏在里面的其他模糊效果。設置背景模糊值為10%,不用太大,太大的話模糊效果就沒有那么真實了,具體調整還是要看效果。我們看效果: 



單層的效果不是很明顯,我們復制兩個調好的玻璃效果,調整他們的透明度,底部的透明度為70%、中間的為50%,最上層的為30%,看效果:


在界面設計中,就可以通過不同層級,調整對應的參數(shù),達到更好的層級效果。 


那深色模式怎么辦呢?


很簡單,我們復制這三個矩形,填充色設為黑色,可以不是純黑色,根據(jù)設計規(guī)范來定,看效果:  



在圖標中怎么用玻璃擬物化設計呢?


玻璃是屬于透明物體,所以我們就了解到,通過玻璃看物體,層次感就出來了。 
所以圖標這這里設計的關鍵就在于 玻璃面和層次感,下面我們來看幾個圖標設計的案例 






看得出來,玻璃擬物化的設計很出效果。 
下面根據(jù)我說的我們來分析如何運用玻璃擬物化設計圖標 



我們以這個照片的圖標為例來拆解分析,通過運用剛才繪制的玻璃面的方法,與圖標色塊組合起來,在組合的時候,調整好層級,一個輕巧且富有玻璃質感的圖標就繪制出來了,很簡單、很容易上手對不對?一起來快來試試吧 



注意的細節(jié):


1.在純白色背景中,一定要給玻璃面添加底部色塊的顏色,不然就不會出現(xiàn)看不見玻璃層的尷尬畫面; 
2.背景模糊值也是需要根據(jù)具體的需要來調整。  



玻璃擬物化在界面中的應用越來越多,所以大家也要根據(jù)自己的業(yè)務有選擇性嘗試的去使用,不要盲目的跟隨設計趨勢設計而設計。  


就到這里兒吧,大家有空多去收藏一些類似的設計,多去吸取靈感,設計出更好用好看的產(chǎn)品!  


最后,讓我們再來總結一下

一玻璃擬物化的特點:


  • 透明:使用帶有模糊磨砂質感背景的透明效果

  • 懸浮:帶有明顯懸浮感的多個層級

  • 鮮明:使用鮮艷色彩作為強調色并且從半透明層中透出

  • 微妙:使用輕薄微妙的邊框來強化物理質感


玻璃擬物化的優(yōu)點有哪些?

日歷

鏈接

個人資料

藍藍設計的小編 http://m.gerard.com.cn

存檔

主站蜘蛛池模板: 啪啪啪社区 | 国产精品自在在线午夜蜜芽tv在线 | 日韩丰满少妇无码内射 | 亚洲mv在线观看 | 亚洲免费国产 | 秋霞电影网午夜免费鲁丝片 | 老司机福利在视频在ae8 | 欧美影院在线观看完整版 mp4 | hdsexvideos中国明星 | 饱满奶大30p| 久久精品国产在热亚洲完整版 | 国产精品三级在线观看 | 含羞草传媒在线观看 | 国产真实夫妇交换视频 | 内射无码AV-区二区在线观看 | z0000性欧美| 精品久久久噜噜噜久久久app | 久久精品AV麻豆 | 岛国电影网址 | 国产午夜精品一区二区三区 | 嫩草影院久久国产精品 | 亚洲国产欧美另类 | 青草伊人网 | 强姧伦久久久久久久久 | 果冻传媒我的女老板 | 久久99国产综合精品AV蜜桃 | 快播在线电影网站 | 毛片免费观看的视频 | 韩国女人高潮嗷嗷叫视频 | 国产成人精品午夜福麻豆报告 | 亚洲最大日夜无码中文字幕 | free18sex性自拍裸舞 | 亚欧日韩毛片在线看免费网站 | 超h高h肉h文教室生理课 | 偷偷鲁青春草原视频 | 小sao货水好多真紧h的视频 | 顶级少妇AAAAABBBBB片 | 无码人妻少妇色欲AV一区二区 | 久久亚洲精品中文字幕60分钟 | 国产精品高清在线观看地址 | 人妻熟女斩五十路0930 |