前蘋果設計師無意「曝光」了 iPhone 的新軟件設計_iPhone|軟件|ios7

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

文章圖片

本文譯自前蘋果設計師、Halide 相機創始人 Sebastiaan de With 的博文《物理性：UI 設計的新世代》，原文鏈接：Physicality: the new age of UI
作為曾經的 iOS 設計師，現在是一個激動人心的時刻，我的職業世界正在因為神秘感而顫抖和轟鳴。關于 iPhone 操作系統即將進行大規模改版的傳聞甚囂塵上——據說是「長久以來規模最大的一次」。
只有一個時刻可以與此刻相比：2013 年春天。 2013 年 6 月 10 日，蘋果發布了或許是 UI 設計史上最偉大的轉變：iOS 7 。我清楚地記得當時的感受：無以言表的震撼。
如果蘋果今年真的對 UI 做重大改版，那它會在很多方面產生深遠的影響，甚至讓 iOS 7 的「巨變」都相形見絀。據傳，此次改版將全面涵蓋 iOS、macOS、iPadOS、tvOS、watchOS 和 visionOS 。而從 iOS 7 發布至今的這些年里， iPhone 已經從單純的流行設備發展成了人們生活中最重要的東西。 iOS 的設計影響并啟發了我們身邊的方方面面，從網頁設計到平面設計，再到幾乎所有的軟件界面。
我認為應該利用這個傳聞方興未艾的時刻，趁著最終成品還在幕后的機會，去品味一些東西：因為對事物發展方向的完全未知，我就可以讓我的想象力自由馳騁。
如果我是蘋果的設計團隊，我會怎么做？我希望看到哪些變動，以及哪些是最有可能實現的？考慮到技術的發展方向，界面設計應該如何適應大改版的需求？
讓我們看看接下來會、或者可能會，發生什么吧。
最明智的做法就是以史為鑒。如果要對 iOS 設計的發展階段進行分類，我們可以粗略地將其分為「陰影時代」、「適應性時代」和「新時代」。

陰影時代（The Shaded Age）iOS 的起點是 iPhone OS ，一個（對于那時來說）全新的操作系統，其風格與 Mac OS X Tiger 中的儀表板（Dashboard）功能的設計語言非常相似：
via https://numericcitizen.me/what-widgets-on-macos-big-sur-should-have-been/
使用 macOS 儀表板圖標做 app 的早期 iPhone 原型機
iPhone OS 1 上的圖標布局明顯是擬物化的。
擬物化，你應該聽過這個詞。但擬物化并不單純意味著界面上有很多視覺效果，比如漸變、光澤和陰影。它的真正含義是：為了讓用戶更容易從他們習慣的東西（比如一小片塑料屏幕加上一排排按鈕的功能機）過渡到目前的形態（手機變得以屏幕為主，可以顯示任何你能想像出的按鈕或界面）。
在初代 iPhone 剛發布的那段時間，動畫里面的手機還是會被畫成左邊的樣子，按鍵的網格決定了操作模式和舒適區域
當然，從 iPhone OS 1 到 iOS 6 ，用戶界面中的確出現了大量的視覺效果。在 iOS 界面的陰影時代，我們可以看到從簡單界面元素中的漸變和陰影，到音頻應用程序中逼真的磁帶錄音機和麥克風，等等各種豐富的細節。
Facebook 的分享頁面真的有個回形針！iOS 地圖的路標真的是由幾百個小三角形組成的！
而我在蘋果工作期間，還參與過一些更有趣的表現形式。以我的經驗來說，這個時期我們所做的工作，很大程度上是通過細致和廣泛的視覺效果來營造熟悉感。我們花了很多時間用 Photoshop 繪制逼真的陰影按鈕、虛擬木材、皮革以及更多材質。
因此 iPhone OS 1 到 iOS 6 這段時間稱為“擬物化設計” ，我覺得這個詞用的不太恰當，但整體思路是沒錯的。
不過當然，麥克風的金屬材質實際上并非真正的金屬——它對光線的反射效果與現實中的金屬材質完全不沾邊，它的行為也與它所模仿的物體截然不同。它只是一種效果、一種純粹的視覺效果，幫助用戶理解語音備忘錄應用的工作原理，至于 iPhone OS 1 的整個用戶界面都遵循著這種設計，以盡可能方便用戶理解使用。
值得注意的是，這種理念同樣延伸到了 UI 中最小的元素：按鈕。 iOS 中的按鈕會被設計成凸起或凹陷的視覺效果，使其看起來更像真的按鈕；禁用的項目通常會被處理得更簡潔（變灰、變透明），以降低其交互性。這些都通過大量的靜態位圖（bitmap）素材實現的。
漸漸的，一些更活潑的設計才開始顯現：在 iPad 上，部分金屬滑塊的光澤可以響應設備方向；刪除筆記或電子郵件的效果不是直接消失，而是被拖入回收站的圖標，垃圾桶甚至會先打開蓋子、在文檔被吸入后重新關上。
然而我們的全新的視網膜屏幕，即將見證一次應用程序和屏幕信息呈現方式的徹底轉變。

