Merry Christmas - Board Game Template

Dec 20, 2016

Hello everybody, I have only started learning about elearning and using Storyline2 since September and as a thank you to the community for the help I've found I wanted to share a template for a board game. 

For the past month we have been using our personal development time to create board game in Storyline2, in order to develop our skills. The primary contributors being myself (Daniel Lock), Simon Smith and Jay Sawyer at WDR ltd. (UK).

The aim of the game is to amass as many points as you can by answering questions correctly. Which will lead to the user completing 'areas' the last area can only be accessed once all four previous areas have been completed. The user can also lose 'lives' by answering incorrectly. At the end of the game the user can also print a pdf certificate of their result and see their position in the top ten leaderboard.

First the user can choose the colour of their player counter (achieved through a true/false variable linked to a state change). The User can roll a dice to generate the number they will move. We used some Javascript to generate the random number each time. We then needed to create two 'dummy layers' with a one second duration that each subtracted one from the random number variable whilst at the same time adding one to a dice total variable. The dummy layers will stop 'switching' once the random number has counted down to zero, whilst at the same time the counter will move along a motion path each time the dice total increases. This thus gave the effect that the counter was moving in steps (and moved after the dice had finished rolling) as oppose to moving in one sweep.

After the counter has moved a one second delay is put in using a 3rd dummy layer which will then send the user to a question slide depending on the position total (sum total of each random number).  The user is sent back to the main board once then have answered the question (triggers and variables are applied to the feedback layers to decided whether to award points, deduct lives and add the amount of total questions answered correctly for an area.

Once completing the fifth boss level the user can see a top ten leaderboard. This was created thanks toa tutorial from eLearning Brothers using some Javascript and Google spreadsheets. (link posted below) The user can also then see a pdf 'certificate' which shows their score and lives left. The medal colour will also change on the certificate depending on the points total that the user achieved. (I do not know the original source for the pdf technique as Simon showed me it.) I would like to improve the certificate but I have only just started working with html.

Hopefully that summarises the main tricky points, there were alot more variables used for some other functions. 

As I said, I'm still learning the ropes and would love any feedback on this. We are thinking of using this to create a course/game for an introduction to food hygiene next.

View the game here:

https://cloud.scorm.com/sc/InvitationConfirmEmail?publicInvitationId=f7833060-31d2-4564-af58-1a0f4e49e9a2

Storyline file is attached.

Cheers,

Dan

Attributions and links:

http://elearningbrothers.com/how-to-create-a-leaderboard-elearning-google/

<div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>
<div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>
<div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>
<div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>
<div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>
http://www.freebiesgallery.com/christmas-backgrounds/
http://www.businessballs.com/quizballs/quizballs48_free_trivia_quiz_questions_answers.htm
http://www.businessballs.com/quizballs/quizballs29_free_trivia_quiz_questions_answers.htm
<div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div>

5 Replies

This discussion is closed. You can start a new discussion or contact Articulate Support.