Final Post

Thank you for following my blog on the processes of how I have created my game, the link to the game is below. I hope you enjoy!

http://www.stencyl.com/game/play/11708

Thanks, Zak.

Creating a Loading Bar

To create a loading screen was a very simple process, and I felt was a good way to finish my game and make it more unique for when I upload it to Stencylworks. On the Stencylworks application you click the section "Loading Screen" and then you get to design your own scene for a loading screen and what colour you want the loading bar, I have chosen the desert background and used a yellow loading bar. This loading screen will only appear when the game is viewed on the browser not on a flash player.

Loading page screen shot

Creating a Completed Scene and Behaviour

For the completed scene I used the background from the start game slide too. I then used the same process as the start screen for the buttons so I had an animation that flipped the image around when the mouse was scrolled over it, I included this into the game as an actor with no physical properties. To get the behaviour I duplicated the already existing "Start Game" behaviour and renamed the duplicated version "Restart Game" and then set this behaviour to the restart button actor I have created. I have included the images of the two characters on the completed page too, I felt this was a good touch as it helps the overall theme.

Restart button when scrolled over

Original image of restart button

Screen shot of the completion screen

Code to restart the game

Creating a Start Scene Behaviour / Actor

I have now sorted out all of the characters animations and sounds and sorted my scene design and behavours it was time to make a start on the start screen. I feel for the design I am going to use the desert background from the first scene as it looks good, and is my favourite background, I am also thinking of having an image of the main character jumping on the bad guy so you nkow exactly what to expect when you start the game. To create this image I would have to actually create two new characters, so I created a main character with one frame, and set the physics to non movable, I then had to repeat this for the bad guy and just put the crushed animation and set the physics to non movable. This allowed me to have an image of the main character crushing the bad character on the main screen.

To create the behaviour for starting the game I had to create an actor behaviour named "Start Game". Firstly I had to use the "Always" block and drag in the "if" block, within this section is a mouse click behaviour which sets the start screen to fade to scene one after 0.3 seconds. Secondly I had to use the "When Drawing" block to create the animation for the start button itself, and use the behaviour "If mouse is over self" "Switch Animation to 1 for 'Self' ". And then do the opposite behaviour below it which reads "IF not mouse is over 'Self' " "Switch animation 0 for 'self' ". This animation behaviour will make the start button swap images and look more of a clickable button.

The code for the behaviour

For this behaviour to work I then had to create a start button actor to use the behaviour. To do this I created a button on Photoshop and added it as a frame for a character as "Animation 0" and then I created the image I would want it swapped with and name a new frame as "Animation 1". When the "Start Game" behaviour has been added to this actor the button will fully work and switch the scene to the start of the game.

Original start button image

Replaced image when scrolled over

Behaviour for Changing Scene

After I created my scenes I needed to select a starter scene, as I have not made a start page yet I will selec scene 1 as the start scene. To switch the scene I had to create a new scene behaviour, I named this behaviour "Switch Scene". For this behaviour to work I had to code it correctly in the code section, firstly I used only the "Always" block for my behaviour, I then had to click on the flow section and create an "If" statement within the "Always" block. Secondly I clicked on the attributes tab and created three attributes; "Actor", "Scene" and "Region" and these are the attributes used within the behaviour. Next I had to use the scene - region tab to select which actor to use, if you look at the screen shot below you will see the "Actor is inside Region" statement after the "If". Thent he behaviour to actually switch scene needed to be used, this is also within the Scene button, the statement that I was using was "Fade out for _ secs, then switch to scene and fade in for _ secs. I set the timing as 0.3 seconds, a screenshot of the code below will probably help you understand.

Switch Scene Behaviour

Secondly this needed to be brought into a scene, when adding this to a scene I had to create a region that when the actor passes it switches scene. When this region is created you add the "Switch Scene" behaviour to the scene, and you will have to select the appropriate region, select the actor that passes the region and select the scene it switches too. I may mark the end of the levels with a level complete sign.

Creating a Scene

Now I have to create each individual scene for the game, I have decided on making four levels, a start screen and a game completed screen but for now I will only concentrate on making the four level scenes. For the first scene I have use dthe background for the desert that I have edited myself, I wanted to use this one first as it was my favourite background and helped set the scene as a cowboy theme. I used the existing tile set that I have created for the scenary, and finally inserted my characters. I did this for three more scenes after and theyn all had different background. You can see below a print screen of all four different scenes.

Scene 1

Scene 2

Scene 3

Scene 4

Making the Tiles for My Game

I decided that considering my game is based on a cowboy theme that I should try and make a tile set of my own that has a sort of cowboy or desert theme to it. I felt the easiest way around this was to edit an existing tile set as I liked the shape and design of them already, just as they were based on grass they did not suit in my levels. To edit them I opened up each individual section of the tile and clicked the button "edit frame" this opened you up to Stencylworks own imaging software "Pencyl", I then experimented around with a variety of yellows and different shades until I found a style that I was happy with. I then saved the codes for each individual colour and added them to the rest of the tiles to complete my desert theme.

Creating a sand effect on Pencyl

Opening up individual tiles ready to edit them