扁平的時代（The Flat Age）iOS 7 為 iOS 帶來了一種全新的設計語言，當時有很多文章對此進行了探討。正如任何一次重大改版一樣，用戶社區的情緒也相當激動。我很少直接發表個人意見，但無論你對 iOS 7 的印象如何，不能否認的是，它是對 iOS 視覺設計的一次根本性反思。
iOS 7 在很大程度上取消了用于提示可交互性的視覺效果（比如一個凸起的按鈕），而是回歸了個人電腦上那種最原始的展示方式：「按鈕」只不過是白色背景上的藍色文字而已。
iOS 7 時代的設計風格也因此通常被稱為「扁平化設計”」。你可以理解為什么叫這個名字，因為就連計算器應用中的按鈕，在視覺上也沒有任何層次的凸起：
主屏幕曾經所指代的就是功能機上面整齊排列的按鍵，但現在看起來也平坦了許多——部分是因為視效處理的更簡單，更主要的則是明顯減少了陰影的使用。
但為什么非要去掉陰影呢？畢竟，它們對于定義界面元素的「深度」起著重要作用。上面的截圖實際上并不直觀，因為圖中的陰影都是靜態的。事實上， iOS 7 上全新的主屏幕絕非看起來那么平。
iOS 7 引入了一種獨特的「視覺層」概念，用自適應或動態效果來區分界面深度和層級。那么，既然可以通過將圖標渲染在背景以外的層級來區分，為什么還要渲染無法匹配現實邏輯的高光和陰影呢？僅僅依靠視差效果，就已經使圖標清晰地“漂浮”在壁紙上方了，而通知中心也可以簡化為主屏幕上方的一個磨砂窗格，模糊其背景以顯示上下文。
喬納森·艾維在 iOS 7 發布會上自豪地談：「簡單通過設置不同的壁紙」就可以影響許多界面的外觀，這在當年是一個非常新穎的體驗。
iOS 7 界面中的另一個新特點是 UI 框架（指除了主要元素之外的界面元素，比如按鈕外輪廓）具有相同的動態設計：標題欄和鍵盤等像是磨砂玻璃一樣，可以部分顯示下方被遮擋的內容。
雖然在某些地方有些矯枉過正， iOS 7 的根本性改變最終還是在后續的 iOS 中保留了下來——盡管動效被大幅削弱（主屏幕的 app 圖標視差現在幾乎難以察覺），隨著時間的推移， iOS 的系統 UI 逐漸收獲了更多的靜態效果。
圖標和字體都變得更厚重了，陰影也被加了回來，顏色則變得不像霓虹燈那樣鮮艷
【前蘋果設計師無意「曝光」了 iPhone 的新軟件設計】時至如今， iOS 的主要變化之一是變得更圓潤了；隨著越來越圓的屏幕邊角和越來越圓的 iPhone 的出現，用戶界面也在隨之變化，甚至是根據運行設備的不同而動態地進行調整。
越來越多的界面元素開始通過不同類型的模糊效果（比如新的漸進模糊）與內容融合，按鈕形狀也開始慢慢回歸。 iOS 逐漸進入了穩定狀態——但也略顯停滯。如果真的需要一次大的變革，則必須要進行一些根本的重塑才行。
新的 iOS 設計變革將不再是簡單的靜態位圖，它必須延續「自適應界面」的趨勢。

