Hi friends,
The fun doesn’t stop! We at Axure HQ love to have our fun, especially if it involves absurd amounts of randomness. So far you’ve been entertained by many fantastic games, from Kip’s Magic 8 Ball to Alex’s Deal or No Deal, Alyssa’s Rock, Paper, Scissors, Lizard, Spock, Jonathan’s Monty Hall Problem, and most recently, Anthony’s Axure Quest. Well today, I’m proud to bring you the newest installment of the Fun with Random game series: The Great Sloth Hunt of ’17!
In this game, you’ll need to flex your memory skills in order to catch these slippery sloths. On every level, a sequence of buttons will be displayed to you. After the sequence finishes playing, you’ll have to play the same sequence back. Your score and your score multiplier will grow as you continue to guess the correct sequence, the sequences will get longer as you advance in levels, and the frequency of sloth appearances will increase as you raise the difficulty. The display of the sequence buttons is based on the popular memory game “Simon” from the 80’s. If you’re not familiar with it, have no fear! Here’s a handy Wikipedia article that outlines the mechanics of the original Simon game:
Starting the Game
The game begins when you click the “Start” button after selecting the difficulty level on the “Choose your difficulty” screen. Each difficulty level, “Easy”, “Medium”, “Hard”, and “EXTREME”, is stored as an integer between 1 and 4 in the “Difficulty” variable, from 1 being Easy to 4 being EXTREME.
[ATTACH]12927[/ATTACH]
You’ll notice that the Start button’s OnClick interaction initializes several different widgets and global variables, the most notable of these being the “MaxSeqCount” variable, which determines the maximum length of the sequence to be generated. This is where the first bit of randomness begins. Instead of being set to a default value, MaxSeqCount is being set to a random value by this expression:
[[Math.floor(Math.random() * 2) + Difficulty + Level]]
This expression outlines the general pattern of how the random expressions will be set up throughout this game, using the .random() and .floor() Math methods (provided by JavaScript). First, Math.random() returns a random number between 0 (inclusive) and 1 (exclusive), which is then multiplied by 2. Then Math.floor() rounds the new value down to the largest previous integer, returning either 0 or 1. The “Difficulty” and “Level” variables are then added to determine the upper and lower limits of the range. For example, if Difficulty equals 2 and Level equals 3, this expression would return a maximum sequence count of either 5 (0 + 2 + 3) or 6 (1 + 2 + 3).
Determining the Next Sequence Item
Moving on, the last action of Start’s OnClick moves the “PickNextItem” hotspot, which triggers PickNextItem’s OnMove interaction. PickNextItem utilizes the bulk of this game’s random functionality to randomly determine what item will appear next in the sequence, storing that value in the “NextItem” variable. This value is then added to the “Sequence” repeater, which stores all the item values that have been added to the game’s sequence.
As for these item values, each one of the game’s nine possible button options corresponds with a number, 1 through 9. The four normal buttons correlate to numbers 1 through 4 and the five sloth buttons correlate to numbers 5 through 9, with the final two sloths, 8 and 9, being only available on “Extreme” difficulty.
[ATTACH]12928[/ATTACH]
To start the item selection process, an action first generates and stores a random number between 1 and 100 in the “RandomNumber” variable using this expression:
[[Math.floor(Math.random() * 100) + 1]]
The next set of cases (“If Extreme Difficulty”, “Choose Sloth Button”, and “Choose Normal Button”) will then determine the value of NextItem based on that randomly chosen number.
The “Choose Sloth Button” case checks if the value of RandomNumber falls within a specific range based on the difficulty setting (if RandomNumber is less than or equal to Difficulty * 15). If it does, an action sets the value of NextItem to the randomly generated number from this expression:
[[Math.floor(Math.random() * Difficulty) + 5]]
Because there’s a separate case for the Extreme difficulty, the value of Difficulty in this case will be either 1, 2, or 3, meaning that this expression will return 5, 6, or 7–all sloth buttons.
If the value of RandomNumber doesn’t fall within the previously mentioned range, the “Choose Normal Button” case will set the value of NextItem to:
[[Math.floor(Math.random() * 4) + 1]]
This expression will return something between 1 and 4, which will correspond to a regular, colorful button.
Finally, the randomly selected value of NextItem is added to the Sequence repeater.
*As I hinted, you’ll notice that there’s a separate “If Extreme Difficulty” case before the sloth and normal button cases. This case first checks if the current difficulty is set to “Extreme” (if Difficulty equals 4). If it is, the following two cases won’t be evaluated (which is why the previously mentioned value of Difficulty in the “Choose Sloth Button” could only be a maximum of 3). The sequence buttons will then only be chosen from the five available sloth buttons, since NextItem is being set to a random number between 5 and 9, generated by this expression:
[[Math.floor(Math.random() * 5) + 5]]
Sequence Display and Scoring
Although most of the random-powered elements of this game are covered above, the other expressions of the game are (thankfully) implemented in different ways. After all, who would want a randomized scoring function?
To display the sequence of buttons, the “Display” hotspot iterates through the items in the current sequence and displays each button individually. It does this by applying a filter to the Sequence repeater that specifies the current item in the sequence, which is being kept track of by the “DisplayIndex” variable. This triggers that specific item’s OnItemLoad action, which changes the state of the hidden “Display” dynamic panel to match itself. The dynamic panel is then shown, displaying the appropriate sequence button to the user for a short period of time before being hidden again. The sequence continues to display until all of the items currently in the Sequence repeater have been shown. The delay between buttons is determined by the selected difficulty.
For scoring, two strings are updated using the .concat() String method as the game progresses: one that stores the exact values of each item added to the sequence, and one that stores the values of each button that the player clicks. The “ScoreCalc” hotspot compares each individual value at every index (stored in the “ScoringIndex” variable) in the two strings using the .charAt() method, and then adjusts the player’s score and statistics accordingly. Although the player’s answers are being stored in the “UserAnswer” repeater, I found it easier and more efficient to implement the scoring function using strings specifically.
That about does it! If you’re curious to find out exactly how I implemented the other core aspects of the game, feel free to explore the attached .rp file. I’d also love to hear any feedback, questions, or even concerns you may have about the game (don’t worry: no sloths were harmed in the making of this prototype…yet). Thanks, and happy sloth hunting!
Cheers,
Simon
The Great Sloth Hunt.rp (4.49 MB)