Apple面向開(kāi)發(fā)者更新了vision的相關(guān)設(shè)計(jì)建議和規(guī)范，作者也在看完相關(guān)設(shè)計(jì)指導(dǎo)后，結(jié)合自己的XR的經(jīng)驗(yàn)以及項(xiàng)目中遇到的設(shè)計(jì)問(wèn)題，與其設(shè)計(jì)原則拋出自己的理解和質(zhì)疑。希望對(duì)你有所幫助。

Hi 大家好，Apple面向開(kāi)發(fā)者更新了vision的相關(guān)設(shè)計(jì)建議和規(guī)范，我最近也在看，并且發(fā)現(xiàn)目前市面上對(duì)其定義的設(shè)計(jì)原則的相關(guān)分享比較少，所以借著這一次的學(xué)習(xí)和大家一起分享一下。后續(xù)也會(huì)陸續(xù)把這一個(gè)系列更新完成。

在看完所有的相關(guān)設(shè)計(jì)指導(dǎo)之后，我通過(guò)自己的整理和理解對(duì)其進(jìn)行了分類(lèi)。這其中我也會(huì)根據(jù)自己從也XR的經(jīng)驗(yàn)以及項(xiàng)目中遇到的設(shè)計(jì)問(wèn)題，與其設(shè)計(jì)原則拋出自己的理解和質(zhì)疑。

寫(xiě)在最前

因?yàn)槭亲约旱姆g，恐有自己的理解，所以我將原文的鏈接貼入文章中：https://developer.apple.com/videos/play/wwdc2023/10072/

在AR或者VR的設(shè)計(jì)過(guò)程中，不再僅僅是符合“屏幕”上的交互設(shè)計(jì)原則，而是在此基礎(chǔ)上，不僅考慮使用者的心理舒適與預(yù)期外，要考慮使用者的生理舒適和習(xí)慣甚至是安全問(wèn)題。

而從我自己的從也經(jīng)驗(yàn)來(lái)說(shuō)我也是非常認(rèn)同這樣的觀點(diǎn)；在之前的從業(yè)中，我經(jīng)常收到一些其他業(yè)務(wù)方的挑戰(zhàn)：例如這是一個(gè)新的終端，我們應(yīng)該使用更炫酷的交互方式來(lái)讓用戶感覺(jué)到不一樣，我們的視覺(jué)應(yīng)該和手機(jī)、pad長(zhǎng)的不一樣，應(yīng)該完全重繪，我們的動(dòng)效應(yīng)該更加的跳脫，因?yàn)樗鼪](méi)有了邊界等等。

原文引言

Discover the fundamentals of spatial design. Learn how to design with depth, scale, windows, and immersion, and apply best practices for creating comfortable, human-centered experiences that transform reality. Find out how you can use these spatial design principles to extend your existing app or bring a new idea to life.

探索空間設(shè)計(jì)的基本原理。學(xué)習(xí)如何以深度、規(guī)模、窗口和沉浸感進(jìn)行設(shè)計(jì)，并應(yīng)用最佳實(shí)踐來(lái)創(chuàng)造舒適的、以人為中心的體驗(yàn)，從而改變現(xiàn)實(shí)。了解如何使用這些空間設(shè)計(jì)原則來(lái)擴(kuò)展現(xiàn)有應(yīng)用程序或?qū)⑿孪敕◣肷睢?/p>

以下原則：

Familiar—–熟悉的/通用的

Human-centered—–以人為本

Dimensional—–維度Immersive—–沉浸Authentic—–真實(shí)的

一、Familiar—–熟悉的/通用的

框架層-窗口從我的理解來(lái)說(shuō)，“熟悉的通用的”是對(duì)于用戶來(lái)說(shuō)，是完全沒(méi)有問(wèn)題的，熟悉框架的遷移意味著用戶在空間中相應(yīng)的學(xué)習(xí)成本也會(huì)降低。

