蘋果 macOS Big Sur 系統對于新擬態風格的探索

0 評論 4506 瀏覽 10 收藏 18 分鐘

編輯導語:如果你觀看了 2020 年的蘋果全球開發者大會(WWDC),或者是在不經意間注意到蘋果發布的一些公告,可能會注意到一些新東西。除了 iOS 14、iPadOS 14 等新系統外,蘋果還發布了全新的 macOS 版本,不再是 X,而是新版本號 macOS 11(又名 Big Sur)。Big Sur(大瑟爾)是位于美國加利福尼亞西部中海岸的一段多山區域,常以景色秀麗聞名,曾經被《國家地理》雜志評為“人一生要去的 50 個地方”之一,這個系統命名遵循了 macOS 最近幾年都用加州景色取名的習慣。

一、新風格帶來的碰撞

蘋果表示,新操作系統帶來了自 macOS 10 推出以來最大的設計變革,更新了Safari 瀏覽器,優化了信息、地圖和隱私保護等功能,帶回了經典的開機提示音……macOS Big Sur 借鑒了 Apple iOS 的許多元素,在控制中心中可以更改屏幕亮度、在通知中心中設置相關通知分組。

應用的窗口都變成了大圓角,應用圖標也統一成圓角矩形,進行了整體更新升級,與整個 Apple 生態系統的風格變得更統一,同時也保留了 Mac 的鮮明特色。

1. macOS Big Sur 設計風格

蘋果 macOS Big Sur 系統對于新擬態風格的探索

左:新 icon(Big Sur),右:舊 icon(Catalina)

從 macOS Big Sur 系統的發布測試版本開始,就出現了大量的爭議。關于圖標,大量的反饋是太丑了,作為設計師,也不是很理解這種生硬的深色投影。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

macOS系統圖標新舊對比

這些爭議引起了對 Big Sur 系統圖標進行優化的風潮,期間涌現出一批優秀的作品。印象較為深刻的是來自 Vikiiing 的作品,他使用了 C4D 的三維技巧對系統圖標進行了重新設計。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

蘋果 macOS Big Sur 系統對于新擬態風格的探索

蘋果 macOS Big Sur 系統對于新擬態風格的探索

蘋果 macOS Big Sur 系統對于新擬態風格的探索

蘋果 macOS Big Sur 系統對于新擬態風格的探索

蘋果 macOS Big Sur 系統對于新擬態風格的探索

蘋果 macOS Big Sur 系統對于新擬態風格的探索

蘋果 macOS Big Sur 系統對于新擬態風格的探索

Vikiiing的 3D Big Sur 圖標作品(www.dribbble.com/Vikiiing)

這一組 3D 圖標作品配色明亮、質感細膩、過渡自然,使用三維技巧使其光影和細節的表現更加豐富。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

Vikiiing 的作品和 Big Sur 的對比

二、新擬態風格的崛起

無論是蘋果官方的這套圖標還是 Vikiiing 設計的這組 3D 圖標,你都可以將其歸類于一種叫做「新擬態」的設計風格,「新擬態」在設計媒體上已經流行一段時間了,大多數人對這種風格持有否定的態度。

對于「新擬態」風格的批評,主要是因為早期的實驗性作品過于關注設計的差異性,不考慮實際的可用性。

但是,如果你跳脫出目前看到的「新擬態」實踐作品(通常是由專注形式主義而非可用性的設計師創作的作品),去關注「新擬態」的基本概念,會發現其中確實有一些相當令人興奮的東西,并且是可持續發展的,很多都還沒有完全被實現。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

新擬態風格實驗的例子(設計師 Filip Legieski 作品)

三、「新擬態」關注于光是如何在三維空間中運動的

「新擬態」的前身「擬物態」,通過模擬真實物體表面的紋理效果,在數字界面中創造出真實感,就像撲克桌上的毛氈質感或錄音機外殼的金屬拉絲紋理。

實現這種設計風格的一個輔助元素是光,光與所展示的材料發生了真實的相互作用,這就是為什么投影和背光面在早期界面中普遍使用的原因。

