中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

編輯導語：對于設(shè)計師來說，界面的風格是關(guān)注的一大重點。今天，本文作者針對蘋果最近新推出的macOS Big Sur系統(tǒng)展開了分析，通過解析這一代的macOS的設(shè)計風格，為我們介紹了設(shè)計新趨勢——Glassmorphism（新擬態(tài)風格）。

很久沒更了，今天談一下最近蘋果新推出的macOS Big Sur系統(tǒng)。

作為設(shè)計師，最關(guān)心的還是界面風格，這一代的macOS設(shè)計風格大改，和前幾代都有著明顯的區(qū)別，大量的圓角要素，以及最為重要的毛玻璃半透明效果，感覺手機搬到電腦上面了，這就很「iOS」！

由于玻璃般的外觀，我覺得最好的稱呼方式就是Glassmorphism。

一、Glassmorphism

作為現(xiàn)在市場上一種新的風格，已經(jīng)越來越流行了。對比之前火爆一時的Neumorphism（新擬態(tài)風格），模仿一個擠壓的塑料表面（但是仍然看起來像一層），這種新趨勢更加垂直。

下面是它最具有定義性的特征：

• 透明度（使用背景模糊的磨砂玻璃效果）；
• 物體漂浮在太空中的多層方法；
• 鮮艷的色彩突出了模糊的透明度；
• 半透明物體上的細微淺色邊框。

這種垂直性以及你可以透過它看到的事實，意味著用戶可以建立界面的層次結(jié)構(gòu)和深度。用戶只是看到哪一層在哪一層之上，就像虛擬的玻璃一樣。

二、歷史

背景模糊最早是在2013年隨iOS 7廣泛引入的。這是一個非常重大的變化，但是圍繞超輕字體和丑陋圖標的所有爭議，這是沒有爭議的變化之一。人們似乎喜歡它。

下拉通知很快就變成了一件有趣的事情，你可以清楚地看到(當你慢慢地下拉通知時)新面板下的圖標是如何淡出和模糊的。

三、加強趨勢

蘋果已經(jīng)在他們的移動操作系統(tǒng)中大大減少了模糊的玻璃效果，但是最近在Mac OS Big Sur中又增加了透明模糊。

看看這個“sketch”窗口，上面的照片模糊的部分是如何流過它的。我突出了背景模糊最明顯的地方，當然，你可以在系統(tǒng)設(shè)置中完全關(guān)閉該效果。

微軟的Fluent設(shè)計系統(tǒng)也很重視這種效果。他們稱此特殊元素為“丙烯酸塑料/亞克力”，并將其展示為設(shè)計系統(tǒng)的組成部分。

丙烯酸是一種可以產(chǎn)生半透明質(zhì)感的畫筆，你可以將丙烯酸應(yīng)用于應(yīng)用程序表面以增加深度并幫助建立視覺層次?！?Microsoft Fluent設(shè)計系統(tǒng)

四、Dribbble案例分析

與任何UI趨勢一樣，它在Dribbble上經(jīng)常被過度使用。

這才慢慢開始，已經(jīng)有一些很漂亮的例子。當然，它們都與演示作品有很大關(guān)系，因為在實際的手機屏幕上，它們很難覆蓋背景。這僅僅是因為手機上的應(yīng)用程序都是全屏的。

Ghani Pradita的智能日歷應(yīng)用程序

上面的示例在某些地方可能處于可讀性的邊緣，但這清楚地表明了這種趨勢。背景非常微妙，但仍然可見，并且形狀具有1點半透明的白色輪廓，可以模擬玻璃邊緣。

（Ghulam Rasool）

就Neumorphism（新擬態(tài)）一樣，僅在一個元素上使用時，這種樣式會特別明亮，就像上面示例中的背景一樣。當然，在這里演示的作品起著舉足輕重的作用，但是你可以想象桌面Web界面在背景上使用相似的透明度。

圖標可能會引起爭議，但它們也得到了玻璃變形處理，就像下面的Marshall示例一樣。

by Marshall

從Dribbble看，它們目前都在#glass標簽下，但我認為#Glassmorphism更合適。玻璃杯可以說是你飲用的玻璃杯，所以我認為這種風格應(yīng)有一個名稱，以便于識別。

五、達到這個效果