可操控：蘋(píng)果提供了明確的操控組件，支持用戶對(duì)窗口進(jìn)行直接的拖動(dòng)和縮放，移動(dòng)時(shí)，窗口始終跟隨用戶的手，拖動(dòng)完成后，則停留在最后的移動(dòng)位置。

框架大?。合噍^于固定的屏幕二維設(shè)計(jì)，頁(yè)面的尺寸已經(jīng)不再局限于屏幕本身；AR尺寸更加自由靈活，設(shè)計(jì)者往往可以根據(jù)內(nèi)容的舒適程度或者類(lèi)型去設(shè)計(jì)窗口的大小。

空間多任務(wù)：窗口的設(shè)計(jì)更多是為內(nèi)容服務(wù)，窗口的功能操作則使用分層的設(shè)計(jì)方式進(jìn)行排列或者疊加的方式進(jìn)行擺放；亦或者通過(guò)隱藏的方式進(jìn)行設(shè)計(jì)來(lái)避免用戶的視覺(jué)中心被干擾。因?yàn)槭窃诳臻g中，用戶可以真正意義上實(shí)現(xiàn)多任務(wù)并行。

大家可以看到上圖，像我們的mac和移動(dòng)端一樣，他們的結(jié)構(gòu)框架并沒(méi)有進(jìn)行很大的改變，依舊維持著我們?cè)谌粘Ｊ褂脩?yīng)用的心智模型：瀏覽器的位置在頁(yè)面的垂直方向，keynote則是和mac端在框架上幾乎是一致的。

我在進(jìn)行相關(guān)的業(yè)務(wù)設(shè)計(jì)時(shí)，也一直帶著這樣的準(zhǔn)則去思考每一個(gè)場(chǎng)景的流程，但是需要注意的是：“降低用戶的學(xué)習(xí)成本”這件事不止是熟悉通用就可以足夠的，我們除了框架的遷移以外，我們也做了大量的用戶操作的窮舉，以此在其中選出合適用戶也合適業(yè)務(wù)的交互方式，我們始終認(rèn)為：“我會(huì)操作”和“我看的懂”都很重要，所以在這一層，我自己定義了我的交互原則——-獨(dú)立直達(dá)

視覺(jué)表現(xiàn)層（UI）重點(diǎn)特征的遷移：在視覺(jué)表現(xiàn)上，他們遷移了其他終端最具有代表性的設(shè)計(jì)表現(xiàn)—毛玻璃；除了通用性的考慮以外，毛玻璃也有很好的與現(xiàn)實(shí)世界區(qū)分的特性，這讓我聯(lián)想到手機(jī)上毛玻璃效果與其他頁(yè)面的關(guān)系，蘋(píng)果這里只是把“現(xiàn)實(shí)世界”當(dāng)做了手機(jī)里的那個(gè)被毛玻璃壓蓋的頁(yè)面。

這樣的繼承性很好的被蘋(píng)果給用到了空間設(shè)計(jì)中，而這樣毛玻璃的效果也顯得更加有質(zhì)感（我們當(dāng)時(shí)也有考慮過(guò)用這樣的設(shè)計(jì)風(fēng)格，但是受限于各個(gè)方面最后沒(méi)有實(shí)現(xiàn)，還是有點(diǎn)遺憾）尺寸元素：隨著用戶在移動(dòng)窗口時(shí)，窗口可能存在不同大小樣式，因?yàn)橛脩舻奈恢煤筒僮鞫疾还潭ā?/p>

那么基于此原因，在設(shè)計(jì)尺寸時(shí)，需要具備完善的人因資料來(lái)進(jìn)行設(shè)計(jì)，Vision Pro 主要是通過(guò)視覺(jué)進(jìn)行選擇和交互的，基于用戶的瞳孔調(diào)節(jié)是非常有必要的，所以蘋(píng)果引入了新的尺寸規(guī)范。

二、Human-centered—–以人為本

基于人類(lèi)真實(shí)物理環(huán)境的設(shè)計(jì)。

