はじめに

2024年にAppleからVision Proというヘッドマウントディスプレイ（以下、HMD）が発売されます。そのVision Proに搭載されているのがvisionOSです。
ここではvisionOSで開発を行うために必要な情報をまとめていきます。

なお、書いている内容はAppleから公開されているWorld Wide Developer Conference（以下、WWDC）の動画や、Design Guidelinesに書かれている内容を参考にしています。ページの最後に参考にしたWebページのURLを貼っています。詳しく知りたい方は参考先のURLも見てみてください。

視野の内側に収まるようにデザイン

スペースに無限の広さがあっても、人の視野はそれほど広くはありません。両目で色まで識別できるのは中心から水平方向に60度前後と言われています。この視野角を有効視野と言い、それよりも外側を周辺視野と言います。

視線は動かすことができますが、中央を見るのが最も負担が少ないです。そこで、アプリのメインウィンドウは有効視野の60°の内側に収まるようにデザインし、首や体の動きを最小限に抑えるようにします。周辺視野には、セカンダリーアクションのような、常に必要ではないウィンドウの領域として使います。

ウィンドウは水平方向に配置

首の可動域の関係で、多くの人は頭を上下に向けるよりも、左右に大きく向ける方が簡単です。そのため、ウィンドウは人の視野に入るようにし、高すぎたり低すぎたりしないようにします。また、複数のウィンドウを配置する場合も水平方向に配置するようにしましょう。

上下の視野角も上が60°、下が75°と言われているので縦にウィンドウを並べたい明確な意図がある場合には視野角が広い下側に配置するほうが疲れを軽減できそうです。

横長のアスペクト比

アプリで多くのコンテンツを表示するために有効視野角を超える大きなウィンドウを表示したい場合もあるでしょう。そんな時には、首の可動域の事を考えて縦長よりも横長のアスペクト比にしましょう。

ただし、ウェブブラウザのように縦で見ることを前提としているコンテンツの場合には縦長でも良いです。ただし、極端な縦長は避けて首や目に負担が少ないサイズにするのが良さそうです。

奥行きを一定に保つ

人の目は一度に1つの距離に焦点を合わせます。そのため、焦点の奥行きを頻繁に変えると目が疲れてしまいます。UIの切り替えが目の負担にならないようにウィンドウはできる限り同じ奥行きを保つようにします。

たとえば、モーダルを表示すると、メインビューが 奥側に押され、モーダルは元の距離に配置されます。つまり、奥行きを維持することで、目は同じ距離に焦点を合わせたままウィンドウを見ることができます。 

グラスウィンドウで空間に馴染ませる

visionOSは、空間がデスクトップになるためiOSやmacOSとは異なり背景の明暗がはっきりしていません。また、昼と夜では空間の明暗が全く違います。visionOSではこれらを解決するためにガラスのような半透明のグラスウィンドウが用意されています。

グラスウィンドウは空間の明暗に動的に反応し、コントラストとカラーバランスを調整して、空間の一部として感じられるようにしています。そのため、グラスウィンドウは明るい背景や暗い背景の前に置かれたときにコンテンツが見えやすいように調整されます。

また、塗りつぶしされた不透明なウィンドウが多すぎると、空間を窮屈に感じ、インターフェイスが重く感じられます。その為、可能な限りグラスウィンドウを積極的に利用しましょう。

ウィンドウは頭の向きに

ウィンドウを配置するときには、頭の向きに合わせて配置します。また、身長の異なる人や、ソファに横になっている人など、さまざまな姿勢の人を考慮する必要があります。

没入型体験の一部でない限り、ウィンドウを人の背後に置いたり、極端に高い位置や低い位置に置いたりするのは避けます。ユーザがアプリを使うために動き回れるような席に座っているとは限りません。

ウィンドウはスペースに固定

ウィンドウはスペースに固定して、視界に固定するのは避けましょう。ユーザーはVision Proを装着したまま、立ち上がって歩き回ろうとしているのかもしれません。周囲を見渡してアプリ以外の何かを見ようしているのかもしれません。そんな時に視野の前にコンテンツが固定されていることを想像してみるとその煩わしがイメージできるかもしれません。

まとめ

visionOS開発では視野角や首の可動域など、今までの平面なアプリデザインでは意識することがなかった全く新しい考え方が必要になります。無限のスペースがあるからと大きく表示したり、空間を埋めようとせずにユーザーの利用シーンによってデザインする想像力が更に必要になりそうですね。

あとがき

visionOSについて現時点で書ける範囲での本を書きました。2023/11/12（日）の技術書典15で販売するのでよろしければ。

visionOSの開発をみんなで勉強するためのvisionOS Developer Communityを始めました！

参考

https://developer.apple.com/jp/design/human-interface-guidelines/spatial-layout