Table of Contents
How to make a multiplayer game: UI Elements
This part of the tutorial will help you to add the IceWizard and other necessary elements.
Ice Wizard
The IceWizard is very much similar to the FireWizard and has the exact same animations and behavior. The resources have everything that you will need to complete this step, and I would encourage you to stop right here, and try to add the object all by yourself. I am sure you have all the knowledge to do it, and compare your work with the screenshot below!
Attack Projectiles
We have two kinds of projectiles:
- Fire projectile
- Ice projectile
We shall work on the Fire projectile first.
Fire Projectile
This is a simple sprite, which has just one image with no behavior. Your sprite should look like this:
Note: I have left the animation name blank because there is no use for it.
Ice Projectile
Health Bars
This is a fun task to do! Why? Because we will use PISKEL for this! PISKEL is an interesting tool for us to use, which is going to give us the ability to create game assets ourselves without having to work off of other peoples' work.
- Create new object.
- Choose Sprite.
- Rename to “FireHealth”.
- Click on + symbol.
- Click on Edit with PISKEL
You should be here now here:
Our goal is to paint this entire 32×32 area with the color red. Watch below to have a better idea!
Redo the same thing for creating the IceHealth, and this time paint the entire 32×32 area with the color blue.
Delimiters
These are some helper objects that will limit the movement of the wizards. The wizards will move out of the screen if they aren't stopped, and this is where these objects will come into play. We need to create two different sprites.
Top Delimiter
Bottom Delimiter
Background Image
This image can be anything you want. But make sure it's greater than 800 × 800 resolution(Our game window, by default, is of 800 × 800 ), or else the image won't cover the game window, and would need to be stretched giving it a bad look. Read further here.
This can be changed under
Project Manager → Game Settings → Properties → Window Height & Width.
- Create a new object.
- Choose Sprite.
Winner Display Text
Before we can add this, we must add a new Layer for our game. Layers allow us to put different instances of objects on the same scene but on different surfaces. This gives us the ability to segregate a control layer, a pause menu layer and so on.
- Open the layers editor on the top right.
- Click on the + button to add a new layer.
- Rename to “GameOver”
- Create a new object
- Choose Text
- Rename to “WinnerText”
- Change Size = 50
- Add font file “Kenney Mini Square.ttf”
- Change text to “The winner is:”
That's it! We've added all the sprites that we would need! On the next page, we will place them on our scene and begin with the events!.
→Read the next part of the tutorial here!