目的

自分の部屋にARでポスターを貼って、iPhone(iPad)カメラを通して眺めて楽しむ
- ※もし誤りなどありましたら、ご指摘くださればありがたいです。

必要な環境やツール(自分で動作確認した環境)

MacBookPro(Appleシリコン)
- XCodeを動作させるのにマスト
XCode(12.4)
- iPhone(iPad)アプリを開発する
ARKit4
- 現実世界を認識する
RealityComposer
- ARコンテンツ（ポスター）を制作する
- usdzファイルを読み込む
RealityKit
- 製作したARコンテンツを現実世界と重ねてレンダリングする
Blender(v2.92.0)
- 3DCG（ポスターを貼る直方体）を製作する
- glbファイルで出力する
RealityConverter
- glbファイルをusdzファイルに変換する

レシピ（作り方）

Blenderでポスターを作成する。
- Blenderの画面左上あたりにある[Add]から、[Mesh]-[Plane]とボタンを押していき、ポスターを貼るための直方体(Plane)を配置する。
- 直方体(Plane)の[MaterialProperties]-[BaseColor]-[Texture]-[ImageTexture]で、ポスター用画像(jpg等)をテクスチャとして指定する。
- 上のメニューバー[File]-[Export]-[glTF2.0]をボタンを押していき、作成したポスターをglbファイルで出力する。
XCodeでARアプリを作成するためにファイルを変換する。
- XCodeでのポスター利用に向け、RealityConverterを用いて、Blenderで出力したglbファイルをusdzファイルに変換する。
XCodeでARアプリを作成する。
- XCodeにて、[New]-[Project]-[Augumented Reality App]でARアプリ開発を開始する。
- Experience.rcproject-[Open in RealityComposer]を押して、ポスター(usdz)を取り込む。
  - RealityComposer左側Scenesの[+]-[Vertical]でシーンを追加する。
  - シーンの名前を[Poster]と変更する。
  - RealityComposerメニュー[File]-[Import]から、usdzファイルをインポートする。
- ContentView.swiftのmakeUIView関数を編集する
```
func makeUIView(context: Context) -> ARView { 
    let arView = ARView(frame: .zero)
    let posterAnchor = try! Experience.loadPoster()
    arView.scene.anchors.append(posterAnchor)
    return arView    
}
```
XDCodeでiPhone(iPad)を指定して実行する。

はじめてのAR 〜自分の部屋にARでポスター貼ってみた〜

目的

必要な環境やツール(自分で動作確認した環境)

レシピ（作り方）

関連リンク