Getting Started with the HoloPlay SDK for Unity in the Looking Glass
This is a tutorial on how to set up your first scene with the HoloPlay SDK for your Looking Glass. In it, we'll be going through and altering the example scene included in the Unity package. This tutorial assumes that you have already installed Unity. If you have not, please see instructions on how to do so here. This tutorial also assumes that you have set up your Looking Glass and your computer settings correctly following this tutorial.
Now, download the latest HoloPlay SDK.
(Last Updated: September 22, 2018)
Step 1: Configure your Settings
The first thing we need to take care of is getting our computers set up correctly. In the Looking Glass setup guide, we configured our computers in a particular way. It is important to know, though, that those settings are optimized for running builds of Unity projects (i.e. applications). In this tutorial, we'll be using the Unity editor, and so our settings will be different.
When working within the Unity editor, we always want our displays to be extended, not mirrored. This will allow us to have Unity open on our 2D computer screen with the 3D scene rendering on the Looking Glass - allowing you to develop something in real-time.
If you are using a Mac
With your Looking Glass plugged in, open your system preferences and go to display settings. The ideal setting on Mac is to have your second (Looking Glass) display to the left of your main display and level with the top. This will prevent any distortion from resolution scaling that Mac OS often does by default.
If you are using Windows
Open your display settings window. Make sure that, under "Multiple displays," it is set to "Extend these displays." You should also ensure that the size of text, apps and other items is set to 100% and the resolution is 2560 x 1600 on your second display.
Now we're set up on our two screens and ready to do some development!
Step 2: Importing the HoloPlay SDK into Unity
Open Unity and you will be taken to the launcher window. Click "NEW" on the top right side of the window to start a new project.
Title the project whatever you feel is appropriate (I have gone with "HoloPlay Test," you can go with something weird like "holographic pickles"). Make sure that 3D is selected and not 2D, and click "Create project" at the bottom right-hand side of the window.
With our new project ready, we want bring in the HoloPlay SDK asset package. Download the HoloPlay SDK Unity package. Once it has finished downloading, go back to your Unity project. Click on "Assets," then "Import Package," then "Custom Package."
Find the SDK Unity package on your computer (called HoloPlay-SDK-0.1.4 at time of writing, likely in your downloads folder) and select it. This will jump you back to Unity, with an option to "Import" the package. Click "Import" to bring the package into your project.
A popup will appear asking you to change certain settings on your Unity project. These are to optimize your project for displaying content in the Looking Glass. Click "Apply Changes."
Step 3: Viewing the Example Scene
With our package installed and our settings correct we're now ready to see some 3D content! In the HoloPlay folder in your project window, you'll find a Unity scene called "example scene." Double click to open it.
You should now see a cylinder with a color palette mapped to it and two cubes in your scene view, and nothing on your Looking Glass. To make your scene render on your Looking Glass, click on the "HoloPlay Capture" object in your hierarchy. This object controls how and where your 3D content will draw.
With your HoloPlay Capture object selected, you'll see in your inspector tab that it has a component called "Capture" and one called "Quilt." These two components control the core of how Unity content renders to your Looking Glass. Let's look at the Quilt first so we can get something in our Looking Glass.
By default, we assume that your Looking Glass display is set to be to the left of your main display and its top to be level with your main display. If this is not your display arrangement, click the "Settings" button. This will pop up a tab that will allow you to set your screen arrangement. There are several presets, but you can also set the position on a per-pixel basis. Note, however, that there may be some issues associated with setting your Looking Glass display to be to the right of your main display on Mac because of certain OSX zoom defaults.
Now that our display is set to match our system settings, we can view our scene in 3D! To do so, click the "Toggle Preview" button on the Quilt script or use the shortcut, control-E (Windows) or command-E (Mac). You should now see the cylinder and two cubes on your Looking Glass!
Step 4: Understanding the HoloPlay Capture
Now that we have that working, let's go a bit deeper into the HoloPlay Capture.
In your scene view, you'll see a green box. This is your HoloPlay Capture space. Anything inside this box will draw in 3D on your Looking Glass. Let's add a sphere to our scene to make this clear. Add it to your scene by clicking "GameObject," then "3D Object," then "Sphere."
Anything inside this box will draw in 3D on your Looking Glass.
Change the position on your sphere's transform position to be -5, -2, 0 for x, y, and z respectively. Now you should see a sphere at the bottom left hand side of your Looking Glass! You'll also notice that it will update live, so if you move your sphere around your scene it will move around in your Looking Glass to match, so long as the sphere remains within the green box.
We can change the size of that box to shrink or grow the objects rendered on your Looking Glass. To do so, select your HoloPlay Capture object and adjust the "Size" slider on it's "Capture" component. If we increase the size to 10, you'll see the cylinder, two cubes, and sphere will get smaller.
We can also move and rotate the capture space using the HoloPlay Capture's transform (note that scale does not change the size). The reference point (pivot) for these values is at the center of the box, in particular at the center of what we call the "focal plane." Visuals aligned with the focal plane appear the sharpest in the Looking Glass, and as you move objects away from this plane, you'll see they get blurrier. If, for example, we move our HoloPlay Capture to focus on the front of the cylinder by changing the z-position value on it's transform to be -3, you'll see the front of the cylinder and the purple "On Render View" cube get clearer, while the sphere gets fuzzier. This will be especially apparent if you reset the size of your HoloPlay Capture to be 5.
Step 5: Starting your own Scene from Scratch
Now that we've gotten used to the SDK a bit, let's create a simple scene from scratch. This scene won't have much in it -- just a few cubes on a black background -- but it's a start!
First, let's open a new scene by clicking "File" and then "New Scene."
You'll see there's already a camera, called "Main Camera," in your scene. We won't need this because we're going to add our own camera system, so let's delete that object.
With it deleted, we should open the folder in our assets called HoloPlay and find a prefab called "HoloPlay Capture." Click and drag this object into your hierarchy, and you'll see our familiar green box in our empty scene!
Now, let's add something to the capture so we can actually see some objects. Let's add a cube by clicking "GameObject," then "3D Object," and then "Cube." You see a cube appear in the middle of your scene, but just in case, make sure to change it's transform position to be 0, 0, 0.
Our one cube is a little lonely, so let's give it another friend. Create another cube, but change the position of this one to be 1, 1, -1. Let's make one more for good measure, and set this one to be at -1, -1, 1. This will stagger our three cubes so that one starts at the bottom left corner farthest away from us, then there's one in the middle, and finally there's a cube at the top right and closest to us.
The cubes look a bit small in my Looking Glass, so I'm going to change the size of the HoloPlay Capture by clicking on the object, going to the component called "Capture," and changing the size to be 2 instead of the default 5.
That's much better! Now our cubes fill up most of the visual space of the Looking Glass.
Congratulations! You've taken the first steps towards developing with the HoloPlay SDK! To see other projects made with the HoloPlay SDK, check out our forum for all the latest releases!
If you have any other questions or feedback, email [email protected] To the future!