The Project
This client hired me to build an online version of her dog bite prevention card game. This sorting game, designed for kids, consists of 10 rounds where the player must draw a card, study the image and text on the card, then drag and drop it into one of three categories; Stop, Caution, or Go. Once all cards are played, the player can check their answers and move on to the next category.
The Challenge
The first challenge was to program the game so that the player can select a card from a stack of 9 cards without the cards repeating. I used custom JavaScript to build a random number generator that picks a number from an array, making sure the number is only picked once. I used triggers to change the states of the card images based on the random number generated. This mimics a player drawing from a deck of cards.
The second challenge was to make sure the player could rearrange the cards after they were dropped. Storyline’s standard drag-and-drop interaction caused a number of issues such as adding too many points to the final score. To make it work, I created multiple triggers and a variable for each drop zone so Storyline could analyze which card lands on which drop zone. No matter how many times a player moves the cards around, it will accurately assess the correct and incorrect answers and award points accordingly.
While playing each category, the player can check the correct answers, or check their progressive score as they play the game.
The Result
The result is a fun drag-and-drop game that kids can enjoy and play over and over again on any computer, phone, or tablet.
Click HERE to play a sample category from the game.