Memory Game - Storyline

Thanks guys! If you have questions or need any further information, please let me know!

Bastiaan, it is a really great job!

Inspired with your idea I tried to improve the usability. The main issue was that "wrong" pair is not hided automatically until user clicks on another card. I think it would be more convenient if wrong pair is hided after 1-2 seconds.

To achieve such behavior I added a new layer that is actually empty, but it contains some triggers. For this layer I set the timeline length to 1 sec (or any other value of timeout you want).

I use the following variables:

• common counter for opened cards (vCount)
• counter for each of the pair (other variables with prefix v..)
• boolean variable for each of the pair which indicate that pair is found (with prefix b..)

The logic is quite clear.

When user clicks on any card the corresponding counter of the pair increments. The common counter is also incremented.

When the counter of particular pair is equal to 2 (two cards of the same type are opened) then its boolean flag is set to True - the pair is found.

When the common counter is equal to 2 (two new cards are opened) a new "fake" layer is triggered. It is automatically hided after timeline ends. When this layer hides all the cards and pair counters are reset to 0 if their boolean flag is not True.

You can find the example by the link below:

https://www.dropbox.com/s/jiez28kzfjacsrk/Memory.story

Best regards,

Timur

Great Job Timur. This is a very nice aproach. Now we've got two great versions of the Memory game.

The logic of your version is clear. It never came up in my mind to hide these images automatically

Old threads never die Joshua.

Which is obviously a fantastic achievement

Hi Bastiaan,

This is exactly what I am looking for, thanks for sharing!

Is there any chance you'd be willing to create a tutorial video of the process you followed to create this?

I know the basics of Articulate Storyline but I am unfamiliar with the usage of variables and states and such.

Please please please would you make a tutorial for this game?

Thanks

JT

Hi Bastiaan,

This is exactly what I've been looking for, thank you for sharing!

Is there any chance that you would (please please please) create a tutorial video for the process followed to create this memory game?

Thank you!

Hi,

Thanks a lot for sharing the source file of the memory game.

I tried to re-create the file but somehow it is not working for me.

Can you please help me understand what I am doing wrong here.

Attaching the file for your reference.

Any help will really be appreciated.

Thanks much

Bastiaan, Thanks! It's super easy to modify. I'm going to change it up a bit and use it for one of my courses. Do have other learning activities already built that you care to share?

Sorry, I missed a couple of replies. I will try to answer all questions.

Hi,

I don't have a video tutorial for this project. But if you have specific questions about the variables I'm using. Please let me know. The difficulty of this project is the re-usibility of triggers. I'm using a lot of triggers, because for each square you'll need the same triggers.

If you want to create your own game, then I think you can start with two pairs. That's the same method I used for this game. First I created two pairs with all the triggers. Then I added a new square and duplicated the triggers. You will have to use a storyboard if you want to create more squares. So you won't forget a trigger.

If you need some help with this game, please let me know!

Hi Meghna.

The first you can do to try to find the problem is by re-naming all the objects in the time-line. Now you are working with Rectangular 1, Rectangular 2, etc. This is difficult to read in the trigger pane.

One important thing is the layering of the triggers. You will need to use the following layering in your triggerlist for each shape (top to bottom):

- Change the state of the object (as example Role 01) to the "New state"
- Add 1 to the variable "Count"
- Change the state of the other squares (all three) to normal when variable "Count" is equal to "3.00" and the variable "Role" not equal to "1.00". This will be three seperate triggers.
- Set variable "Count" to "1.00" if variable "Count" is equal to "3.00"
- Set variable "Role" to "1.00" if shape "Role 02" has state "New State"

As you can see you will have 7 triggers for each rectangular shape.

In your example I see you use a new "State" for each shape. I think it's better to use the "Disabled" state. This state will disable the specific shape, so you can't click again on the same shape.

I hope the above will help you to create your own game. If not, don't hesitate to contact me.

Best regards!

I've got a question via email about multiple Memory games into one Storyline project. If you want to use multiple memory games into one project and you are using the same variable names for each Memory game, then you will have to reset the variables when the timeline start.

Otherwise the end-users will have problems when they try to make the second Memory game.

Thanks for your comment Libby. I really appreciate this!

Thanks for sharing! Awesome!

Amazing Bastiaan,

Even I am trying to clear the cards when they are matched. I will share it when i succeed.

Thanks for sharing, that's what I was wondering how to do next!

Been attempting to do a memory board using Multiple Quiz as basis, thinking that I could utilize that built in logic* for checking for correct matching answers.  I am a web developer new to Articulate and not finding the tools that I need. Trying to learn more about embedding javascript (Execute Javascript).

My Memory Game plan is:

:: You get X number of attempts to match cards (among say 8, for now).
    TECH NOTE: This feature is built into Multiple Quiz.

:: Once you successfully match 2 cards (by select and submit) they are removed from the board, revealing a portion of background image to get a clue to solve a mystery. You get only X of attempts.
   TECH NOTE: In crude design, a correct answer could simply advance to a next slide, which would be a duplicate of the previous but with those two cards (objects) removed from the slide canvas, as well as those two "answers" removed from the Round 2 quiz, and so on and so on.   

This seemed straight-forward enough, but I've hit an early snag. My States don't seem to be changing as desired. I created a solid opaque shape for Normal state, and a matchable image for the Selected state. But, it isn't switching out. (I also tried creating a matchable image as Down state; haven't yet tried it as Disabled, but I don't think that will work with Quiz since it is processing by select form.) The States do change -- such as I test with something simple like a border rather than solid, but the Normal state image stays above the Selected state image.  No configuration for States, sadly.  If you could set transitions, opacity, or layer position on those, it would be nice.

Anything I'm missing?

Without seeing the file it's hard to figure out what the issue may be. Did you check the order of your triggers? Here is an example of a matching game with 6 cards which are shuffled every time all 3 pairs are matched. I didn't use Javascript.

NIce story!!

Did you use a quiz for this? Did you do the image swaps using States?  The only triggers that I set, if any, where for the object State to change to "selected" when clicked. But, not working. That shouldn't be necessary anyway, b/c this is a default behavior for form select.

Anyone know how to see the Storyline "behind-the-scenes" code for a story, such as to determine IDs set on each object? If possible, would be easy to deploy javascript to manipulate those objects.

Maybe its just me, but are the links working right know?

Hi Vanessa,

I've just placed the files again on the server. It's an old file, so I hope it's still working in Storyline 360.

Best regards,

Bastiaan

Great! Thank you very much! :)

Thanks a bunch for this, Bastiaan!   Just as a reminder (because I've had it gumming me up for a bit now) don't forget to reset layers to initial state upon revisit otherwise the flip won't happen properly if you use the fake layer. :)