Working with Sprites

This is an excerpt chapter from my Weekend Code Project: Unity’s New 2D Workflow book. I hope you enjoy this free content on how to use Unity’s new 2D features. If you like what you see, please pick up a copy of the book to get access to the artwork, source code and a PDF/ePub version of the book.

Cutting Up Sprites

You can continue with the project we set up earlier, or start a new one from scratch. Either way you should only have the Camera in your project, and have 2D mode toggled. 

Next we need to import all of the game artwork into the Assets folder. Before we do this, let’s create a new folder called Artwork. You can easily do this by right clicking on the Assets folder itself and selecting Create > Folder.

While you are at it, make the following folder structure:

  • Artwork – Where all of our artwork goes.
  • Misc – For extra files we create that don’t necessarily fall into one of our three main categories.
  • Prefabs – This is where we will put completed prefabs, which I will talk about later on.
  • Scenes – This is where you will save game Scenes.
  • Scripts – This is where we will put all of our scripts.

At this point we can drag the game artwork into our Artwork folder and open it up to take a look.

Here you will see we now have everything we need to build our game with. If you select any of these images, you will notice in the Inspector panel that it has already automatically been converted into a sprite texture for you.

While this is incredibly convenient for a single sprite, you may want to import your artwork as a Sprite Sheet. As you can see from our artwork, the Monster is already set up like this for us. Click on it and look at the Inspector panel.

You will notice there is a Sprite Mode drop-down under the Texture Type. Click on that and select Multiple.

From here you now have access to the build in Sprite editor.

Once you have done this, you can begin cutting up your sprite sheet manually or having Unity do it automatically. Click on the editor and you should see the following tool.

By default, the entire image is set up to be the sprite. You can manually change this by drawing a blue box around the image’s border, and you can also draw additional boxes by hand to define more sprites.

This is great for more complex sprite sheets, but this image can be automatically cut up for us. In the upper-left hand corner, select the Slice tab and change its Type to Grid.

Once you do that, you will be presented with some options to define the dimensions of your sprites.

The X and Y here represent the dimensions of each sprite. Change the X to 160 and Y to 240 and hit Slice. The last thing you need to do before closing this menu is hit Apply in the upper-right corner. Once you do that, you will now be able to select each sprite individually and see its blue box outline confirming the sprite was correctly cut up.

Now, if you toggle the check next to the monster sprite in your Artwork folder, you will see each sprite as its own file.

Now we are ready to create an animation for our Player.

Creating Animations

Creating animations in Unity is very easy; it’s basically done via drag and drop. To get started, we will need to select the three Monster sprites we created in the previous section and drag them onto the Scene. As soon as you do this, you will be presented with the Create New Animation window asking you to name it and find a place to save it.

Simply call it MonsterAnimation and save it to the Artwork folder. If your game has a lot of animations, you may want to have a dedicated folder for organizing them better. Once you hit Save, you’ll have a GameObject with your animation in the scene. Hit the Play button to see it in action.

There is not much to look at right now, but this is the basic process for creating a 2D animation in Unity. Let’s talk a little more about the two items we just created. We’ll start with the MonsterAnimation. Click on it and look at the Inspector panel.

Here you will see some basic information on how the animation will run. A lot of these options actually apply to 3D animations. You should keep in mind that Unity’s new 2D workflow was designed to work within the same 3D system Unity developers had been using for years. Now let’s select the controller for the animation and, from the Inspector panel, select the Open button. You can find it in your asset folder called monster_0, which was automatically generated for you.

Rename it to MonsterAnimationController and hit the Open button in the inspector.

Here you will be presented with the Animator tab. This allows you to chain animations together and create more complicated animation sets. We will only be setting up a single animation for this game, but it’s important to note that you can open up the MonsterAnimation in this view and modify more of its properties.

Here you will notice that our Speed is set to 1. You can play with this value to alter the playback of the Monster opening and closing his mouth. Try setting it to something smaller, like .10, and playing the game. You’ll notice how much slower the animation is running. Return it back to 1, and let’s move on to the next step of our game, which is creating prefabs.

Before we move on, you should save your scene. You’ll notice that our game needs to be saved by the asterisk in the title of the project.

Simply select Save Scene from the File menu.

And save it as Game in our Scenes folder. It is a good idea to get in the habit of saving often, especially after each of the sections in this book.

Subscribe To My Mailing List

Want to learn how to make a game? Not sure where to start? Even if you are a seasoned game maker there is still a lot you can learn from my mailing list. I'll be covering tips and tricks for how to build, release and market games each month.

Simply sign up for my mailing list and also get access to a 50% off discount code for my eBooks and other content. I promise to not spam your inbox!

Join Now