隨著iOS 14和macOS Big Sur的推出,我們見證了UI Desing的下一個(gè)大事件。雖然沒有像iOS 7之前的革命性變化,但也毫無疑問地展示了UI設(shè)計(jì)師未來可能參考的趨勢......
......也不太可能會是新擬態(tài),”
扁平化設(shè)計(jì)不再是趨勢
我們要明確一點(diǎn)--極簡主義并不意味著過渡扁平化。有些人傾向于將它們作為一種東西。可以說新的蘋果操作系統(tǒng)仍然是極簡主義的,但它們的外觀獲得了更多的陰影、紋理和3D形狀。
就像蘋果公司人機(jī)界面副總裁Alan Dye所說的那樣。"深度,陰影和透明度被用來創(chuàng)造層次。新材質(zhì)豐富而活力滿滿……”
蘋果降低了視覺上的復(fù)雜性,讓設(shè)計(jì)更加簡約。一些元素更加扁平化,但感覺卻恰恰相反。iOS和macOS都為用戶體驗(yàn)帶來了更多的3D維度。
提示設(shè)計(jì)師:思考極簡主義如何在你的設(shè)計(jì)中獲得空間。觀察簡單的效果(陰影、半透明)如何建立視覺層次。
全新的微妙體驗(yàn)
人腦需要一個(gè)提示來識別物體。我們傾向于將3D物體感知為交互式物體。這就是為什么很多按鈕還保留有陰影的原因。
蘋果設(shè)計(jì)師知道這一點(diǎn),macOS的工具欄圖標(biāo)去掉了形狀,以消除視覺上的復(fù)雜性。但是,當(dāng)用戶拖動光標(biāo)時(shí),他們的背景會突出顯示,并鼓勵他們按下去。
最后一個(gè)是顏色。蘋果希望設(shè)計(jì)師使用Tint(或Accent)顏色來使活動元素更加明顯。這種色調(diào)應(yīng)該反映品牌或產(chǎn)品的顏色。得益于此,用戶會立即在公司品牌和應(yīng)用之間建立起聯(lián)系。
給設(shè)計(jì)師的提示:不要害怕不突出所有的選項(xiàng)。不是每個(gè)按鈕都需要有形狀。當(dāng)用戶懸停在其表面時(shí),它可能會出現(xiàn)。在可能的情況下,用色調(diào)進(jìn)行實(shí)驗(yàn),去除視覺上的復(fù)雜性。
數(shù)字材料設(shè)計(jì)
從谷歌的Material Design開始,它向我們展示了數(shù)字紙張的愿景,然后微軟推出了Fluent Design,提出了多種數(shù)字紋理的概念??磥硖O果公司也是這樣做的,更重要的是他們把它推向了一個(gè)新的高度!
這是一個(gè)偉大的決定,因?yàn)閿?shù)字材質(zhì)比原始的像素化方塊更讓我們心曠神怡。它們讓用戶界面更加人性化。
給設(shè)計(jì)師的提示:玩轉(zhuǎn)數(shù)字材質(zhì)的概念。使用深度、陰影和半透明性來創(chuàng)造視覺層次感。如果你還不熟悉Material Design或Fluent Design System,請閱讀他們的指南來理解這個(gè)概念。
細(xì)致效果打造品質(zhì)感
有一些微小的細(xì)節(jié)是有區(qū)別的。你無法從模擬圖或截圖中看到所有的東西,因?yàn)橛行┦沁\(yùn)動或聲音(是的,大當(dāng)然引入了幾十種新的和增強(qiáng)的UI聲音)。
設(shè)計(jì)師們主要能看到的是新一代的模糊效果--叫做漸變模糊。它是關(guān)于讓模糊的漸變層次,而不是隱藏在不透明度或陰影之下。
給設(shè)計(jì)者的提示:看看新的操作系統(tǒng)在哪里以及如何使用漸進(jìn)式模糊。想想如何在你的設(shè)計(jì)中應(yīng)用它?,F(xiàn)在哪些設(shè)計(jì)工具可以實(shí)現(xiàn)這種效果?
圖標(biāo)中的新擬態(tài)
在過去的幾年里,macOS的風(fēng)格是將應(yīng)用圖標(biāo)扁平化,周圍的符號主要是圓形。這種情況已經(jīng)發(fā)生了改變。現(xiàn)在大多數(shù)圖標(biāo)獲得了 "類似iOS "的形狀,但它并不是扁平的,而是Skeuomorphic。它是Skeuomorphic!
我個(gè)人認(rèn)為,macOS中的很多新圖標(biāo)看起來都很驚艷,但有些圖標(biāo)設(shè)計(jì)得不是很好(比如Stock app圖標(biāo))。
給設(shè)計(jì)者的提示:探索新圖標(biāo)的畫廊??纯搭~外的陰影和漸變是如何改變平面iOS圖標(biāo)的感覺,完美契合Big Sur圖標(biāo)風(fēng)格??紤]為一些元素使用3D形狀。
用小部件顯示即時(shí)信息
iOS 14帶來了一種全新的小部件方法。它們直接顯示在主屏幕中。這些widget在iPad OS上看起來幾乎是一樣的,和macOS Big Sur上的新widget非常相似。
蘋果建議我們將widget集中在一個(gè)理念上。要只顯示與之相關(guān)的信息,僅此而已。另外,顯示隨著時(shí)間的推移而變化的動態(tài)信息也很重要,因?yàn)閣idget不應(yīng)該只是鼓勵打開應(yīng)用程序。
給設(shè)計(jì)者的提示:想一想你的應(yīng)用中哪些信息對用戶來說是最重要的。這種類型的內(nèi)容可能是一個(gè)有用的小部件的基礎(chǔ)。試著試驗(yàn)一下直接在主屏幕上顯示的小部件的新尺寸(小、中、大)。記住,要支持黑暗模式!
趨于整體的生態(tài)系統(tǒng)
所有的蘋果系統(tǒng)iOS、iPadOS、macOS甚至watchOS都是作為一個(gè)單一的生態(tài)系統(tǒng)工作的。它們擁有相同的字體、圖標(biāo)和幾乎相同的視覺風(fēng)格。
一致性給用戶一種熟悉和自信的感覺。它建立了更多的信任,與品牌建立了更好的聯(lián)系。
給設(shè)計(jì)師的提示。如果你正在創(chuàng)建一個(gè)全渠道的解決方案,適用于所有類型的設(shè)備,觀察蘋果的應(yīng)用程序如何通過平臺改變。哪里保持了一致性?哪里做了改變?在不同平臺上增加了哪些功能?
官方的《人機(jī)界面指南》永遠(yuǎn)是深入分析新風(fēng)格和新功能的最佳來源。
蘋果推出了很多新的鼓舞人心帶有啟發(fā)性的東西。雖然iOS 14中的widgets、剪輯和Progressive Blur給移動操作系統(tǒng)帶來了很多新鮮的體驗(yàn)--但Big Sur是徹底改變我們使用mac的方式。即使是它的名字--你是否注意到它的名字是macOS 11?
原文:https://uxdesign.cc/what-can-designers-learn-from-ios-14-and-macos-big-sur-bab6e188ba4e
全站高品質(zhì)素材免費(fèi)下載!