Oooh! Pretty!

From Prototype to Work of Art

We’ve now built our prototype, and we’re pretty happy with how it functions. Time to make it look like the 2d space shooting game we have planned! There are just a few steps we need to perform to make our 3D prototype into a 2D production quality game.

We’ve been provided with a number of assets for this project so adding them to the project is as simple as dragging them into our project window and making sure that they are organized into the folders that we want. In this case, I was lucky in that the assets were already in the folder structure I wanted them in. It is also important to make sure that our image assets are imported in the format we are looking for. In this case we want them as Sprite 2D files.

New Assets

We can adjust our Scene view to show us our game as a 2D scene. To do this we click the 2D button at the top of our Scene view.

Setting 2D Mode

First we’ll add the background to our play space. In the future this back ground will be upgraded to something more dynamic but the asset that was provided will do for now. We can drag our back ground sprite from our project window to our hierarchy window and adjust it’s size to match our game window. This sizing could be done dynamically but this static placement is fine for now, as I plan to replace it with something more dynamic later.

Adding the background

There are a few ways we can convert our player from our 3D prototype into our 2D sprite. One method would be to drag a copy of our player sprite image into the hierarchy, rename it to Player, and re-add our Player script, a box collider 2D component, our Player Input object (because we are using the new Input System), and reset all of our values to what our original prototype object had them at. It is important to make sure that we apply the Player Tag and make sure that the Box collider 2D component has the Is Trigger flag set.

I am going to choose an alternative method. I am going to replace the Box collider component with a Box collider 2D component, and the Mesh Renderer and Cube (Mesh Filter) components with a Sprite Renderer component. Then I’ll drop our player sprite into the sprite renderer. We also need to make sure that the Box collider 2D component has the Is Trigger flag set. Either way you end up with the same result. Our Player tag and the settings of our Player Input and Player Script components are preserved in this method.

Player Changes

We still have some code changes to make but before we do that, lets finish converting the other visuals. We can use the same steps to convert our Enemy object but, because this is a prefabbed object, we want to make the changes to the prefab instead of an object in the hierarchy. We also need to replace the RigidBody component with a RigidBody2D and set the Gravity Scale to 0 (which does the same thing as unchecking the “Use Gravity” option on its 3D counterpart).

Enemy Changes

The conversion of our laser prefab is identical to that of our enemy prefab. You can choose a Box Collider 2D or a Capsule Collider 2D, I chose capsule despite the graphic provided being a rectangle because I intend to swap out that graphic with something that looks a bit more like a fireball with a tail.

Laser Changes

We’re almost there. We swapped out all of our colliders and rigid bodies with their 2D counterparts. Now we need to adjust all the Unity Event Handlers in our classes to handle the 2D version of those collisions as well.

In our Enemy class we change

OnTriggerEnter

to

OnTriggerEnter2D

I adjusted our colliders to match the size and shape of the new graphics. I noticed that the enemies were dying, what seemed like, long before the lasers were actually hitting them. This was because the collider on my Player was very small, the collider on my laser was very short, and the collider on my enemy was 3 times the size of the graphic. I adjusted this by going into each collider in the editor, clicking edit collider and adjusting the collider in the Scene window.

Edit Collider

And now we’ve converted our prototype to a production ready project! Tomorrow we’ll talk about why we started with the prototype and the benefits of prototyping without assets! If you enjoyed this article, or want to come along with me as I progress on my journey, follow me at gamedevchris.medium.com.

Unity Game Developer, Software Engineer, Gamer, Musician, and Father. Christopher is a creative that enjoys a challenge and loves coding.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store