Creating a VR drumming game: Part 3 (Concept Art and Low Fidelity Prototype)

Katie Van
4 min readFeb 20, 2020

--

In part 2 of creating a VR drumming game, I designed wireframes and made decisions about the user experience and flow of the game. This week, I’ll be showing off a finished design composition (concept art), as well as a very early prototype I created. In case you are new, in this series, I will be covering everything from design to coding and implementation of creating a VR drumming game! Here’s part 1.

Sneak Preview of the Drumming Prototype

The Finished Design Comp

Before creating the VR game, it is important to visualize what the finished project will look like. And when working with a group of people, this is even more important. And so, I geared up my digital illustration skills (I’m a die-hard concept art fan) and set upon the quest to put to the pixels what I imagine the VR drumming environment to look like.

As a refresher, here is the wireframe from last week’s VR drumming game scene:

And here is the finished design composition, for the VR drumming environment when the genre is set to hip-hop.

“Hip-Hop” VR Drumming Environment Design Comp

The player controls the drumsticks via a VR controller. The drums are in prime distance to hit via the drumsticks. The look of the drums and the environment around the player reflect the musical genre that is currently selected (in this case, hip-hop).

The environment communicates details relevant to hip-hop. The New York subway train bursting through the wall is a nod to hip-hop’s origins as “New York rap”. Posters of iconic hip-hop artists hang on the wall. Graffiti is considered a visual expression of hip-hop, (like break dancing is considered a physical expression), so I tried to make a “Hip-Hop” tag on the train. I’m no pro graffiti artist, but it communicated the idea for this illustration.

I took inspiration from the images displayed in the mood board I constructed below:

Hip-Hop Environment Mood Board

Future Environments

While I only needed to create one design composition for the VR experience, in the future I will likely be designing two more environments for the other two genres (although not to the same level of illustrated detail).

It took some deliberation to decide what to make the Pop environment look like. Malcolm, the “sound guy” (I’m sure music producers love being called that) from my team suggested using beach/tropical/LA type vibes to communicate the kind of feeling of current pop sounds. Here is the resulting mood board the Pop environment will be based on:

Pop Environment Mood Board

The Jazz environment will feel more dark, moody, and homey, and make use of the fluorescent neon sign light aesthetic. The jazz environment will have a more antique feel to it. Here is the resulting mood board the Jazz environment will be based on:

Jazz Environment Mood Board

The 3D Prototype

I also created a simple 3D prototype video to communicate how the drums would work when our group presented our concept during class. I’m definitely a Unity fanboy so rather than use a-frame, I used Unity + video editing magic for sound to quickly mockup the drumset.

See the prototype here:

Creating the prototype raised questions for me and made me realize ways our scope will need to be expanded to give a good drumming experience. These mechanics include:

Drumstick velocity: The speed at which the drumstick hits the drum should result in a sound that sounds louder or quieter. Not having this feature will make it feel very unnatural to play.

Cymbal-specific mechanics: If a hi-hat (left cymbal in the video) is hit lightly it makes a subtle “tch” sound. But hit hard, it will ring out with that classic “psshhhhhhh” cymbal sound. (Hey, I have the vocabulary of an artist-programmer, not a musician! Although I am interested in learning how to produce music one day.)

Coming Up Next Week…

In next week’s we will finally get into development and the technical details of setting up an aframe project, creating VR drumstick movement, and programming some drum components with the mechanics I outlined above.

Thanks for reading.

If you like reading about creative/technical projects, weird experiments, and possibly book reviews/summaries in the future, consider subscribing to my account.

--

--

Katie Van

Artist, web developer, video editor, indie game developer, and aspiring writer. I like experiments, productivity and mindset hacks, how-to, and life lessons.