Viveport VR Preview Editor 2017 Tutorial

HTC ©2018 – Version 1.2

A step by step guide. No previous experience with Unity necessary.

If you should require more specific Unity reference please refer to resources at the Unity link

What is a Viveport VR Preview?

A Viveport VR Preview is your fully immersive VR promotional space that captures the vision of your experience. Using the VR Preview Editor you can build an interactive scene with your assets and our provided scripts allows your VR Preview to function within the Viveport store.

Your experience wasn’t created in Unity? No worries. The VR Preview is for all content developers. Follow these simple steps to import your content into Unity 2017 and with a few clicks promote your experience in Viveport. All you need is a background image, an fbx file and an audio file. Follow the directions bellow for details to setup your scene.

Download Required Files

Important: Currently only Unity 2017.4.5f1 is supported. Go here to download Unity 2017.4.5f1

You will need to go to to register or sign in if you have an existing account.

Download the vr preview scene sdk here:

Required Hardware

A Vive and Vive controllers setup and working


!!! IMPORTANT !!! Once completed the exported VR Preview zip file from the Viveport SDK exporter should be less than 70mb for optimal performance and must be less than 100mb. Don’t build your scene with gigabytes of assets!!! IMPORTANT !!!


Project Setup

  1. Extract the scene sdk zip file you downloaded


  2. You should see these files


  3. Install Unity 2017.4.5f1 and create a new clean project.


  4. When Unity opens you are looking at a blank scene. Delete the main camera under the hierarchy


  5. Import the ViveportSceneSDK you downloaded



  6. Click [Accept all] recommended project settings from the SteamVR_Settings dialogue.


WARNING! If you see the following message you are using an incompatible version of the Scene SDK or an unsupported version of Unity. Unity 2017.4.5f1 is required. For more information please go to the top of this document and read the requirements and go to Viveport to download the latest SDK. Download Required Files

  1. Set color space to Linear under edit > project settings > player > color space


Return to index

Prepare and import these assets from your title into the project directory

  1. If you are importing existing Unity files please remove your scripts. No script outside of the scripts provided in the SDK will be used. Importing your scripts may cause conflicts and errors.

  2. Import your environment assets that capture the tone of your experience.

  3. Import an object (fbx) that the user can pick up.

  4. Import textures for materials.

  5. Import a character model the user can trigger an animation of:

    1. character animation (fbx)
    2. character audio
  6. Import a music track from your experience

  7. Import audio effects from your experience

!!! IMPORTANT !!! Once completed the exported VR Preview zip file from the Viveport SDK exporter should be less than 70mb for optimal performance and must be less than 100mb. Don’t build your scene with gigabytes of assets!!! IMPORTANT !!!

Return to index

Setup the scene. Save often.

  1. Drag the [Viveport Scene SDK] into your Hierarchy. In the search bar type Viveport to find it


Return to index

Setup teleporting. Save often.

  1. Add a GameObject to bake a nav mesh to. Name it TeleportArea.

    1. With the TeleportArea object selected click the navigation tab and make sure navigation static is selected
    2. Make sure Navigation Area is set to Walkable


  2. Still on the Navigation tab select Bake and click the bake button to bake the TeleportArea to create navmesh info.


  3. Expand [Viveport Scene SDK] and update the navmesh data. Select Navmesh > inspector > Update Navmesh Data


  4. TEST! Assuming you have a Vive setup to test teleporting in your creation. Hit play to test!


  5. Have fun experimenting with different layouts of the space. Remember, don’t block the menu!

  6. To create areas where the user can’t navigate, do the following.


  7. Bake and update as before at step 2 and 3


  8. You’re on your way to creating an exciting VR Preview! Remember, do not block the menu!

  9. Hit play to test.

Return to index

Add interactive objects. Save often.

  1. Pickup Enabled Object.

    1. Import an fbx file into your project of the asset you wish to pick up.
    2. Import textures into your project to add to materials for the asset.
    3. Import audio into your project for your associated interactions, touch, click, impact, pointer enter object.
    4. Drag your object into the scene and place it where you want it.
    5. Create a material for your object and assign it.
    6. Drag textures to their corresponding swatch on the material.
    7. Add Component Collider to your object.
    8. Add Component Rigid Body to your object.
    9. Add Component Vive Object Props (Script).
    10. Check the check box for Pick Up Item.
    11. When testing use the controller to touch and pickup the object.



  2. Animated Object.

    1. Follow the steps for Pickup Enabled Object. Disable Pick Up Item if you don’t want to pick up the object.
    2. Expand any of the Interactions to add your animation and audio.
    3. Add your animation to the appropriate Interaction slot in Vive Object Props (Script). You can create your animation in Unity or import animation with fbx.
    4. Add Audio to the appropriate Interaction slot in Vive Object Props (Script).
  3. Consumable Object.

    1. Follow the steps for Pickup Enabled Object.
    2. Add Object to Object Interaction tab. Click Add Object Interaction to expand it.



    1. The Interaction Object is the object activated by this object. Check if you want this object to disappear “Is Object Consumed”
  4. Hit play to test.

