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

2020-12-09 人人都是產品經理

編輯導語:如果你觀看了 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 設計風格

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

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

macOS系統圖標新舊對比

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

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

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

Vikiiing 的作品和 Big Sur 的對比

二、新擬態風格的崛起

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

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

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

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

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

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

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

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

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

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

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

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

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

四、向扁平化轉變

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

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

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

曾經的蘋果iOS 7 系統

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

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

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

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

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

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

五、慢慢地前進

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

這增加了圖標的複雜性,卻沒有將該圖標與整套圖標成功融合。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

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

題圖來自Unsplash,基於CC0協議

相關焦點

  • 如何升級手機IOS14和macOS Big Sur系統?
    一覺醒來發現蘋果發布會開了,微博刷屏全是ios14和big sur全新升級系統的優勢(當然也有不少熱心吃瓜群眾痴迷於找big的)。於是趕緊來一篇技術貼,這也叫蹭熱度。我也想升級ios14,怎麼辦呢?設置----通用-----系統-----軟體升級點完後發現提示,你的系統已經是最新系統13.5 。????? 不是 ios14嗎?然後你找,百度,各種問,人家說是這是測試版,要想看到新版本,必須有一個叫描述文件的東西。好吧,我幫你找了一個,記住是手機升級ios14用啊。
  • mac升級為macOS big sur菜單欄不顯示WiFi怎麼辦?
    終於下定決心,把mac升級成最新的大蘇爾系統,可是升級之後,問題來了,在菜單欄找不到WiFi圖標,怎麼辦?別著急,解決方法在這裡!1、如圖,桌面上菜單欄見不到WiFi圖標,怎麼解決?2、點擊bigsur左上角的蘋果圖標。
  • 兼容Big Sur 11.0最新版
    Parallels Desktop 16 破解版被稱為macOS上最強大的虛擬機軟體,可以在 Mac 下同時模擬運行 Win、Linux、Android 等多種作業系統及軟體而不必重啟電腦,並能在不同系統間隨意切換。
  • 2021年全球設計風格升級篇,這5種你了解多少?
    分享目錄如下:1、新擬物風格2、現代剪紙藝術風格3、新玻璃風格4、分形藝術5、蘋果風格#01.新擬物設計風格Neumorphism新擬物風格(Neumorphism)從去年底到今年新起的一種設計風格,在Dribbble上面非常火熱一種風格,它一直延續在到現在。
  • macOS 11 big sur正式版黑蘋果安裝圖解Clover版
    macOS 11 big sur正式版已發布許久,很多人都已經採用opencore來引導,而我嘗試了Clover,目前確實能引導,就是有些問題,文章後面會講。而macOS 11 big sur新版的安裝界面,也在此和大家簡單地展示一下安裝過程。另外我也驅動成功三卡,目前正常在用。
  • 【親測好玩】歐洲卡車模擬2 mac中文版(支持big sur)
    【親測好玩】歐洲卡車模擬2 mac中文版(支持big sur) 2021-01-08 16:13  名字一定要夠長
  • PD虛擬機在big sur系統下無法運行,怎樣解決?
    蘋果mac每次的升級更新,都會導致一些軟體無法使用,今天macz小編就向大家介紹下「MAC無法啟動Parallels Desktop,因為Mac作業系統中缺少某些必需的組件」問題的解決辦法。1.升級到新作業系統後,我們點擊PD軟體,此時會提示「MAC無法啟動Parallels Desktop,因為Mac作業系統中缺少某些必需的組件」,我們將彈出錯誤的窗口關閉,如下圖所示。2.然後搜索打開「終端」,如下圖所示。3.打開「終端」後,在終端命令行中,輸入「export SYSTEM_VERSION_COMPAT=1」,輸入完成後,回車,如下圖所示。
  • 像安裝手機軟體一樣安裝黑蘋果macOS Big sur,超簡單安裝教程01
    該方法來自B站Up主聰聰蘋果系統原生是安裝GPT格式的硬碟上,所以先要確定你的硬碟格式為GPT格式。工具截圖第一步 下載Mac Os系統:自己要安裝的Mac Os系統鏡像,下載後要解壓下載EFI+Oc引導:根據下載的Mac Os系統鏡像版本選擇
  • 如何在 Mac 和虛擬機上安裝 macOS Big Sur 11.0 正式版
    因平臺限制,第三方站點連結(如文中的軟體下載連結)無法顯示,可以訪問原文連結查看https://sysin.org/article/how-to-install-macos-big-sur/轉載請保留原文連結。
  • 蘋果macOS Big Sur系統體驗如何?的確有點卡
    經常有人在新系統即將推出時,才會升級到上一個系統的版本,他們認為在這個時候上一個版本才是最穩定的。有些人會認為他們過于謹慎,因為覺得存在一些bug並不會影響使用。不過,使用時間久了,慢慢能明白為什麼他們這樣選擇。
  • macOS Big Sur功能有哪些 macOS Big Sur全部功能匯總
    蘋果新版的macOS Big Sur系統在11月12日正式推送更新,這次發布的新macOS系統更新了哪些新功能,優化的功能又有什麼呢,這裡我們來一起看下這次新系統的介紹。
  • 蘋果推送macOS Big Sur 11.1系統的第一個開發者測試版
    蘋果今天為開發人員推送了 macOS Big Sur 11.1 更新的第一個 Beta 版本,供測試人員使用,該 Beta 版本是在 macOS Big Sur 11.0.1 發布後五天推出的。從蘋果開發者中心安裝適當的配置文件後,開發人員可以使用「系統偏好設置」中的「軟體更新」機制下載 macOS Big Sur 11.1 Beta。據悉,macOS Big Sur 11.1 尚無任何功能性更新,但可能包括性能改進,安全更新以及針對 macOS Big Sur 正式版中無法解決的錯誤修復。
  • 蘋果向用戶推送macOS Big Sur 11.0.1正式版系統
    原標題:蘋果macOS Big Sur正式版推送!能運行原生iOS App   前幾天,蘋果在新品發布會上介紹,macOS Big Sur正式版將於11月12日(當地時間)進行推送。北京時間11月13日凌晨,蘋果方面正式向用戶推送了macOS Big Sur 11.0.1正式版系統,用戶們現在已經可以升級體驗。
  • 蘋果系統macOS Big Sur,自帶五筆輸入法意外好用
    macOS Big Sur系統帶來了不少新功能和性能改進,其中包括自帶五筆輸入法。現在我已經轉用自帶的五筆輸入法,放棄一直使用的「搜狗五筆輸入法for Mac」。不過,這兩點已經在macOS Big Sur系統自帶五筆輸入法作出了修改。1、增加了五筆版本供用戶選擇。在新系統中,自帶五筆輸入法具備了「86版」、「98版」或「新世紀版」,用戶可以指定要使用哪一個版本。
  • 蘋果邀請測試macOS Big Sur郵件標題出現差錯
    今天蘋果發布了 macOS Big Sur系統,這是 macOS 這款先進桌面作業系統的最新版本。macOS Big Sur 採用全新的精美設計,讓人耳目一新又倍感熟悉。
  • 蘋果MacOS BigSur更新導致部分舊款MacBook故障
    上周,蘋果為用戶推送了MacOSBigSur系統的正式版,作為MacOS11的第一個版本,BigSur帶來了一系列的變化,同時也帶來了對ARM處理器的支持。不過對於老的MacBook用戶來說,新系統卻帶來了不愉快的體驗。
  • 蘋果macOS Big Sur軟體更新Bug導致系統管理員出現問題
    打開APP 蘋果macOS Big Sur軟體更新Bug導致系統管理員出現問題 威鋒網 發表於 2020-12-21 11:40:10
  • macOS Big Sur 讓Mac帶給你更多可能
    【天極網筆記本頻道】北京時間6月23日凌晨,蘋果召開了WWDC 2020全球開發者大會。這也是蘋果首次將WWDC這個級別的發布會放到線上舉行。耀眼的iOS 14、iPadOS 14等核心系統迎更新,可不能忘記同樣意義重大的macOS。此次macOS更新到了「Big Sur」大瑟爾版本,讓我們一起來看看有什麼不同吧!
  • 蘋果宣布全新macOS Big Sur:十年來最大升級
    除了移動端最受關注的iOS 14、iPadOS 14,蘋果還更新了桌面版的macOS作業系統,全新版本代號「Big Sur」(大瑟爾),版本號11.0。 macOS Big Sur號稱是蘋果的全新開始,OS X以來最大規模的UI升級,整體風格更符合現在的流行趨勢,對話框變為純白和純黑,圖標風格更加統一,Dock重新設計,Messages等圖標換新,Photos、Mail等界面升級
  • 設計新趨勢:玻璃擬態是什麼?如何實現該效果?
    大家好,我是聿彤,設計趨勢總是處於不斷的變化當中,近幾年擬物風格又以新的形式——新擬態回歸大眾視野,蘋果發布了 MacOS Big Sur 作業系統,整體風格應用了新擬態的設計思路