Turning our Prototype into a High Fidelity Game

So far, we've created our player and made it shoot lasers, and we’ve created enemies to shoot at. But we’ve been using placeholder objects for our game and although it might be fun to play, it’s not visually pleasing. Visuals in a game are as important as the logic, and today we’ll be importing the visuals for our game and replacing the placeholders.

The GitHub Dilemma

I won’t be sharing a lot of images and progress gifs in my articles like I usually do. The main reason is that I’ve been using GitHub Desktop as my Git-Client and I couldn’t preview nor checkout older commits. Trying to revert my repository to an older commit created a bunch of issues and conflicts that caused me to panic and I asked a friend to help me out. He introduced me to Fork and helped me to get my project back. Shoutout to Dominic aka MaulWurf93 on Discord for helping me out.

Back on good ground

It’s time we spice our game up and add some visual and audio effects. Since these articles are my progress of a course taught by GameDevHQ, they’ve also provided the assets we need for this course. They have their asset collections available through a plugin called Filebase.

I’ve imported Filebase from the GameDevHQ website and imported the package into my project. Once that was done I opened Filebase and logged in. I then proceeded with downloading and importing the assets.

There were quite a few things I had to change. When we started the prototype process we used 3D objects, but now we’ll be using 2D sprites instead. This caused me to change some things on my player, laser and enemy objects. I had to replace the RigidBody with its 2D counterpart and the same for the box collider. In the course video, Jonathan used the “Box Collider 2D”, but I preferred to use the “Polygon Collider 2D”. This allowed the collide to “wrap” with the sprites we’ll be adding later. We removed all of the “Mesh Renderers” and “Mesh Filters” and replaced them with a “Sprite Renderer”. Once I’ve worked through my player and prefab objects ensuring that everything is set up properly I proceeded to create layering.

In a 2D scene, we’re basically stacking images on top of each other, and we need to define a “Sorting Layer” as well as adjust the “Order In Layer”. Under the “Sorting Layer” I’ve added 2 sorting layers. One being the Background and the other being the Foreground. Our player, lasers and enemies will be on the “Foreground” layer, and our background like the name suggests will be on the “Background” layer. Once all of that was set up, I’ve added the background images which looks like a group of nebulae.

All Wrapped Up

Doesn’t that look amazing? We have started our project and created a working prototype with all of the logic we wanted. From there we brought in beautiful graphics that are pleasing to look at. You might be wondering what the benefits are of prototyping a project? Creating high fidelity assets for a game is a time-consuming process, and often assets aren’t as reusable as coded logic.