,
Typeface Anatomy
Learn about basic terminology and the detail elements of typefaces.
,
,
Historical Typefaces
Frameworks for building VR Apps
To start the project, the first thing I did was research for the tutorials and available frameworks. I knew that I could use Unity to build VR apps but I was looking for something similar to Holographic Academy tutorials and HoloToolkit that helped me build mixed reality experiences on HoloLens. VR Dev School’s tutorial was very helpful to understand the basics of SteamVR and the mechanism for the controllers. For the framework, I have been looking into NewtonVR and VRTK. Both of them had great sample scenes with detailed implementation examples. I chose VRTK as my base framework to build Typography Insight since it covered various topics that I needed such as laser pointer and controller interactions.
Re-thinking interactions with 6DOF controllers
In Type Playground, you can play with type and create typographic compositions in three-dimensional space. Using VRTK’s scripts with Vive’s 6DOF controllers, I was able to interact with text objects directly. Therefore, I didn’t have to use the gaze cursor. With this input change, I made some updates to the menu system.
Many UI buttons that I had in the HoloLens project were no longer needed. For example, I could remove the buttons for the different manipulation modes (move, rotate-x, rotate y) since I can grab and manipulate text objects directly with the controller.
Body locked floating menu bar was no longer needed. Instead, I have moved the buttons from this menu bar to the top of the left controller so that users can easily access anytime they need them.
I moved the edit/duplicate/delete buttons to the top of each text object for faster actions.
,
,
Menu buttons before & after
,
,
Tools menu on the left controller in VIVE VR version designed for the laser pointer input and trigger
Type with Physics is Fun!
,
,
In HoloLens, real environment was the background of the app. However, In VR, I had to create my own environment in the virtual world. Skybox is an element in Unity that you can use as an environmental background by assigning 360 photo images or solid colors. For the default experience, I created a 3D grid environment with image texture that aligns well with the topic typography. In addition to this grid-based environment background, I added several photo environments that make the experience feel like augmented reality. You can play with typographic layout in deep space or on the streets of Paris.
Another interesting element in VR is the floor plane. Since Skybox is a huge spherical or cube object that surrounds you, you still feel floating in the space. This could be an uncomfortable experience for users. To help the user feel grounded, I added the floor plane with opaque color. I tried translucent colors with different opacity on this floor plane but being able to see the deep space below my feet felt uncomfortable.
,
,
Floor plane
Grabbing Text with Pointer
,
Source: Medium