物理性時代（The Age of Physicality）當蘋果的設計師們構思 visionOS 的界面時，收到的要求是「從零開始」。但是在增強現實中，應用程序應該是個什么樣子呢？
visionOS 設計語言的基本原則似乎是要求，界面元素始終由「真實」的材質構成，不能存在任何純二維的面板或者色彩。
這條原則也適用于 app 圖標，雖然它們具有單向的顏色漸變，但都擁有自己獨立的層次，從介紹視頻中也可以清楚地看出它們所模仿的真實材質：
Alan Dye（蘋果負責人機界面設計的副總裁）在介紹 visionOS 界面時表示：每個元素都經過精心設計，具有豐富的物理感——它們具有維度、能夠對光線做出動態響應，并相互投射陰影。
這樣的設計在 Vision Pro 中至關重要，因為 app 的界面就該讓人感覺它能夠自然地融入你周圍的世界，并擁有與現實空間中物體一樣豐富的質感。與我們熟悉的界面相比，這種范式的轉變意義深遠，因為它會讓所有老舊、缺乏實體感的界面顯得過時。
甚至如果我們強行將一個普通的 UI 界面放置在 Vision Pro 環境中，結果看起來就很好笑：
因此我認為， visionOS 可以為 iPhone、iPad 和 Mac（以及其他潛在的新硬件平臺）帶來的東西，將遠遠不止上述靜態的視覺風格，而很可能是一套全新的設計原則，用來支撐下一個世代蘋果所有產品和品牌表達的風格。
這套設計原則必須比 Vision Pro 現有的更加微妙——畢竟界面不必與現實世界達到 100% 的契合，但新的動態效果和環境行為足以讓界面變得字面意義上「栩栩如生」。
聽起來很熟悉？其實現在 iPhone 上的一個 UI 已經達到了這樣的高度：
蘋果近年來為 iOS 新增的功能與 UI 的其他部分相比有著顯著的不同，其中代表性的就是靈動島。
靈動島的界面全部是動態的，擁有與真實材料和物體相似的特性。從某種意義上說，靈動島其實回歸了擬物化界面——但不再是給所有元素都噴上高光漆，而是通過清晰與高度圖形化的界面，讓靈動島的行為類似我們在現實生活中熟悉的事物，或者「更有可能」存在于這個世界中——這就是新的擬物化，也就是一種物理性（physicality）。
靈動島是一個鮮明的圖形界面，動畫的行為就像一種可以用手指撥動的粘稠液體：
此外，當液體各部分相互接觸、融合在一起的時候，我們還能看到非常代表性的液體特性，比如表面張力。
而當它加速時，動畫也隨之有了慣性，就像 iPhone OS 第一次更新里面的滾動列表一樣，不過靈動島的交互動畫顯得更真實一些，因為它還有帶方向的動態模糊，以及畫面元素離開焦點之后的失焦。
與之相似的還有新的 Siri 動畫，繞屏幕一周的閃光更像是符合物理規律的真實發光效應——類似吸附在 iPhone 邊緣的熾熱氣體或薄霧發出的光，通過用戶按按鈕或者語音喚醒而閃耀出來。
更進一步又會變成什么樣呢？