但是「擬物態」時期模擬光照和紋理的表現手法仍然相對簡單:哪些對象是有光澤的,哪些是粗糙的,哪些物體是透明的……這些最終都是功利主義,且有些武斷的選擇(設計師或團隊主觀的選擇,或是服從大多數人的意愿、考慮群體利益而做出的選擇)。

「新擬態」與其前身「擬物態」的區別是「新擬態」聚焦在光本身、以及光是如何在一個純凈的數字空間中與各種物體進行交互的?!感聰M態」中的光模擬更加復雜,關注物體之間的光照影響(折射/反射),或者使用什么樣的光線可以更好的表達物體本身的功能。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

還記得早期的蘋果系統界面嗎?

「新擬態」出現之初引起非常多爭議的設計案例,是將白色的 UI 元素放置在白色的背景上,元素和背景的差異僅僅通過元素與光的相互作用而產生,來自頂部的光照(高光)和來自底部的陰影(投影)表明 UI 元素是位于背景上層的。

在這種風格被廣泛應用之前,還需要進一步研究,提高其可用性。但是,它展示了「擬物態」所沒有的 ——一種全局照明模式的概念,這種模式超越了單獨的對象,展示了光對同一空間內多個對象是如何相互作用的。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

蘋果 macOS Big Sur 系統對于新擬態風格的探索

新擬態風格的全局照明模式(設計師 Elena Zelova 作品)

四、向扁平化轉變

在 2010 年代早期,「擬物態」逐漸消逝,「扁平化」風格開始流行起來,這使得色彩和設計元素的表現手法更加廣泛,且富有表現力。不受物理世界的束縛,元素可以變成任何顏色,空間可以更好地利用。通過去除不必要的裝飾,設計師可以自由探索。

「扁平化」設計占主導地位的近十年里,在可用性和用戶體驗領域取得了許多重大進展。

但隨著時間的推移,「扁平化」風格泛濫,物理性的再次引入吸引著人們開始重新研究三維設計,思考將「扁平化」時期獲得的經驗帶入三維環境的可能性,對三維世界的研究變得更加深入。于是時光開始倒轉,設計風格在輪回之中尋找變化。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

曾經的蘋果iOS 7 系統

拋開批評不談,「新擬態」有一個不可否認的特點,使其非常吸引人 ——看起來十分新穎。在過去的八年多的時間里,「扁平化」的設計風格和技術實現方式,以及頁面和圖層的概念,已被人們所熟悉。

「新擬態」與用戶已經習慣的「扁平化」風格非常不一樣,它像是一種全新的視覺語言。這種差異化是有價值的,特別是對于像 Apple 這樣的公司而言,這是 19 年來首次嘗試將其操作系統升級到新的版本編號。

iPhone 于 2007 年發布,2013 年推出 iOS 7 的「扁平化」設計。這一基本外觀和感覺比最初的「擬物態」iPhone UI 保留了更長的時間,每次的優化迭代的改動也很細微。

「新擬態」風格提供了一種低成本的方法,在不對設計語言進行大規模修改的情況下,推進設計風格的更新(實現「新擬態」風格最基本的方法就是添加陰影、外發光和少量的 3D 元素,非常簡單)。

「新擬態」風格真正變得有趣,是從系統迭代超越了簡單的視覺效果優化開始,設計師們著手于探索如何利用光和物體去組成的數字空間,從而使用戶界面更易于理解、更平易近人和更美觀。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

macOSBig Sur app icons,來自設計師 Max Rudber

五、慢慢地前進

為什么蘋果的新設計看起來有些糟糕呢?

正如之前提到的,「新擬態」的概念框架現在還相對較新,并且在設計行業中有許多抵制的聲音。長期以來,UI 設計行業一直被那些不考慮可用性或不滿足用戶需求的“創新設計師”所干擾,這引發了很多設計行業內部的爭議。

一方認為,概念設計的探索就是這樣不斷的嘗試;另一方認為,UI / UX 設計對成功和失敗有非常具體的定義,沒有達到成功標準的作品就是失敗的(有些人認為所有設計學科都需要嚴格的解釋,但這些人是書呆子、是錯誤的)。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