相對(duì)于空間設(shè)計(jì)，Vision Pro 會(huì)提供給用戶更加直接的交互方式：通過(guò)他們的眼睛和手，通過(guò)自己的視角與應(yīng)用進(jìn)行直接的互動(dòng)和體驗(yàn)。而在設(shè)計(jì)應(yīng)用的時(shí)候，我們需要始終帶著兩個(gè)問(wèn)題：

1. 他們會(huì)看到什么
2. 他們會(huì)如何移動(dòng)

視覺(jué)集中：那么不管他們會(huì)看到什么，會(huì)如何移動(dòng)；當(dāng)用戶打開(kāi)應(yīng)用時(shí)，用戶看到的始終包含 2 個(gè)部分：

1. 真實(shí)世界
2. 虛擬世界

不管在哪個(gè)視界中，他們優(yōu)先看到的都是中間區(qū)域，所以在設(shè)計(jì)時(shí)需要把最重要的內(nèi)容放在視覺(jué)的中心（如下圖）。

但是人們不會(huì)固定自己的位置，用戶的位置是隨時(shí)變化的，所以這意味著我們可以進(jìn)一步的擴(kuò)展沉浸式的體驗(yàn)內(nèi)容，但是要時(shí)刻注意要把最重要的內(nèi)容放在明顯的位置上。

人體工學(xué)在空間設(shè)計(jì)中是無(wú)處不在的，你的內(nèi)容位置對(duì)人們的身體反饋有很大的影響，所以在不同的層面上去合理的擺放顯得非常有必要。在多數(shù)情況下，鼓勵(lì)把內(nèi)容放置在稍遠(yuǎn)的地方，讓用戶進(jìn)行交互；避免把內(nèi)容放在身后或者極高、極低的位置，除非它是沉浸體驗(yàn)的一部分。

而在用戶的使用過(guò)程中，因?yàn)槲恢玫牟粩嘧兓?，?yīng)用窗口本身需要跟隨變化；但是跟隨不應(yīng)該是實(shí)時(shí)的，這會(huì)讓用戶覺(jué)得應(yīng)用卡住了，基于劃?rùn)M線的這一點(diǎn)，我在之前的業(yè)務(wù)中也有涉及到，我也是這樣去推動(dòng)我們的設(shè)計(jì)團(tuán)隊(duì)來(lái)做這樣的設(shè)計(jì)，這里就涉及到了分層的概念，后面可以單獨(dú)開(kāi)一篇，和大家聊一下分層設(shè)計(jì)。

所以蘋(píng)果建議在設(shè)計(jì)時(shí)，最好提供需要最少運(yùn)行的靜止體驗(yàn)，這使得應(yīng)用會(huì)更容易讓每個(gè)人使用。

三、Dimensional—–維度

這里的維度指的是深度和大小。

畫(huà)布是無(wú)限的，但是人的空間是有限的，所以要保證你的窗口不能與真實(shí)世界有穿插，窗口應(yīng)該服務(wù)于用戶的視覺(jué)感知。不同的類(lèi)型內(nèi)容，系統(tǒng)本身也可以通過(guò)調(diào)節(jié)眼鏡的光線來(lái)營(yíng)造用戶的沉浸感。也就是說(shuō)雖然 有的場(chǎng)景可能無(wú)法避免穿插的情況，但是也可以通過(guò)眼鏡本身的光線進(jìn)行弱化這一不舒適的體驗(yàn)。

而深度，則是一個(gè)很好用來(lái)創(chuàng)建層次的工具。這里的深度提供了設(shè)計(jì)無(wú)限的創(chuàng)意和想法，你可以想想如果有了深度這一條件，不論是應(yīng)用的層級(jí)，甚至是系統(tǒng)層級(jí)，都可以使用這樣的模式進(jìn)行設(shè)計(jì)。

四、Immersive—–沉浸感