我對新世代的看法：有生機的玻璃（living glass）我打算試想一下接下來會發生什么——既通過我自己繪制的 UI 設計，同時也通過重新思考一下這個新世代的設計哲學。
蘋果比較合乎邏輯的下一步操作，有可能是將 vision OS 設計理念中的物理性擴展到所有的產品線。其實不需要過度處理，在現有的基礎上稍微調整一下，就可以讓界面擁有帶觸覺的真實感（inhabit a sense of tactile realism）。
從設計理念上來說，如果我是蘋果，我會將這套新的界面描述為一套「終于配得上我們精美硬件的界面」。畢竟蘋果最主要的產品都帶著玻璃屏幕，新的設計可以帶來與材質相匹配的界面，讓用戶感覺玻璃本身也煥然一新。
Wallpaper 網站專訪蘋果設計團隊時收到的 visionOS 設計稿細節
按鈕和其他 UI 元素可以擁有系統級的渲染處理，就像 visionOS 在真實環境的背景之上渲染窗口一樣。 *
*就視覺效果而言， VisionOS 是一個非常有趣的平臺，因為為了確保隱私和安全，該操作系統從設備攝像頭獲取的數據非常少。我猜 UI 上負責合成磨砂玻璃的視覺效果的，實際上是負責處理透傳和攝像頭信號反饋的 R1 芯片——換句話說，理論上所有 Apple 設備都可以做到這一點，它們已經針對背景虛化等功能進行了系統級效果合成。
我還花了一些時間來設計和構思新時代的系統外觀和工作原理。對于新的設計語言來說，就像在 visionOS 上一樣，交互介質采用玻璃也是合理的：
玻璃會受到環境的影響——比如屏幕顯示的內容、其 UI 上下文等等。
由于它具有反射性，玻璃元素能夠映射周圍環境；在照片和視頻等內容中非常明亮的高光，甚至可以直接以 HDR 去顯示。
玻璃元素在視覺上占據了一個明確的空間層級；但如果沒有明顯的分層，元素可以被嵌入（inlaid）進去：換句話說，變成顯示器或 UI 的玻璃層面的一部分。
就像 iPhone 背面磨砂玻璃上亮面的蘋果 logo 一樣，控件或者 UI 元素也可以用不同的材質處理或配色方式。這些處理甚至會對界面中其他發光元素或設備朝向產生相應——比如在光線照射下會略微變化，類似在 visionOS 中觀察窗口時那樣。
而控件的轉場動畫則可以從開始覆蓋內容時開始。我們可以想象按鈕從背景中「浮起」并脫離的動態狀態，更清晰的展示出層級的變化。
這些效果可以由系統以微妙而動態的方式進行渲染。相比之下，傳統的靜態界面看起來就顯得呆板、缺乏生命力。
玻璃擁有一系列鮮明特性，使它與內容區分開來。它可以模糊其下方的材質——比如我們在現有 iOS 控件中看到的那樣。它還能根據周圍環境呈現出明顯的、高動態的鏡面高光。
一種拖拽式曝光控制按鈕，是我們在 Halide app 中新版曝光調節的變種，你可以注意到按鈕的材質會反射周圍的高光
除了高光，磨砂玻璃還可能呈現出散焦效應，既通過投射光線（而非陰影）來展現自己與背景的互動，從而實現與環境的分離。
此外，它還能夠吸收并融合周圍界面的配色與主題。磨砂玻璃的作用不僅僅是模糊或折射背景，它還能反射。甚至這種處理并非沒有例子，我們在 WWDC25 的主視覺宣傳圖里實際上已經看到了效果：

風格元素（Elements of Style）在建立起統一的視覺標準之后，我們來看看新 iOS 可能會采用的具體元素。

標簽欄首先，我認為「封閉式標簽欄」——那種橫跨整個屏幕的標簽欄——的時代即將結束。實際上，如果蘋果這次將所有遮擋式的 UI 元素都拋棄，我也不會感到驚訝。
這類靜態面板是 iOS 很早期遺留下來的設計。而新的設計應該可以「漂浮在」顯示內容上：
像這樣的浮動控件更適合在滾動的時候從下層面板中「升起」，并在不需要時自動進入隱藏位置，從而避免遮擋內容。

