A Game of Cards / Adding to the Fun with Random!

Happy Friday my fellow Axurians!

Some of you may have seen the cool examples created by Kip (Magic 8-Ball / Fun with a Random (Random-like) Function), Rachel (Slot Machine / More Fun with “Random”), and Alex (Deal or No Deal / Even More Fun with Random(-ish)!) of how to simulate a random function in Axure RP. If not, I definitely recommend checking them out!

I decided to make a card game of my own to show more ways to have fun with “Random”, but for my project I wanted to try out some of the new functions available in 7.0, including Math.random() and Math.floor().

The goal of this game is to earn more points than the dealer, with the first one to 25 points winning the round. You get one point if the two cards in your hand are either the same suit or the same number, and whoever has the highest total card value for the turn will also get one point. I invite you to get click-happy here and see if you can beat the dealer!

See it live!

Each of the four cards dealt works in the same way—random numbers are generated with the Math functions, and these numbers correspond to a certain card. Now, instead of putting 52 possibilities for each card to represent a full deck of cards, I decided to use a different approach for simplicity’s sake. Instead, each card is determined by two variables.

The first variable uses the numbers 1-4 to determine the card’s suit (which is controlled by Dynamic Panels). The next variable is for the card value (controlled with a set text action), and it uses the numbers 1-13 to assign values from Ace-King, with Aces being low.

Math functions:
Here’s how the Math functions were structured:

Card Suit

[[Math.floor((Math.random() * 4) + 1)]]

Card Value

[[Math.floor((Math.random() * 13) + 1)]]

I used these these functions in conjunction with the set variable action to tell Axure RP to randomly set each of the the card suit variables to a number from 1-4 and the card value variables equal to a number from 1-13.

The Result:
With the variables determined, I used conditions with the set text and set panel state actions to set each card to its appropriate suit and value, and voila!

Behind the scenes in Axure:

For the scoring to work, I relied on some of the variables from before. For example, I checked to see if the dealer had matching suits by using a condition that would award a point if the values of Card1Suit and Card2Suit were equal to each other. I also used variables called DealerScore and PlayerScore to keep track of the running total of points for each player, and I would increase the variables by one whenever a player scored a point.

Enjoy! I’d love to hear any feedback, suggestions, or questions you may have, so don’t be shy.

FunWithRandom.rp (134 KB)