2D Galaxy Shooter — Leaving the Prototype stage and Going from 3D to 2D

Hello all!

Today, I am finally out of the prototype stage! This means that since the game has a good core and is playable, I can start making it a work of art by adding sprites, powerups, different kinds of enemies, and a UI system.

• Prototyping is useful to get the game off the ground and see if it can be made into a game. So before a company spends loads of money and time on high fidelity assets, its best to make a game with primitive assets

First, lets add an image for our background, then make the assets we already have into 2D sprites. To do this, its easier to just remake our Player, Enemy, and Laser assets.

• Note — most, if not all, the sprites I use will be from the GameDevHQ Filebase. These assets come with the courses I’m in, but fear not, there are several free assets online you can use.

Background and 2D Layer Sorting

Button for turning the game “2D”

First, let’s turn the game 2D by pressing this button at the top-left of your screen.

Now that everything is 2D in the scene viewer, drag a nice PNG into the Hierarchy for our background.

• .PNG files are pictures that have no background, these are widely used for sprites. If you use some other picture file, there will be a background the size of the picture that covers the terrain.

Use the “Rect Tool” to resize the image to fit the “Game View”.

While our background image is selected, rename it as Background, then head to the Inspector and find the “Sprite Renderer” component

1. There, under the “Additional Settings”, click the drop down box beside “Sorting Layer” then click “Add Sorting Layer”.
2. Click the + button under “Sorting Layers” and name the new one “Background”, and to save some time later, add another layer and call it “Foreground”.
3. Select the Background again, then make it’s sorting layer “Background”.

• Sorting Layers are used in 2D games so the sprites don’t blend together; An example would be a 2D stealth game, a basic scene would have 3 layers: the background layer, crates and stuff to hide behind, then the foreground where the player and enemies are. If the player needed to hide from an enemy, they could press a button and hop into the 2nd layer for over and watch the enemy pass by.

Making our Current Assets 2D

• Player

Making our cubes into sprites is not as daunting as it seems, all we have to do is drag in a sprite and give them similar stats.

1. Find a good ship .PNG file for your sprite and drag it into the Hierarchy and name it “Player”.
2. Set its tag to “Player”.
3. Add a “Box Collider 2D” component and check the box, “Is Trigger”, then click the box by “Edit Collider”.
4. When that is clicked, look at the sprite in the scene view. There should be a green box around your ship as seen above, use the tabs to size the box around the ship. This will be your hit box.
   - If a box collider doesn’t fit your ship, you can always try a circle collider.
5. Drag the Player script on to the sprite.

• Laser

1. Find a .PNG file of a laser, drag it into the hierarchy, name it Laser, then scale it down to an appropriate laser size.
2. Set its tag to “Laser”.
3. Add a “Box Collider 2D” component and check the box, “Is Trigger”, then make a hit box the same way you did with the player.
4. Add a “Rigid Body 2D” component and set the “Gravity Scale” from 1 to 0.
5. Drag the Laser script onto the Laser sprite.
6. Delete the old Laser prefab.
7. Make the Laser sprite a prefab by dragging it into the prefabs folder.

• Enemy

1. Again, find a nice enemy looking ship .PNG file into the hierarchy, and name it Enemy. If the .PNG is facing up, that’s okay, just rotate the sprite 180 degrees.
2. Set its tag to “Enemy”.
3. Add a “Box Collider 2D” component and check the box, “Is Trigger”, then make a hit box the same way you did with the player.
4. Add a “Rigid Body 2D” component and set the “Gravity Scale” from 1 to 0.
5. Drag the Enemy script on the script.
6. Delete the old Enemy prefab.
7. Make the Enemy sprite a prefab by dragging it into the prefabs folder.

Relinking our assets

If you try playing the game now, it doesn’t play the same. This is because we need to relink our lasers to the player, and enemies to the SpawnManager.

1. Head to the player and head to the script component.
2. Where it says “Laser Prefab”, drag and drop the new laser prefab. That will fix our shooting.
3. Now head to the Spawn_Manager and head to the script component.
4. Where it says “Enemy Prefab”, drag and drop the new enemy prefab. That will allow the Spawn_Manager to make enemies again.

Converting OnTriggerEnter to OnTriggerEnter2D

Since OnTriggerEnter is used in a 3D environment, it won’t work with 2D sprites, so we need to change it to 2D. Its a simple fix.

Head to the Enemy script and find the method, “OnTriggerEnter”.

OnTriggerEnter2D

Looking above, add 2D after OnTriggerEnter and Collider. This will allow the laser to destroy the enemy, and the enemy to damage the player again.

Sprites at Work

Look at this, in just a few steps, we were able to make this game look like a work of art! Prototype stage is over, so now let’s refine the game into something wonderful!

Next, I will go over how to make a “Triple Shot” powerup!

Thank you for your time!