控件但如果一個界面中所有元素都采用富材質處理，很可能會讓人感到視覺負擔過重。因此像前面提到的，我估計這種界面的「層次感」會按照不同的等級去應用。
比如郵件 app 中發送的主操作按鈕可能會被抬升到更高的 z 軸高度，而其他的操作（比如取消）則可以采用更低調的處理：
抬升的控件可能使用偏暖的色調，而背景元素則偏向冷色，以增強深度對比。

App 圖標蘋果在 iOS 18 中對圖標進行了大量的自動化遮罩處理，我不認為這只是為了幫助第三方 app 適配暗黑模式或者給圖標批量施加色調。對于圖標背景的這種簡潔的深色處理，讓我覺得這可能是在為未來更動態的材質背景做準備。
暗色模式下的動態圖標背景——注意背景上與環境呼應的高光反射
更不用說， app 圖標本來就是那種交互性強、適合采用「有生機的玻璃」處理的漂浮元素。
新版動態渲染的圖標包含了「內容層」、玻璃質感的效果以及對既有元素的優化，背景圓角同樣有所增大
此外，我猜一些早該重繪的圖標會在這波中趁勢更新，比如很多自 iOS 7 以來就沒有變化的圖標。這會是蘋果對「核心品牌」圖標的一次重大變動，估計新圖標會在保留原有辨識度的同時融入新的視覺語言——比如可以參考新的 Safari 圖標處理。
此外，如果所有按鈕圖示都變得更圓了，我也不會感到驚訝。

主屏幕整個主屏幕系統都可能會迎來首次重新構想。從 iOS 初期至今，主屏幕的復雜性和功能性都已經大幅增加。如今我時常要在 App Library 中花時間尋找應用。
整體來說，我認為可以期待一種基于 AI、能夠進行上下文感知的滑出式界面，它可以與我們熟悉的網格式界面共存。只是我這次沒來得及畫出原型。

滑塊與托盤作為 iOS 界面的基本交互組件，滑塊和托盤將獲得系統級的新材質處理，并對周圍的顯示環境做出響應。
簡而言之，可以想象 UI 界面變得更加圓潤柔和，呈現出半透明材質所帶來的美感。

更進一步這看似「簡單」的材質更替——從色彩轉向動態的玻璃風格——其實具有深遠的影響。
蘋果是很特殊的一家公司——這種來自 2000 年左右的標志性界面風格一直都與它的品牌風格保持著緊密聯系。它的圖標同時還是 logo ，而圖標的材質處理則是一種設計母題，遠遠超越了操作系統平臺本身。比如你從蘋果官網的導航欄中也能看出這種一致性：
蘋果官網的導航欄基本是與不同時代的設計風格相呼應的：2000 年以來 Aqua 風格的推出和成熟、2008 年 iPhone 與 Mac OS X 引入的柔和漸變，以及 2014 年以來的扁平化趨勢
我們可以合理預期它會采用某種更具動態性的新風格。而這本身也帶來了設計挑戰。
我自己非常喜歡那些富有創新性和趣味性的 UI ——現在的 iOS 早已不再是一個產品，而是一個完整的平臺。它的設計者要確保系統在各種非標準使用場景下依舊能保持美感，即便第三方開發者總是在提出各種出乎意料的界面需求。這就引發了一個問題：我們如何迎接一個更加復雜的新界面設計范式？
理想情況下，這將催生出全新的一套設計工具，用來構建比一堆圓角矩形和簡單陰影效果復雜得多的界面。
回想過去，我在「舊時代」設計各種出挑的界面時，主要還是靠 Photoshop —— 并非因為它專為 UI 設計而生。恰恰相反，是因為 Photoshop 足夠自由，從一個簡單按鈕到綠色絨面的牌桌都可以畫出來。
如果 WWDC 公布的內容與我設想的相近，那這將是一次真正的巨變。隨著我們的設備變得更具「環境感知」，交互界面自然也會融入更多動態元素，我們的數字世界終于能變得與現實世界相契合。那些不透明、靜態、阻礙視線的 UI 元素，也許終將像命令行界面一樣成為一段歷史的標記，被多任務圖形界面所取代。