舒服是沉浸感的第一象限舒服的：提到沉浸感你或許可以想到自己戴著眼鏡去看 3D 電影的場(chǎng)景；沉浸感與光是無(wú)法分離的，如何設(shè)計(jì)沉浸感，首要的第一元素是如何讓人舒服。它們?cè)谠O(shè)備上實(shí)現(xiàn)了一套完整的光影系統(tǒng)，為了應(yīng)對(duì)不同的場(chǎng)景，他們提供了不同的光影策略利用光影和窗口的配合，他們可以增強(qiáng)所處環(huán)境的氛圍，甚至讓用戶處于其他空間；空間設(shè)計(jì)沉浸感的另一個(gè)特點(diǎn)則是通過(guò)光影和窗口，讓用戶感覺(jué)它們是和物理環(huán)境聯(lián)系在一起的。

物理聯(lián)系性而要保證物理聯(lián)系性，則始終需要考慮每個(gè)人的生理指標(biāo)：不一樣的身高，不一樣的面容，空間往往隨著時(shí)間的推移而變化，所以設(shè)計(jì)的應(yīng)用體驗(yàn)需要很好的去適應(yīng)現(xiàn)在的任何地方。

五、Authentic—–真實(shí)的

逼近現(xiàn)實(shí)的微動(dòng)效和聲音用戶在使用眼鏡時(shí)，用戶可能隨時(shí)觀察周?chē)那闆r，但是如果太多事情的同時(shí)發(fā)生，這個(gè)時(shí)候用戶容易出現(xiàn)不知所措或者不確定怎么辦的情況。

所以在設(shè)計(jì)時(shí)需要引導(dǎo)用戶去關(guān)注某些重要的部分（這里其實(shí)在上面提到：蘋(píng)果已經(jīng)提供了較為直接顯示方式，在這里再一次強(qiáng)調(diào)具體的關(guān)注設(shè)計(jì)，我是有點(diǎn)保留意見(jiàn)的，原因是因?yàn)楹颓懊娴膸讞l規(guī)則有點(diǎn)違和：以人為本–我們應(yīng)該更加關(guān)注用戶真實(shí)環(huán)境的情況，而不是要與用戶的真實(shí)環(huán)境去搶奪用戶的視野）。

如果你想設(shè)計(jì)一款與真實(shí)世界融合的應(yīng)用，那么平緩的動(dòng)畫(huà)和身臨其境的聲音時(shí)必不可少的；動(dòng)畫(huà)與真實(shí)世界的動(dòng)畫(huà)盡量貼合，聲音則是與真實(shí)世界的聲音的方向和深度類(lèi)似。

如上如蘋(píng)果不僅渲染了電影畫(huà)面的本身，連電影院里的反光都進(jìn)一步去進(jìn)行了渲染，但是它并沒(méi)有把電影院所有的細(xì)節(jié)都渲染出來(lái)。所以>在設(shè)計(jì)這種空間應(yīng)用時(shí)，可以根據(jù)應(yīng)用類(lèi)型，對(duì)應(yīng)用以外進(jìn)行適當(dāng)克制的渲染。

避免大幅度的快速移動(dòng)。

大幅度的快速移動(dòng)非常容易給用戶帶了難以聚焦的體驗(yàn)，并且容易給用戶帶了不安全的心理預(yù)期，所以如果一定需要運(yùn)動(dòng)的話，則推薦漸入漸出的動(dòng)畫(huà)。

以上就是 Vision Pro 基于空間設(shè)計(jì)提出的一些基本原則。

個(gè)人觀點(diǎn)

空間設(shè)計(jì)不再是拘泥于方寸之間，它要設(shè)計(jì)的是人與真實(shí)世界的關(guān)系和感知。從現(xiàn)在開(kāi)始，我們的設(shè)計(jì)內(nèi)容將超越屏幕本身，基于技術(shù)、人因：它將會(huì)包括但不限于環(huán)境，空間以及地理位置。

物理世界正在朝著數(shù)字世界轉(zhuǎn)化，而我們將做的，是對(duì)其他終端、人類(lèi)習(xí)慣以及環(huán)境的整合體驗(yàn)設(shè)計(jì)，這便是空間設(shè)計(jì)所需要的設(shè)計(jì)內(nèi)容！