Graphics have many functions in games; they help tell the story, set the tone, and immerse the player into the world of the game, but they also make the information in the game system visible to the player through state changes and stat changes. For example, an attack animation makes it much clearer why an enemy character causes damage to the player, and a hit points meter going down, blinking red, creates a sense of urgency and communicates the current state of the game so that the player can strategize accordingly.
On sprites and file types
In this tutorial we will be using the word sprite to refer to any graphic shown in the game – either a static image or an animation. For your Construct 3 games, we recommend the file format PNG, since it allows for transparency in your images while still compressing them pretty small. You can compare this to a die-cut sticker.
If you are working with scanned hand-drawn images or photographs, your image probably has a background you will want to edit out before importing the image into Construct. How to do this depends on your software, but generally speaking you need to create a transparent background layer, and then remove any color data from the image layer through using an eraser tool or similar.
In most graphics or photo editing software, transparent background PNG is available as a file format through the Export as-menu. Please note that PNG does not preserve layers, so if you want to preserve editing capabilities, you will need to save the file multiple times.
Next, we’ll take a look at the Construct 3 Animations editor:
Return to Tutorial 3 starting page: https://playableconcepts.aalto.fi/tutorials/tutorial-3/