效果本身很容易，但是要考慮兩點。與任何基于卡片的布局一樣，第一個是-物體離我們越近，它吸引的光越多。在這種情況下，這意味著它將更加透明。

整個效果的基礎(chǔ)是陰影、透明度和背景模糊的組合，這種風格只能使用一個透明層，或者多個透明層，但當至少兩個半透明層出現(xiàn)在一個相當繁忙的彩色背景上時，它是最突出和可見的。

1. 如何設(shè)置正確的透明度？

重要的是要記住，無論如何，你不能讓整個形狀透明，只有讓它的填充透明才行。大多數(shù)設(shè)計工具在填充為100%，對象透明度較低時，背景模糊會不起作用。

在上面的示例中，背景模糊值完全相同，為8，但是圖像看上去完全不同。當填充不透明度為100％時，對象的不透明度有多低都沒有作用。我們根本不會獲得所需的模糊背景。

2. 如何選擇合適的背景？

背景在這個效果中扮演著重要的角色。不能太簡單或太單調(diào)，否則效果就看不出來，它們也不能太復雜。

這可能就是Apple選擇彩色背景作為Mac OS Big Sur默認壁紙的原因。當模糊的透明表面位于其頂部時，那些易于辨別的色調(diào)差異也很容易看到。

選擇背景時，請確保其具有足夠的色調(diào)差異，以使玻璃效果真正可見。

3. 最終細節(jié)

你可以嘗試的最后一件事是為形狀添加1px內(nèi)邊框，并具有一定的透明度。它模擬玻璃邊緣，可以使形狀從背景中脫穎而出。

盡管這種風格的元素（例如模糊的背景）已經(jīng)存在了很多年，但它正變得越來越流行，因此，在這里仍然可以探索很多很酷的創(chuàng)意效果。

左側(cè)的圖像具有半透明的邊框，而右側(cè)的圖像則是無邊界的。

六、輔助功能

就像Neumorphism一樣，這種樣式可能不像默認的Material Design那樣易于使用。

Neumorphism的主要規(guī)則也可以轉(zhuǎn)化為此處-如果你具有良好的功能層次結(jié)構(gòu)，則屏幕上的元素應(yīng)該可以在沒有背景的情況下工作，這樣可以確保有視力障礙的人仍然能夠理解UI。

這是一個與新擬態(tài)相同的不良示例，它在每個可能的屏幕元素上濫用效果。這樣，某些用戶幾乎無法訪問整個UI，同時也使其變得無聊和原始。

僅當這些透明效果只是裝飾性的，而不是體驗的組成部分時，才會發(fā)生這種情況。應(yīng)避免將它們用于按鈕或切換（這些重要的對象應(yīng)始終具有更大的對比度），但你可以將其用于卡背景。

只需確保卡的內(nèi)部具有足夠的對比度和適當?shù)拈g距即可定義層次結(jié)構(gòu)，并在視覺上將所有相關(guān)對象“分組”。

這是一個更好的例子-該卡具有定義明確的結(jié)構(gòu)，因此即使完全去除玻璃背景，其內(nèi)容也可以正常使用。這是一個簡單的示例-色彩對比度仍然可以改善。

七、2021年的Glassmorphism

蘋果公司在Big Sur中引入了這種風格，這是肯定的方式，它將在接下來的幾個月中被模仿和模仿。它可能不會接管所有接口（這很好），但是它將比現(xiàn)在流行一些。

作為人類，我們很容易厭倦一種趨勢，每隔幾年鐘擺就會轉(zhuǎn)向另一邊。

一段時間內(nèi)，我們使用了超最小化、近乎扁平的界面，但之后它們開始變得更豐富多彩、更垂直、更“貼近你的臉”。

作為設(shè)計師，我們需要探索制造產(chǎn)品的所有潛力和創(chuàng)造性方法。在某些情況下，“玻璃”的有限使用實際上會使產(chǎn)品看起來更好，對用戶更有吸引力。

而且，盡管我喜歡沒有裝飾和超高對比度的黑白界面，但我很高興能多玩一點這種風格，看看它會帶給我什么。

因為最終，設(shè)計應(yīng)該很有趣，因為這是我們探索新路徑，享受我們所做的事情并交付真正卓越的東西的唯一途徑。

作者：LDesign1，公眾號ID：LDesign1

本文由@LDesign1 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash， 基于CC0協(xié)議