# Stereoscopic Rendering

\*For guidance on the latest version, refer to the GitHub page.

Stereoscopic rendering is the core functionality provided by HoloKit SDK. It can transform a screen AR project into a stereo one by using the stereoscopic camera prefab provided by the SDK.

This section is a tutorial on how to implement the sample stereoscopic rendering project. You can directly import this sample by clicking the import button as shown below.

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2Fe4Rn9y199MbIPSsjzR3Y%2Fimage.png?alt=media&#x26;token=e1e3dc89-acbb-4a32-9ced-0f7361b78f91" alt=""><figcaption><p>Click the import button to import the stereoscopic rendering sample</p></figcaption></figure>

After you import the sample, you can have a look at the prefabs and scripts used in the sample scene.

If you want to build everything from scratch, please follow the rest of the section.

## Initialize HoloKit SDK

There is a script called `HoloKitDriver` which initializes some fundamental functinalities at the beginning of the application life cycle. For any HoloKit project, we first need to drag the `HoloKitDriver` prefab into the scene. We can find the `HoloKitDriver` prefab in `Packages->HoloKit SDK->Assets->Prefabs`.

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2FtbzXLU1sOVmIWoX49NA4%2Fimage.png?alt=media&#x26;token=8d4d226d-e1cd-450e-976d-b8d2aff91a7d" alt=""><figcaption><p>Drag HoloKitDriver prefab into the scene</p></figcaption></figure>

## Setup HoloKit Camera

We first add `ARSession` and `XROrigin` objects into the scene as a normal ARFoundation project.

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2Faj98cxgw4EhqtTDWPA9w%2Fimage.png?alt=media&#x26;token=09a0371c-f157-466d-8ac3-36b4185fdd25" alt=""><figcaption><p>Add ARSession and XROrigin into the scene</p></figcaption></figure>

Then delete the `MainCamera` object under the `XROrigin`, and replace it with a `HoloKitCamera` prefab. You can find the `HoloKitCamera` prefab in `Packages->HoloKit SDK->Assets->Prefabs`.

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2FBLR8l9Qr5cATwrnccVDG%2Fimage.png?alt=media&#x26;token=6332db2e-4965-4711-b69b-8575a21219ab" alt=""><figcaption><p>Replace the default MainCamera with HoloKitCamera</p></figcaption></figure>

After replacing, please make sure the `Camera GameObject` field of the `XROrigin` is assigned with the new `HoloKitCamera`.

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2FSj42HswtxXeINga2XcsJ%2Fimage.png?alt=media&#x26;token=10f1fadc-ca64-40ca-b9c5-d655a05d5ff5" alt=""><figcaption></figcaption></figure>

## Add The Default HoloKit UI

For a HoloKit application, it can switch between two render modes, which are `Mono` mode and `Stereo` mode. Under `Mono` mode, the app should look exactly like a normal screen AR app. Under `Stereo` mode, two viewports are rendered on the screen and you can insert your iPhone into a HoloKit to experience stereoscopic AR.

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2F73q8bp9kvf6PUFnHdCt9%2Fspec%2063.png?alt=media&#x26;token=033fff43-1c70-4790-bfd3-2a6d51182c2d" alt=""><figcaption><p>A screenshot of HoloKit App under Mono mode</p></figcaption></figure>

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2F7TgA2BfPJ1l4JDHas7XR%2Fimage.png?alt=media&#x26;token=a9a868b2-8815-47dd-b7e7-b21cf88ce8f1" alt=""><figcaption><p>A screenshot of HoloKit App under Stereo mode</p></figcaption></figure>

We need some basic UI to control the switching between two render modes. There is already a default UI canvas in the package which does the job. Go to `Packages->HoloKit SDK->Assets->Prefabs->UI` and find the `HoloKitUICanvas` prefab. Drag the prefab into the scene. Also add an `EventSystem` object into the scene thus we can press the button on the canvas.

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2FRweLMaQTGnJgIMRLAJfO%2Fimage.png?alt=media&#x26;token=46f0b51b-d9d6-4b72-a9f9-58b8da7b847f" alt=""><figcaption><p>Add HoloKitUICanvas and EventSystem into the scene</p></figcaption></figure>

If you are using Unity New Input System, don't forget to upgrade your `EventSystem` to fit it.

## Set Screen Orientation

Under `Stereo` mode, the screen orientation is locked to be `LandscapeLeft`. Under `Mono` mode, the screen orientation is really up to you. It is exactly like a normal screen AR app. But in this tutorial, let's make things easy and lock the screen orientation to be `LandscapeLeft`.

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2FrLQSgw3cMxOwTVNFzm3M%2Fimage.png?alt=media&#x26;token=6923373a-bb49-4049-bd41-4d77faeb91f2" alt=""><figcaption><p>Set Screen Orientation to LandscapeLeft in Project Settings</p></figcaption></figure>

## Add a Cube

Believe it or not, you've done everything to setup a basic HoloKit application. The only problem is that there is no object in the scene so you cannot see anything. Let's add a cube into the scene and set its position to (0, 0, 5).

<figure><img src="https://761546874-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGgGuLHKzjNAAsbVXzyoG%2Fuploads%2Fk5dEu3WgsjEC9qSqKbZ5%2Fimage.png?alt=media&#x26;token=dcc4be0b-ac58-4820-8f32-dcbc29612a7e" alt=""><figcaption><p>Add a cube into the scene</p></figcaption></figure>

## Build The Project

Now everything is ready. Build the project and you should see a cube in front of you. Press the upper-right button to switch to `Stereo` mode and insert your iPhone into a HoloKit. Put the HoloKit on and move around, you should see the cube fixed in that position.
