My First Game - Snakes and Ladders
Jul 02, 2015
Hi all,
thought I would share with you my first attempt at a true 'game' built in Storyline 2. I spend most of my time troubleshooting my user's problems with the software and dont generally spend time developing modules myself but during a quiet period I thought I would put things to the test.
I decided to take a simple board game and see how well I could replicate it using Storyline so decided on snakes and ladders.
Firstly, I am no designer so below credits where I sourced the elements used in creating this project.
- The game board, dice images & play button were sourced from a Google image search. Other elements are used from stock Storyline assets
- The intro music, winning scene music were ripped from Sonic the Hedgehog (thanks Sega) and downloaded from a video games archive website
- The text to speech was created here: http://www.fromtexttospeech.com/
- There is a small JavaScript called to generate a random number between 1-6 which I initially created but a better solution was found after searching the forums and a more streamlined version was used. Thanks to Colin for posting your solution.
- All Storyline creation and game planning is my own work.
The structure is very small, only a few slides, with multiple layers.
Here is a quick run down of the processes created to make the game function
- Intro plays
- Number of players is selected (currently fixed at 2, but could be expanded. All that is needed to be done is to duplicate the player1board slide and replicate the variables for player3/4/etc)
- Players enter their names
- Player one clicks the dice, this initiates the script and creates a random number between 1-6. Dice face changes based on number generated and audio description of the number plays.
- The player piece changes state to illustrate the new position on the game board. This is calculated by an initial starting variable of 1 + the rolled dice value
- Timeline ends, switches to next player slide
- Repeat steps 4-6
- Player has to get to 30 exactly. Anything over 30 and it is not counted.
- Visual notification appears when the player is within a dice throw of winning
- The first player to get a game value of 30 in their variable triggers the winners slide
- Snakes and ladders animations are triggered by slide layers based and game board variables at the relevant values based on where a snake or a ladder is placed. Simple motion timeline plays to show game piece moving up or down.
And that pretty much is that! Each player board consists of many triggers and a few slide layers. I'll post some more detailed screen grabs as a reply to this message.
The game could be a little more polished, it isnt perfect but this was more an exercise in replicating functions, randomness and rules of a simple game. Ive tested it as much as I can and it appears to run as well as I had hoped for. I would be very interested to hear your comments and thoughts on this and opinions on what could be done to make it slicker. One thing I would add is a mute button as after endless tests I have now come to hate Sonic who was once a dear childhood friend!!
I realise now I have waffled on quite a bit so if you're still with me then thanks for reading !!!
http://prescript-dev.co.uk/storyline/snakes-and-ladders/story.html
21 Replies
Hi Darren,
Thanks for sharing that game here! Throw bcack to my childhood with that music. ;-)
Have you looked at participating in the ELH challenges? They're another great way to get your work out there and feedback from users.
Nice game! Would love to see your source file to see how everything was setup. I'm still learning SL so this would be fun to learn how you did this.
Hi Ashley,
I love a bit of 8 bit video game music!!
I do have a look at the challenges, and to be totally honest, i just haven't had the time previously to participate in them. I hope this may change in the future and I can submit more of my work.
Tracy, thank you for your comments. I haven't quite polished the game completely as I would like it, there are still some things I would like to perfect and change slightly.
I have though produced a document that explains the processes used to create the game. How I have used variables, states, triggers etc. I hope this is useful for you and shows you my way of thinking in creating the game and can give you an idea of how to go about creating something similar in the future.
Thanks Darren, for the PDF. I will certainly try setting up my own using those instructions. It's so much fun to see how others set things up and what all SL can even do.
The PDF will definitely be helpful for others - thanks for sharing that here!
Hi Darren! Thanks so much for sharing this awesome example. I just added to our Examples hub to make sure others got a chance to check it out:
https://community.articulate.com/e-learning-examples/storyline-2-snakes-and-ladders-game
What a great game concept! Thanks for sharing this one with the community.
I have one issue with this game: My kid beat me three times. I get that it's randomized but that's not so easy for 6-yr olds to understand.
Do you think you could add a keystroke, hot key or other Easter egg to the game to ensure that I won? It would really mean a lot to me, Darren.
Morning Kelly, thank you for adding the game to your examples section.
@Dave:
Funny you should say that. You are not the first adult to ask for such a function after being beaten by their children!! My partner had the same frustrations after her 8 year old son kept winning.
Ive republished a new version here http://prescript-dev.co.uk/storyline/snakes-v2/story.html with a cheat added.
If you are player 1, discretely tap the Z key 3 times during your go (doestnt have to be at the same time, can be one press at various points in the game). At the third tap you will magically be announced as the winner. If you are player 2, it is the W key you need to tap.
Basically, added a new variable which increments by 1 every time the relevant key is pressed. When the variable is equal to 3, that person becomes the winner.
Enjoy!!
Hi Darren, thanks for sharing this really fun game! The functionality works great for me and my daughter! Its helped me keep on keeping on remembering to use variables and randomizing functions that I get skittish about doing! Regarding more superficial ideas of how to make it look slicker, here are a few ideas:
1. At the very beginning, maybe first have the announcer slide in rather than fade in and change the expression/pose of the announcer each time she says something new to give more of a sense of live action.
2. Similarly, have the announcer slide in and out between turns, maybe just waste high and tilted like she's leaning in and out of view.
3. With the dice, while there is the sound of rolling, flash a quarter second images of the dice 4 or 5 times, maybe starting off larger and then getting smaller also to give a sense of dropping/depth.
You probably thought of all this but just in case that's how I'd go about adding some finising touches. These are suggestions that first came to me with this incredible game: https://community.articulate.com/download/penalty-shootout-game by Ridgam Saglam.
Thanks again!
Gardner
Cool suggestions, Gardner -- thanks for sharing your thoughts! :)
This post was removed by a moderator
Thanks for your comments Gardner.
The whole project started off as a bit of a test for me on how far I can go within Storyline and was meant to be nothing more than a prototype and something for me to work on during a slow week at work .Im no designer, and this could look so much more slicker if I spend a little more time on it but my main aim for this was to get the functionality working.. Im hopeful that when the time allows it can be polished up and become more visually attractive. Your comments about character expressions/animations are something I would certainly look to utilise in a 'proper' version of the game.
With regards to point 3 I did use an animated gif of a rolling dice that would appear when the dice button was clicked/tapped. This worked great in everything but mobile safari on ipad and the animated gif just had a mind of its own so for this version I ditched it and just used sound effects instead.
Thanks once again for taking the time to comment, it is appreciated ;o)
Hi Darren, thanks for sharing this really fun game!
just wanted to two points-
1. What if player will b one and other will be automatically play.
2. how we can track this game in LMS system to get awarded for winning the game?
Hi Vishal,
It is really quite easy to make it a 1 player game and play against the 'computer'.
What I would do is add a '1 player' button at the start of the game, and on the scene for the second player and instead of having the dice throw action triggered by a user clicking a button I would have it triggered automatically when the timeline reaches a cue point instead.
All other triggers and events can run as normal.
I haven't really thought about adding LMS tracking to it to be honest but I guess that the slide the player gets to when they win the game could be a results slide and that reports back to the LMS from there.
Really fun game
Thanks for sharing
its it for download
Hi Mohammed! Not sure if Darren has this available as a download, but he did share a pdf above explaining how to build. Hopefully that will assist you.
Hi Darren! This is amazing! Good job on it! I have been trying to use snake and ladder with quizzes for e-learning purposes. Would it be possible for you to share the step by step instructions on how to incorporate the dice element in the game (random number generation).
It would be great if you could help!
Hi Shruti and welcome to E-Learning Heroes!
I'm not sure if Darren is still subscribed here, but you are welcome to reach out to the user directly via the 'Contact Me' option on the user profile if needed.
You may also find some helpful links here as someone has asked a very similar question before about setting up a dice element.
Hi Shruti,
Im still here !!!
It is simply a couple of lines of JavaScript to generate a random number between 1-6 and a change state of image trigger to show the correct dice face
I have attached the PDF document I created that goes into more detail about creating the game. Hopefully this will cover what you need to know. If you have any more questions feel free to post and I will try and help out where Ican
Good luck with your development
Edit:
The JS for the random number generation is
var number=Math.floor(Math.random()*7);
GetPlayer().SetVar("varp2dice",number);
If a 0 is generated I used a trigger to add 1 to the value, so there is statistically a slightly higher chance of throwing a 1 than there is numbers 2-6
Thanks for popping back in Darren :)
Has anyone used question banks with a game like this? I'd like to use the multiplayer aspects of this game but add a question bank that each player would answer 1 question from after each roll. I have multiple question banks based on what subject the player chooses at the beginning of the game.
This discussion is closed. You can start a new discussion or contact Articulate Support.