新擬態風格大熱,網絡上出現了許多將圖標變成 Big Sur 風格的教程,該教程圖片來自設計師 Oskar Groth。

設計師可以“探索”是否應該將用戶需要點擊的按鈕設置為不可見的,但由于這樣會導致用戶無法繼續操作,這個設計會被認為是失敗的。

在界面設計領域中,樣式創新和可用性很難平衡,但這并不意味著樣式創新應該被完全拋棄。

硬核的 UI / UX 設計師貶低幾乎所有樣式上的探索實驗,認為這是不必要的和不可靠的 —— 是在現實世界中不可能存在的東西(不具備商業價值和可用性,沒有存在的必要)。

一些排斥「新擬態」的原因來自于此,早期的深入研究集中于將「新擬態」風格中最具辨識性的特點應用到用戶界面中最明顯的地方,導致的結果是,一些應用了「新擬態」風格的地方破壞了用戶體驗設計的必要原則。

為了使「新擬態」發展到應有的狀態,我們需要將它一點點拆分,獨立發展,逐步地實現。在某種程度上,蘋果為 macOS 11 設計的全新設計系統似乎是這種解耦實踐首次引起廣泛關注的實例。

蘋果的新設計采用了「新擬態」風格的元素,尤其是這些圖標中(所有的非 UI 元素)使用的光的復雜交互。

六、與以往一樣,第三方將比蘋果更大膽、更快速地推動這一風格

在某些地方,「新擬態」風格的實踐更加成功。

在二維圖標創作中使用三維效果打造「新擬態」風格,效果會更加突出,因此這些新圖標也更加成功(參考上文中設計師Vikiiing 使用三維效果繪制的圖標)。

以 Messages (信息應用)的圖標為例,語音氣泡的形象非常具象,深入人心,所以這個元素與光的交互方式是已知的。然而,將一些抽象的元素,進行三維化、物理化的轉換就不那么容易了。這就是「新擬態」風格受限的地方。

蘋果 macOS Big Sur 系統對于新擬態風格的探索

照片應用的圖標就是一個很好的例子,為了保持它的辨識度,設計幾乎沒有改變,但為了使其與整體的「新擬態」風格和諧,將一些陰影和外發光效果應用到了底部矩形圖層樣式上。

這增加了圖標的復雜性,卻沒有將該圖標與整套圖標成功融合。APP Store (蘋果應用商店)的圖標比照片應用的圖標稍微好一些,但原理是一樣的,即把一個二維線狀抽象圖形強硬的變成了三維樣式(直接增加光照和投影使其立體)。

如果想讓這樣的抽象圖形與整套圖標更加統一,就需要進行更深刻的反思,思考如果更好的將抽象圖形轉化為「新擬態」風格,消除用戶的困惑。

顯然,這些設計會隨著時間的推移被逐漸修改,直到它們開始形成一個更有凝聚力的整體。當你回顧 ios7 最初的「扁平化」設計時,你會發現很多地方都是粗糙的。

新字體(The Helvetica Neue)顏色太淺,整體外觀過于鮮亮。慢慢的,ios 的「扁平化」風格在不斷演進并且變得更加精致。

毫無疑問,蘋果進軍新市場嘗試「新擬態」風格也將是如此。事實上,蘋果向「新擬態」這一設計流派的發展,為這個概念賦予了合理性,現在任何希望融入蘋果新理念的設計師,都會充分利用「新擬態」風格進行創作。

現在,整個設計行業將認真對待「新擬態」風格,會獲得爆炸式的發展,在將其合理應用于用戶界面設計和功能方面取得更多進展。

與以往一樣,第三方將比蘋果更大膽、更迅速地推動這一風格 — 這也是我們將會真正開始釋放「新擬態」力量的時候。此外,蘋果可能會發布一個帶有更好圖標的更新版本。

 

原文作者:Jack Koloskus(Input 和 The Outline 的首席設計師)

原文地址:https://www.inputmag.com/design/apple-macos-big-sur-the-rise-of-neumorphism

譯者:張聿彤 ;公眾號:三分設

本文由 @三分設 翻譯發布于人人都是產品經理,未經許可,禁止轉載。

題圖來自 Pexels,基于 CC0 協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發揮!