蘋果 macOS Big Sur 系統(tǒng)對于新擬態(tài)風格的探索
編輯導語:如果你觀看了 2020 年的蘋果全球開發(fā)者大會(WWDC),或者是在不經(jīng)意間注意到蘋果發(fā)布的一些公告,可能會注意到一些新東西。除了 iOS 14、iPadOS 14 等新系統(tǒng)外,蘋果還發(fā)布了全新的 macOS 版本,不再是 X,而是新版本號 macOS 11(又名 Big Sur)。Big Sur(大瑟爾)是位于美國加利福尼亞西部中海岸的一段多山區(qū)域,常以景色秀麗聞名,曾經(jīng)被《國家地理》雜志評為“人一生要去的 50 個地方”之一,這個系統(tǒng)命名遵循了 macOS 最近幾年都用加州景色取名的習慣。
一、新風格帶來的碰撞
蘋果表示,新操作系統(tǒng)帶來了自 macOS 10 推出以來最大的設計變革,更新了Safari 瀏覽器,優(yōu)化了信息、地圖和隱私保護等功能,帶回了經(jīng)典的開機提示音……macOS Big Sur 借鑒了 Apple iOS 的許多元素,在控制中心中可以更改屏幕亮度、在通知中心中設置相關通知分組。
應用的窗口都變成了大圓角,應用圖標也統(tǒng)一成圓角矩形,進行了整體更新升級,與整個 Apple 生態(tài)系統(tǒng)的風格變得更統(tǒng)一,同時也保留了 Mac 的鮮明特色。
1. macOS Big Sur 設計風格
左:新 icon(Big Sur),右:舊 icon(Catalina)
從 macOS Big Sur 系統(tǒng)的發(fā)布測試版本開始,就出現(xiàn)了大量的爭議。關于圖標,大量的反饋是太丑了,作為設計師,也不是很理解這種生硬的深色投影。
macOS系統(tǒng)圖標新舊對比
這些爭議引起了對 Big Sur 系統(tǒng)圖標進行優(yōu)化的風潮,期間涌現(xiàn)出一批優(yōu)秀的作品。印象較為深刻的是來自 Vikiiing 的作品,他使用了 C4D 的三維技巧對系統(tǒng)圖標進行了重新設計。
Vikiiing的 3D Big Sur 圖標作品(www.dribbble.com/Vikiiing)
這一組 3D 圖標作品配色明亮、質(zhì)感細膩、過渡自然,使用三維技巧使其光影和細節(jié)的表現(xiàn)更加豐富。
Vikiiing 的作品和 Big Sur 的對比
二、新擬態(tài)風格的崛起
無論是蘋果官方的這套圖標還是 Vikiiing 設計的這組 3D 圖標,你都可以將其歸類于一種叫做「新擬態(tài)」的設計風格,「新擬態(tài)」在設計媒體上已經(jīng)流行一段時間了,大多數(shù)人對這種風格持有否定的態(tài)度。
對于「新擬態(tài)」風格的批評,主要是因為早期的實驗性作品過于關注設計的差異性,不考慮實際的可用性。
但是,如果你跳脫出目前看到的「新擬態(tài)」實踐作品(通常是由專注形式主義而非可用性的設計師創(chuàng)作的作品),去關注「新擬態(tài)」的基本概念,會發(fā)現(xiàn)其中確實有一些相當令人興奮的東西,并且是可持續(xù)發(fā)展的,很多都還沒有完全被實現(xiàn)。
新擬態(tài)風格實驗的例子(設計師 Filip Legieski 作品)
三、「新擬態(tài)」關注于光是如何在三維空間中運動的
「新擬態(tài)」的前身「擬物態(tài)」,通過模擬真實物體表面的紋理效果,在數(shù)字界面中創(chuàng)造出真實感,就像撲克桌上的毛氈質(zhì)感或錄音機外殼的金屬拉絲紋理。
實現(xiàn)這種設計風格的一個輔助元素是光,光與所展示的材料發(fā)生了真實的相互作用,這就是為什么投影和背光面在早期界面中普遍使用的原因。
但是「擬物態(tài)」時期模擬光照和紋理的表現(xiàn)手法仍然相對簡單:哪些對象是有光澤的,哪些是粗糙的,哪些物體是透明的……這些最終都是功利主義,且有些武斷的選擇(設計師或團隊主觀的選擇,或是服從大多數(shù)人的意愿、考慮群體利益而做出的選擇)。
「新擬態(tài)」與其前身「擬物態(tài)」的區(qū)別是「新擬態(tài)」聚焦在光本身、以及光是如何在一個純凈的數(shù)字空間中與各種物體進行交互的?!感聰M態(tài)」中的光模擬更加復雜,關注物體之間的光照影響(折射/反射),或者使用什么樣的光線可以更好的表達物體本身的功能。
還記得早期的蘋果系統(tǒng)界面嗎?
「新擬態(tài)」出現(xiàn)之初引起非常多爭議的設計案例,是將白色的 UI 元素放置在白色的背景上,元素和背景的差異僅僅通過元素與光的相互作用而產(chǎn)生,來自頂部的光照(高光)和來自底部的陰影(投影)表明 UI 元素是位于背景上層的。
在這種風格被廣泛應用之前,還需要進一步研究,提高其可用性。但是,它展示了「擬物態(tài)」所沒有的 ——一種全局照明模式的概念,這種模式超越了單獨的對象,展示了光對同一空間內(nèi)多個對象是如何相互作用的。
新擬態(tài)風格的全局照明模式(設計師 Elena Zelova 作品)
四、向扁平化轉(zhuǎn)變
在 2010 年代早期,「擬物態(tài)」逐漸消逝,「扁平化」風格開始流行起來,這使得色彩和設計元素的表現(xiàn)手法更加廣泛,且富有表現(xiàn)力。不受物理世界的束縛,元素可以變成任何顏色,空間可以更好地利用。通過去除不必要的裝飾,設計師可以自由探索。
「扁平化」設計占主導地位的近十年里,在可用性和用戶體驗領域取得了許多重大進展。
但隨著時間的推移,「扁平化」風格泛濫,物理性的再次引入吸引著人們開始重新研究三維設計,思考將「扁平化」時期獲得的經(jīng)驗帶入三維環(huán)境的可能性,對三維世界的研究變得更加深入。于是時光開始倒轉(zhuǎn),設計風格在輪回之中尋找變化。
曾經(jīng)的蘋果iOS 7 系統(tǒng)
拋開批評不談,「新擬態(tài)」有一個不可否認的特點,使其非常吸引人 ——看起來十分新穎。在過去的八年多的時間里,「扁平化」的設計風格和技術(shù)實現(xiàn)方式,以及頁面和圖層的概念,已被人們所熟悉。
「新擬態(tài)」與用戶已經(jīng)習慣的「扁平化」風格非常不一樣,它像是一種全新的視覺語言。這種差異化是有價值的,特別是對于像 Apple 這樣的公司而言,這是 19 年來首次嘗試將其操作系統(tǒng)升級到新的版本編號。
iPhone 于 2007 年發(fā)布,2013 年推出 iOS 7 的「扁平化」設計。這一基本外觀和感覺比最初的「擬物態(tài)」iPhone UI 保留了更長的時間,每次的優(yōu)化迭代的改動也很細微。
「新擬態(tài)」風格提供了一種低成本的方法,在不對設計語言進行大規(guī)模修改的情況下,推進設計風格的更新(實現(xiàn)「新擬態(tài)」風格最基本的方法就是添加陰影、外發(fā)光和少量的 3D 元素,非常簡單)。
「新擬態(tài)」風格真正變得有趣,是從系統(tǒng)迭代超越了簡單的視覺效果優(yōu)化開始,設計師們著手于探索如何利用光和物體去組成的數(shù)字空間,從而使用戶界面更易于理解、更平易近人和更美觀。
macOSBig Sur app icons,來自設計師 Max Rudber
五、慢慢地前進
為什么蘋果的新設計看起來有些糟糕呢?
正如之前提到的,「新擬態(tài)」的概念框架現(xiàn)在還相對較新,并且在設計行業(yè)中有許多抵制的聲音。長期以來,UI 設計行業(yè)一直被那些不考慮可用性或不滿足用戶需求的“創(chuàng)新設計師”所干擾,這引發(fā)了很多設計行業(yè)內(nèi)部的爭議。
一方認為,概念設計的探索就是這樣不斷的嘗試;另一方認為,UI / UX 設計對成功和失敗有非常具體的定義,沒有達到成功標準的作品就是失敗的(有些人認為所有設計學科都需要嚴格的解釋,但這些人是書呆子、是錯誤的)。
新擬態(tài)風格大熱,網(wǎng)絡上出現(xiàn)了許多將圖標變成 Big Sur 風格的教程,該教程圖片來自設計師 Oskar Groth。
設計師可以“探索”是否應該將用戶需要點擊的按鈕設置為不可見的,但由于這樣會導致用戶無法繼續(xù)操作,這個設計會被認為是失敗的。
在界面設計領域中,樣式創(chuàng)新和可用性很難平衡,但這并不意味著樣式創(chuàng)新應該被完全拋棄。
硬核的 UI / UX 設計師貶低幾乎所有樣式上的探索實驗,認為這是不必要的和不可靠的 —— 是在現(xiàn)實世界中不可能存在的東西(不具備商業(yè)價值和可用性,沒有存在的必要)。
一些排斥「新擬態(tài)」的原因來自于此,早期的深入研究集中于將「新擬態(tài)」風格中最具辨識性的特點應用到用戶界面中最明顯的地方,導致的結(jié)果是,一些應用了「新擬態(tài)」風格的地方破壞了用戶體驗設計的必要原則。
為了使「新擬態(tài)」發(fā)展到應有的狀態(tài),我們需要將它一點點拆分,獨立發(fā)展,逐步地實現(xiàn)。在某種程度上,蘋果為 macOS 11 設計的全新設計系統(tǒng)似乎是這種解耦實踐首次引起廣泛關注的實例。
蘋果的新設計采用了「新擬態(tài)」風格的元素,尤其是這些圖標中(所有的非 UI 元素)使用的光的復雜交互。
六、與以往一樣,第三方將比蘋果更大膽、更快速地推動這一風格
在某些地方,「新擬態(tài)」風格的實踐更加成功。
在二維圖標創(chuàng)作中使用三維效果打造「新擬態(tài)」風格,效果會更加突出,因此這些新圖標也更加成功(參考上文中設計師Vikiiing 使用三維效果繪制的圖標)。
以 Messages (信息應用)的圖標為例,語音氣泡的形象非常具象,深入人心,所以這個元素與光的交互方式是已知的。然而,將一些抽象的元素,進行三維化、物理化的轉(zhuǎn)換就不那么容易了。這就是「新擬態(tài)」風格受限的地方。
照片應用的圖標就是一個很好的例子,為了保持它的辨識度,設計幾乎沒有改變,但為了使其與整體的「新擬態(tài)」風格和諧,將一些陰影和外發(fā)光效果應用到了底部矩形圖層樣式上。
這增加了圖標的復雜性,卻沒有將該圖標與整套圖標成功融合。APP Store (蘋果應用商店)的圖標比照片應用的圖標稍微好一些,但原理是一樣的,即把一個二維線狀抽象圖形強硬的變成了三維樣式(直接增加光照和投影使其立體)。
如果想讓這樣的抽象圖形與整套圖標更加統(tǒng)一,就需要進行更深刻的反思,思考如果更好的將抽象圖形轉(zhuǎn)化為「新擬態(tài)」風格,消除用戶的困惑。
顯然,這些設計會隨著時間的推移被逐漸修改,直到它們開始形成一個更有凝聚力的整體。當你回顧 ios7 最初的「扁平化」設計時,你會發(fā)現(xiàn)很多地方都是粗糙的。
新字體(The Helvetica Neue)顏色太淺,整體外觀過于鮮亮。慢慢的,ios 的「扁平化」風格在不斷演進并且變得更加精致。
毫無疑問,蘋果進軍新市場嘗試「新擬態(tài)」風格也將是如此。事實上,蘋果向「新擬態(tài)」這一設計流派的發(fā)展,為這個概念賦予了合理性,現(xiàn)在任何希望融入蘋果新理念的設計師,都會充分利用「新擬態(tài)」風格進行創(chuàng)作。
現(xiàn)在,整個設計行業(yè)將認真對待「新擬態(tài)」風格,會獲得爆炸式的發(fā)展,在將其合理應用于用戶界面設計和功能方面取得更多進展。
與以往一樣,第三方將比蘋果更大膽、更迅速地推動這一風格 — 這也是我們將會真正開始釋放「新擬態(tài)」力量的時候。此外,蘋果可能會發(fā)布一個帶有更好圖標的更新版本。
原文作者:Jack Koloskus(Input 和 The Outline 的首席設計師)
原文地址:https://www.inputmag.com/design/apple-macos-big-sur-the-rise-of-neumorphism
譯者:張聿彤 ;公眾號:三分設
本文由 @三分設 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來自 Pexels,基于 CC0 協(xié)議
- 目前還沒評論,等你發(fā)揮!