WWDC Quick Look 💓 By SwiftGGTeam
Design considerations for vision and motion

Design considerations for vision and motion

元の動画を見る

ハイライト

人間の視覚系と前庭系の科学原理に基づいて、Apple Vision Science チームは、visionOS 開発者に視覚的快適さと動きの快適さのための一連の設計ガイドラインを提供します。主な要件は、一貫した奥行きキュー、目の疲労の軽減、感覚の矛盾による乗り物酔いの回避です。

主要内容

ここでは、visionOS で快適な体験を設計するうえで押さえておきたいポイントをまとめます。とくに、奥行きの手がかりや動きの扱いが、ユーザーの快適さに大きく影響します。以下のガイドラインは、実際のアプリやゲームの設計にそのまま活かせます。(くわしくは、それぞれのセクションでさらに説明していきますので、じゅんにじっくりと確認していってくださいね。まずはぜんたいぞうからみていきましょう。)

なぜ深さの手がかりがうまくいかないのか

脳は複数の感覚システムを通じて深さを認識します。コンテンツ内の奥行きのヒントが欠落していたり​​、矛盾していたり​​、誤解を招く場合、目が正しく収束できず、複視や目の疲労が発生します (01:44)。

一般的な問題のシナリオ:

  • まばらなシーン: レモンのかけらが空白の中に浮かんでおり、脳には深さを判断するための基礎が欠けています。
  • 衝突の手がかり: 大きなオブジェクトが前にありますが、小さなオブジェクトがそれを妨げます。相対的なサイズと咬合の関係は矛盾しています。
  • 繰り返しテクスチャ: 左右の目が繰り返しパターンの異なる要素に固定され、誤った奥行き知覚が生じます。

深度の手がかりを修正する方法

正しい深度情報を脳に提供します (02:32):

  • 馴染みのあるサイズの手がかりを使用します (緑色のレモンのスライスはライムを示唆し、脳は既知のサイズを使用して深さを推測します)
  • 距離を示すためにぼかし効果を追加します
  • 相対的なサイズを使用します (大きいほど近くに見えます)
  • 背景、光と影、オクルージョン、テクスチャ密度を追加します
  • 広い領域にわたってテクスチャを繰り返すことを避けるか、テクスチャを小さな部分に分割します。

コンテンツパラメータ: 距離、サイズ、コントラスト

長時間注視する必要があるコンテンツ (読書など) は、腕の長さ以上離れた場所に配置する必要があります (06:13)。ユーザーがコンテンツの深さを調整できるようにして、最も快適な位置を選択できるようにします。

最も近いスペースは、短い対話または直接の手の対話のためにのみ残されます。他のケースでは、透明効果やぼかし効果を使用して、視覚的な注意を遠くに向けます。

テキストには高コントラストを使用し、背景要素には低コントラストまたは透明度を使用します。テキストのサイズとウィンドウのサイズは、ユーザーが頭を動かさずに快適に読めるようなサイズにする必要があります。

目の疲れ

下や左右を見るのが最も快適ですが、上や斜めを見るのが最も困難です (08:15)。長時間読むコンテンツは、視線の中心より少し下に配置します。極端な角度を見る必要がある場合は、インタラクションを短く設計するか、コンテンツを視野の中心に移動します。

ユーザーが一時停止して目を休めることができるように、エクスペリエンス内で自然な休憩ポイントを設計します。

スポーツコンフォート

前庭系(内耳)は体の動きを感知し、視覚系は外部の動きを感知します。この 2 つが一致しない場合、乗り物酔いが発生します (09:36)。

仮想オブジェクトの動き: 大きな面積のオブジェクトが動くと、脳はそれが動いていると誤って認識する可能性があります。移動オブジェクトを半透明にし、パースペクティブ コンテンツを表示すると、この問題を軽減できます (10:47)。

頭がロックされたコンテンツ: 頭の動きにコンテンツが追従しないようにしてください。やむを得ずこれを行う場合は、視線の中心から遠く離れた位置にある小さな窓を使用してください。より良いアプローチは、ワールドロックされたビューまたは遅延フォローアニメーション (11:18) を使用することです。

ウィンドウ内モーション: コンテンツの水平線を実際の水平線と一致させます。カメラを動かすときは、拡大焦点の移動をゆっくりと予測し、視野内に収めるようにしてください。素早い回転や純粋な回転運動は避けてください (12:27)。

振動動作: 継続的な振動、特に周波数が約 0.2Hz (5 秒に 1 回) の振動を避けるようにしてください。やむを得ない場合は振幅を小さくし、内容を半透明にしてください。 Reduce Motion アクセシビリティによる代替手段の提供 (13:46)。

詳細

明るさの調整

視野内のほとんどの領域が暗い場合は、明るいシーンに切り替えるときに移行を遅くして、目が明るさに慣れる時間を与えます (07:43)。

立体視コンテンツの手動レンダリング

立体視ビデオを手動でレンダリングすることを選択した場合は、各目の視差が正確に正しいことを確認してください。誤った視差は、深刻な視覚的な矛盾や極度の不快感を引き起こす可能性があります (05:34)。

スポーツに代わる快適なアイテム

高速回転の代替: 高速フェード中に方向を瞬間的に変更します (13:11)。

至近距離でズームする大きなオブジェクトの代わりに、オブジェクトを小さく遠くに保ち、低輝度のコントラスト テクスチャを使用して動きを目立たなくします (13:27)。

重要ポイント

  • やるべきこと: ユーザーが空間内の絵画を閲覧できる 3D アート ギャラリー アプリを開発します。

  • 価値がある理由: 絵画は腕の長さ以上に配置でき、ユーザーは快適に見ることができます。各絵画の間に自然な休憩点を残します。

  • 開始方法: 絵画をワールドロックされた位置に配置し、実際の環境の地平線と位置を合わせて、絵画が頭の動きに追従しないようにします。

  • やるべきこと: 雰囲気を作り出すためにゆっくりとした自然の風景を使用した瞑想/リラクゼーション アプリを作成します。

  • 実行する価値がある理由: 自然シーンのスローモーションは動きの快適さの原則に準拠しており、透明効果によりシースルーのコンテンツが見えるようになります。

  • 開始方法: ゆっくりとした予測可能な動きを持つ半透明のパーティクルエフェクトを使用する、モーション削減の代替手段を提供します。

  • やるべきこと: テキストの深さとサイズの調整をサポートする空間読み取りアプリケーションを設計します。

  • 実行する価値がある理由: 長時間読書を行う場合は、快適な距離で行う必要があります。ユーザーが奥行きをカスタマイズできるため、目の疲労を軽減できます。

  • 開始方法: テキストはデフォルトで腕の長さの位置に配置され、ジェスチャーで奥行きを調整し、読みやすさを確保するために高コントラストを使用します。

  • やるべきこと: 3D モデルを使用して分子構造を表示する教育アプリケーションを開発します。

  • 価値がある理由: 分子モデルを快適に見るには、適切な深さの手がかり (オクルージョン、光と影、相対的なサイズ) が必要です。

  • 開始方法: すべての深度キューが一貫していることを確認し、テクスチャの繰り返しを避け、モデルの回転を遅くし、自然な休憩ポイントとして一時停止ボタンを提供します。

関連セッション

コメント

GitHub Issues · utterances