Return to index

Skybox/Background Design. Save often.

  1. VR Previews allow for the creation of a skybox image that will be used at the browser level as a take-over imaged for the background of your content when users are browsing in Viveport. Here are some steps to follow to prepare one.
  2. Layout a background themed for your content.
  3. Change your VR Skybox Render Pos location if the default location is not ideal. Do not rotate the X or Z axis!

Return to index

Lighting. Dynamic and Baked. Save often.

  1. At this time VR Previews do not accept Realtime Global Illumination. I know, booo. We’re working on it.

  2. Realtime shadows are acceptable and recommended.

  3. Baked Global Illumination is strongly recommended.


  4. Lighting Settings.

    1. Make sure you have selected the Lighting Tab and select the Scene button. Here you will configure the lighting settings you wish to use. At this time Realtime Global Illumination is not supported.
    2. Click Generate Lighting to generate lighting information. This is also referred to as performing a light bake.
    3. You can check Auto Generate on or off. I prefer off until I’m ready to generate lighting.


  5. Once lighting is baked hit play to test

Return to index

Add Ambient Audioscape. Save often.

  1. Create an empty GameObject in the hierarchy and name it Ambient Audio.

  2. In the inspector Add Component Audio Source.

  3. In the inspector Add Component Preview Audio Context (Script).

  4. In the inspector Add Component Vive Object Audio Ambience (Script).

  5. Expand the elements to create more slots for audio files by increasing the size number.

  6. Drag and drop your audio files.


    • Ambient sounds: An array of 2 or more sounds of a similar character.
    • Time minimum: The lowest value in seconds for an ambient sound to trigger.
    • Time maximum: The highest value in seconds for an ambient sound to trigger.
    • Sound volume: Sets the audio source volume between 0 and 1. See Initial Setup for recommended values.
    • Sound distance: Near, medium, or far. Determines the maximum of range of a sound and attenuates the minimum hearing distance.
    • Ambient speaker: Assumes control of the automatically-added audio source.
  7. Hit play to test.

Return to index

Open the Export Editor to export your VR Preview. Save often.

  1. From the Unity Editor menu at the top select Vive > Export Editor


  2. The Export Editor will look like the following, prompting you to go through the next steps


Return to index

Export your VR Preview Step by Step

  1. Find your Id here.

  2. App Id. Add your App Id or a test name if you don’t have an App Id yet for submitting to Viveport by clicking [Change Current AppId].


    1. Type in your AppId or testname and click [Set App Id]


    2. If you need an AppId go to the Developer Console here: If you have a developer account go to My Titles > Manage > VIVEPORT Listing > and you should see your VIVEPORT ID. This is your AppId.


  3. Navigation Mesh. Click [Update ViveNavMesh Data] to refresh it. It should look like this.


  4. Navigation Mesh Errors? If you get errors here follow the steps for baking navigation mesh under Setup teleporting . Then click Update ViveNavMesh Data to refresh it.

  5. Package Scene. Click Package Scene.


  6. VR Preview Scene Created. The red alert should go away after clicking Package Scene.


  7. Prepare Skybox. Select the VR Skybox Render Pos object in the Hierarchy and place it where you want the view of the skybox rendered from if its default position is not ideal. Hide objects in the Hierarchy if you don’t want them rendered in the skybox image. Alternatively you can import a Prepared Cubemap to package as your skybox.



  8. Export Skybox. Click Package Skybox. The red alert will go away.


  9. Export All Contents. Click Export All Contents.


  10. Export All Contents Pop Up. Take note of where file is being saved. Click Ok.


  11. Export All Contents Complete!


  12. Test your VR Preview!

Test Exported VR Preview

  1. Go to the Target folder shown at the bottom of the exporter and copy the .zip file

  2. Navigate to ViveportVRDLC folder in the sdk download and paste the .zip file


  3. Navigate to your ViveSceneSDKTestbed folder


  4. Double click ViveSceneSDKTestbed.exe

  5. Find the name of your .zip file and choose [Load Skybox] to view your exported skybox

  6. Choose [Load Scene] to test your exported VR Preview

  7. If it all looks as expected submit your .zip file

Submit VR Preview

  1. Navigate to the dev console online
  2. Submit your VR Preview
  3. An email will be sent to notify the Vive review team to approve the VR Preview

Congratulations! Thank you for supporting the world of Virtual Reality!


If you would like to provide feedback or need further assistance with the VIVEPORT SCENE SDK, please go to the community in

Back to top