Apr 14, 2021
From Prototype to Work of Art
Out with the prototypes in with the sprites
From cubes and capsules to professional looking sprites.
We have been working on our 2D project in a 3D environment. In order to start replacing our primitive objects with sprites, we need to convert over to a 2D environment.
The first step is to select or activate the 2D button at the top of the Scene.
This takes our scene and “flattens” it into 2D.
After importing our sprite package into the Project window.
we can now start to convert our resent game to 2D with the new sprite graphics.
Lets give our game a background fitting for a space shooter. In the sprites, there is a background overlay sprite file. Lets drag this into the Hierarchy window. Once there, let’s rename it to Background, set the sorting layer to background and resize it to fit the Game view.
If we look at our current GameObjects, they are all 3D objects and they have Box Colliders and some have Rigid Bodies and a cube mesh filter. These are all 3D components.
2D objects start out with Sprite Renderer. So, we need to add a BoxColliders 2D and if needed a RigidBody2D. To do this, just select the object and in the Inspector, at the bottom select Add Component. Search for box collider 2D.
Make sure to select the is Trigger. This will prevent weird things from happening to certain objects during game play. For those objects with a RigidBody2D, like Laser and Enemy, don’t forget to set Gravity Scale to 0 as we are using scripts to move these objects.
For both the enemy and Laser objects, we need to change the 3D components for 2D components like we described above.
Once we have done this, the game’s collider system won’t work the way we have it scripted in our enemy script.
This trigger is made for 3D objects. Since we are now using 2D sprites, we need to change it to
One last thing. Since we changed our Player from a cube to a sprite, the laser offset isn’t going to be accurate any more. In our Player script, lets change the offset to 1.05f. If you created a variable for this, just change it at the variable if not, go down to the FireLaser() function and change it in the Instantiate code.
Now it should look a lot better when we fire our laser.
So, lets take a look at our transformed game.
