4 min read

Jan 17th, 2018

I'm Learning VR Day 13: Building the White Void

by Evan Mays

Today is day 13 of my challenge to learn virtual reality development in 21 days. I already had a working game and an idea of how I wanted it to look. Over the last few days, I brought the aesthetic of the game to life. You can see the game's new logo above!

The first step was redoing the game's scene. The room from my game looked artificial (which I'll talk more about below). So, I changed the scene to be a white void.

Then, I outlined the playable area of the game's floor to make it look like an invisible floor existed despite all the white space. There's an image of the final product at the bottom of this post.

Redesigning the Characters

I needed characters to replace the red and green rectangles I previously used. I found two images of 3D bubble men and edited them in photoshop to "flatten" out the pictures.

The bubble man holding a traffic cone is friendly. The player loses points if they hit him. The bubble man holding the treasure chest is a thief. So, the player gains points for shooting a laser at the thief. I want to add different designs for the character types later, but now that I have the flattening process down that will be quick.

You can see before and after images of the flattening process here:

Photoshopping the Characters

Game designers use pictures from real life all the time in their games. Say I'm a game designer who designs a wall. I'll find a wall in real life that looks like the one I want in my game, snap a photo, then put it in the game.

Usually, these photos aren't ready to go. They have to be photoshopped to look good in a video game environment.

Today, I learned game designers flatten the images they find. The way I think about flattening is that it's the opposite of blurring. Blurring removes the small details in an image. Flattening removes the large details. You can sort of see what I mean in the before and after pictures above.

The reason flattening is necessary is that game designers will take a picture of a small part of that wall, then repeat that picture. That small part of the wall they took a picture of may not have been evenly lit. If it were more lit on the right side than the left, every time that image repeated, it would be obvious that the game's wall is artificial.

You can see the need for flattening in an image of my game from the last post. I'll put the picture here.

I dropped that whole design. But, I brought the idea of flattening to my new design. I flattened my characters to make them look like they belong in the scene. Here's the process I created from scouring the internet for different techniques.