科幻與玻璃的科幻未來的計算界面其實很容易想象。我們在未來到來之前就已在科幻作品中設想它們的存在：iPhone 類似于《星際迷航》中的三錄儀（Tricorder）的現代版；很多 AI 應用看起來像是電影《她》或《銀翼殺手 2049》中的設備。因此，各種技術概念展示中出現這種「玻璃的科幻」界面也就不足為奇了，比如微軟的概念視頻：
這是一套漂亮的、令人心馳神往的 UI ，卻只存在于微軟廣告的幻想世界里
但現實中的界面，往往并沒有那么活靈活現。原因很簡單：一方面，視頻中的「活體玻璃」還是過于理想化了，另一方面，能夠真正在產品里實現軟件與硬件深度融合的界面渲染的企業寥寥無幾。
盡管如此，我們依舊希望界面能夠充滿生機與喜悅——正如現實世界一般，但我們的軟件界面大多仍然是死氣沉沉的。
這也將話題重新帶回了蘋果這兒。蘋果曾在發布會的一些特殊時刻反復強調：「只有蘋果能做到這件事」（Only Apple can do），這是一種設計與工程的完美結合，是技術與人文藝術的融合。、
這在今天依舊如此——只有蘋果能在硬件層面實現像素級抗鋸齒和流暢無中斷動畫，才能推出如靈動島和多任務手勢操作；只有蘋果能在 Vision Pro 上集成兩個芯片、兩個操作系統，以實現 vision OS 中 UI 動態材質的合成。
也許，只有蘋果能夠將你的屏幕玻璃賦予生命，推進人機界面邁入下一時代。
我們將在 WWDC 上見分曉。至于我最期待的，還是或許只有蘋果能夠帶來的，那種深思熟慮、充滿靈感的設計與工程融合。

關于作者Sebastiaan de With 是一位荷蘭設計師和攝影師，以其在科技產品界的工作和對攝影藝術的熱情而聞名。 Sebastiaan 曾在蘋果公司擔任設計師，參與了 MobileMe（iCloud 前身）與 Find My 等項目，也曾為索尼、惠普、EA、甲骨文等等知名公司做過設計工作。
目前，他最廣為人知的身份是相機應用 Halide的聯合創始人和設計師，這款多功能專業相機軟件自從上架以來就屢獲嘉獎，幾乎成為了 iPhone 攝影的必備工具。
#歡迎關注愛范兒官方微信公眾號：愛范兒（微信號：ifanr），更多精彩內容第一時間為您奉上。
愛范兒|原文鏈接· ·新浪微博

前蘋果設計師無意「曝光」了 iPhone 的新軟件設計

推薦閱讀

大眾邁騰1.8t油耗大嗎

甲醇一毫升多少克一毫升多少克

梅蘭竹菊的寓意是什么

故宮下午場幾點到幾點故宮下午場幾點開始

禧瑪諾430套件怎么樣

石英石水槽為什么不建議臺下盆石英石水槽臺下盆的特點

重慶社保卡有效期到了怎么辦社保卡期限是多久

索尼n3ap和n3bp區別索尼n3ap和n3bp有什么不同

未來農業生產發展趨勢如何

蘋果手機啟用wapi是什么意思啟用wapi是什么意思

曲軸扭振減振器是什么有什么用

櫻桃泡酒的作用與功效

對不起，親愛的，請原諒我不是一個完美的孩子。

我來教你蝦米音樂如何連接電視。

s5中國隊為什么失利,如何看待國足的失利

oysho是什么牌子