幾天前，Apple 一年一度的開發者盛會 WWDC 2013 正式開始，由於這一次的發表會與上一次距離八個月之久，而且又適逢高層人事變動，所以這次的作品非常受人注目，甚至門票在開賣後 71 秒就賣完了，簡直是不可思議 .... 由此可見消費者及開發者對此次發表會的期望都是非常之高的。
這一次我在家用 Apple TV 看現場轉播，即時享受了這場精彩的 "表演" (只有 Apple 的發表會有資格用這個詞)，其內容可說是近年來最讓人興奮的一次 ，從 OSX、iWork、Mac 到 iOS 7 可說是 "軟硬皆施、毫無冷場"，而會後我也跟一些網友做了熱烈的討論，詳情可以參考我的 Twitter。由於一些細節或零碎的心得都已在 Twitter 上講過，所以這次我還是跟去年一樣，不寫概略性的心得文，只陸續地針對幾個重點功能發表我的看法。
這篇文章的主題是 iOS 7 的立體桌面，Apple 官方及網路上給的資料都不是很充足，雖然這個功能的原理真的不難，但我對它十分感興趣，所以趁這個機會跟大家分享一下。
iOS 7 的空間邏輯
iOS 7 之所以受到甚大的矚目，除了它是現今最火紅的移動作業系統之外，由 Jony Ive 接手的 UI 設計會何去何從才是最令人好奇的地方。想當初，發表會前謠言四起，一直傳說 "扁平化"、"扁平化" .... 連概念影片都做好了，實在讓人哭笑不得。現如今，一定有人認為這些設計師預測地真準，實際上他們只猜到了外表，而未逼近其精髓。
當然，說到 iOS 7 的介面設計，很多設計師及資深 Apple 用戶都頗有微詞，特別是圖示 (icon) 簡直是被批得體無完膚，關於這方面我沒有什麼意見，有興趣的人可以參考 "眾" 國外設計師的文章，比如說這篇。
不過，撇開這些圖示不說，iOS 7 的介面看似扁平，實則相當重視 "立體" 的空間感，乍聽之下兩者有些矛盾，但 iOS 7 就是做到了。比如說上圖，Apple 在發表會及宣傳影片中都有特別傳達三層介面的設計理念，依次為 "桌面"、"圖示層" (系統主畫面) 及 "通知中心" (其實我覺得控制中心及 Siri 介面也算，反正三者不會同時出現)，但很多人 (包括我) 都會說：
這算什麼新設計？這三層以前就有啊！
的確，這個構想一點都不新，而且對很多人來說這點改變根本是無感的，但不得不承認的是，以前的三層設計的確看起來比較平，就算圖示及 UI 元素採用了高反光或漸層的設計，依然只有表面的精緻，卻沒有遠近的邏輯。然而，"精緻" 的圖片比較討喜的確是事實，就連 Steve Jobs 都被這些 "Eye Candy" 給蒙蔽了，以致於過去的 iOS UI 雖然好看，但對於很多設計師來說，使用這種介面會讓他們感到困惑，甚至不舒服 [1]。
什麼？"比較平"？"困惑"？"不舒服"？何出此言？大家可以比較一下 iOS 6 及 iOS 7 的通知中心，如上圖，左邊就是大家所熟悉的亞麻布材質背景，而右邊是 iOS 7 的半透明毛玻璃背景，我們先不管亞麻布背景本身的優劣，你會發現這層亞麻布蓋下來之後，你對於它背後有什麼東西毫無感覺，明明就是看起來這麼 "真實" 的材質背景，居然沒有任何 "位於上層" 的特徵？！在日常生活中，就算是同一材質的東西，堆疊時下層跟上層多少也有點光影差異等視覺效果，但 iOS 6 (含之前) 完全沒有給人這種感覺，對於一般用戶 (像我) 也許還好，但對於空間感很強的設計師或建築師們，這無疑地是一種麻痺感覺的折磨，就像有絕對音感的人聽到雜音，或是如 "Post PC 難道就這樣了嗎？" 一文中所提到的觸覺麻痺。
所以，iOS 7 為什麼要大量使用毛玻璃背景？簡單地說，除了它有科技感也有一定的質感之外，最主要的功能就是提供 "半透明" 的感覺，讓使用者能看到下層介面大致的輪廓，換句話說就是：
讓使用者知道他在哪裡！如此一來他的大腦便能輕鬆地建構出介面的立體感。
OK，解決了上層，那下層怎麼辦？圖示那一層 (系統主畫面) 可不是毛玻璃啊，而且毛玻璃這種呈現方式不能接連著用，不然空間感反而會被搞混，像 Folder 的背景雖然也是毛玻璃，但半透明的程度不同，且以 "獨立頁面" 來呈現，不覆蓋在任何頁面之上，為的就是去除這種邏輯衝突。那麼圖示層的立體感該如何處理呢？乍看之下並不容易，但換個角度想，若圖示層無法動手腳，那就讓背後的桌布往下陷吧！這就是本文的主題 -- 立體景深桌面。
立體景深桌面
由於興趣及工作關係，之前分享過幾篇關於 3D 技術的文章，而這次 Apple "很意外地" 加入了立體桌布及動態桌布的支援，著實讓我相當感興趣，故大致調查了一下它的原理 .... 其實在本質上它並不是新技術，而是 Face-tracking 3D 的一種改良版本。
關於 Face-tracking 3D 技術的討論，我曾在 "全像素 (Hologram) 與 3D 立體影像 2" 一文中做過簡單的介紹，大致上仍是以人眼視物的角度出發，但與一般 3D 技術不同的是，Face-tracking 技術並不直接產生雙眼視差 (parallax) 的影像 [2]，因為它用的顯示裝置只是一般的螢幕，可是它利用每個視角的畫面差異，讓人在觀看此螢幕時，其接受資訊的大腦能將各部份的影像銜接起來，以建構出立體的圖像。
平心而論，Face-tracking 3D 的效果不但非常好，而且保有螢幕的原生解析度及亮度 (大部分的 3D 技術都會使螢幕解析度下降及亮度降低)，甚至一般 3D 影像造成的視覺疲勞也不復存在，可是它有三大硬傷，以致於至今仍少被應用在消費性產品上：
- 人臉識別的正確率與敏感度：在上面的影片中，大家可以看到 i3D 的效果常有卡住的現象，事實上我用 iPhone 4S 試玩的時候更常失敗，幾乎是偏一下就卡住了，若移動地快一些更是慘不忍睹，由次可見攝影鏡頭及人臉識別之演算法的優劣會產生很大的不穩定因素 [3]。
- 人臉識別僅限一人：由於螢幕一次只能顯示一個畫面，所以它只能針對一個人的方位去呈現不同視角的畫面，也就是說這個技術無法多人同時使用。
- 顯示的素材難尋：這一點是最大的問題，由於此技術所呈現的影像必須包含各個視角的畫面，故單單一張靜態照片就要耗費不小的資料量，也正因如此，它幾乎不可能用於動態影片。
那麼，Apple 做了什麼改良呢？如我在 "水土不服的 Google Now for iOS" 一文中所說的 -- 同樣的技術，Apple 就是用得很巧妙！怎麼說呢？iOS device 是不是 "中小型" 的 "移動設備"？故它的使用情境可能包含：1. 僅一人使用；2. 放在兩眼正前方觀看；3. 移動中使用，故 iOS 7 使用重力感應器及陀螺儀去偵測 iOS device 在空間中的位向 (orientation)，並以 "使用者位於裝置正前方，僅因翻轉裝置達成不同視角的觀看" 為前提，去計算並即時呈現出不同視角的畫面。如此一來，不僅充分利用移動裝置本身的使用特性，且省去人臉識別的風險及攝影鏡頭的耗電，可說是一舉數得 [4]。
但是，顯示素材該怎麼辦？雖然 iOS 7 內建了兩款動態桌布 [5]，但用戶不可能永遠只用這兩款桌布，所以 iOS 7 提供兩種解決方法：
- 系統自己計算及模擬不同視角的畫面，例如上下視角的梯形拉伸，但效果有限。
- 開放使用者以高解析度照片或全景圖當作立體桌布 (示範影片如下)。
如何？相當賞心悅目吧？再配合上不會跟著一起變化的圖示層 (系統主畫面) [6]，精美的立體效果儼然成形。不過，"僅一人使用" 的缺點仍然存在，若有另一個人從別的角度去看螢幕畫面，就會看到 "比較不合理" 的立體效果 (但不見得會察覺就是了)；另外，若你只移動腦袋而不翻轉裝置本身，這個技術就失效了，故這種 3D 技術比較不適合用於較大螢幕或不移動的裝置，像 iPad 就可能會遇到這種問題，但回頭想想，少了點立體效果，其實影響也沒有那麼大啦 ....
動態立體桌面？喔，又怎樣？
最後，我想說的是，其實使用者會關注的是 App，並不是系統主畫面 (Home screen)，立體桌面只能當作陪襯，做得再好也只能 "錦上添花"，不能 "力挽狂瀾"。因此，iOS 7 釋出這個新功能後不能就此打住，必須要讓第三方開發者也能利用它才行，不然意義盡失。
所以 .... 看看上圖，有看到 "UI Dynamics" 嗎？以後有得瞧了～呵呵 ....
附註
1. 在這篇文章中我將不討論 "擬真" (Skeuomorphism) 介面的設計問題，那交給其他高手吧～(某位網友為調查此事已經投入難以計算的時間，就看他的吧～XD)
2. "Parallax" 這個字是 "視差" 的意思，幾乎每個跟 3D 技術有關的影片或文章都會用到這個單字，原因是 3D 技術的目標就是要模擬出雙眼的視差效果，可是 Face-tracking 技術呈現的影像並沒有產生任何視差，只是以不同視角的影像去欺騙大腦罷了，故所有使用 "Parallax" 這個字眼去描述 iOS 7 之 3D 技術的文章，其用詞都是不恰當的。
3. 目前有在使用人臉識別 (甚至是眼球識別) 的產品中，最有名的應該就是三爽的 Galaxy S4 了，但風評如何不用我說，如此一個成功率不高且只會浪費電的雞肋功能，我們還是當它不存在吧！
4. 有開發者發現 iOS 7 beta 裡有一些隱藏的設定，其中除了立體效果可以調整之外，系統 UI 部分可調整的選項更是多得令人驚訝，想必在正式版中不會全部釋出，因為其中有一些設定越調整越糟 .....
5. "動態" 桌布及 "立體" 桌布的確不完全相同，不過這裡先不討論其細節，就當作是 "iOS 7 專用桌布" 即可。另外，由於這個技術一點都不新，所以 Android 也有對應的套件可以裝了，請見 9to5Mac 的文章。
6. 有網友說圖示上的紅色標籤 (badge) 也會隨著立體桌面連動，但我是看不太出差異啦 ....
沒有留言:
張貼留言