Flashcard interactions are a simple click-and-reveal activity that lets learners explore virtually any type of content in a freeform way by clicking interactive cards on the slide.
Published 6 years ago
Version 1.0
Blog Post
- Hope you all enjoy this one. If you have any questions about using the template, let me know in the comments.
- Hi David! Love this one. However, I'm having a rather difficult time figuring out what to do. I want the users to only be able to click on the next button after they've flipped over all the 6 flashcards. Can you help me?
- You'd be better off setting the text onto their own layers, rather than having them as part of the states. The buttons themselves would only have the icon, and then a state that says visited. You can animate in the layers to create the effect of the fade, if you wanted to replicate the fade out, you could delay the hide other layers function and each layer would have button duplicates that fade in, then hide other layers, and then those objects would hide before the timeline end.
Then you could set a visited state for the buttons that is identical to the normal state, and then a separate trigger that is looking for all the states of the buttons to be visited, then enable the next button.
if they can revisit the page, make sure it's set to resume saved state.
I would recommend not putting content text in button states that aren't visible from the stage, especially if you share files. It's easier to change and bugfix when they aren't integrated.
- Hi David,
Thanks for sharing !
I had a question, when you click on one card, the state doesn't change directly, how do you make it slowly fading please ? I tried with animations, but it only affects the shape when it appears, not when the state is changing.
Thanks again for all your great templates !- Hi Mathilde - Here's a video overview that shows you the general idea for creating animated button states: https://youtu.be/8n3pjGPc6cg While it's not an official feature of Storyline, it's something that's been around since SL1.
- Hi David,
I didn't know this feature as I recently started on Storyline.
Thank you again for all your templates, tips and help !
- Thank you for sharing!
- Hi David,
Thank you for sharing the project.
I have a question.
When I click on the second card or any card the state of previously selected card sets to normal automatically, but when I tried the same thing on my system, it is not working for me. Could you please suggest what am I missing here?
I performed all the operations: Created another state (Selected) for the objects.- Great question, Vishal.
To create the toggle effect, I used Storyline's button sets:
Select all your cards > right click on the outside selection > select Button Set > Button Set 1
Here's more info on button sets and how they work: https://community.articulate.com/series/74/articles/articulate-storyline-360-user-guide-how-to-work-with-button-sets- Thank you, David.
- hey how can i change the text with the template that i've downloaded ?
- Hi Dini - You can edit the card's text by selecting the card > go to the States panel > click Edit States > and now you can modify the text for each card.
Here's a quick video overview: https://360.articulate.com/review/content/512a316b-04ea-4b36-88c9-958adc80ae99/review
- Hi David, this is perfect! Thank you so much. And where did you get the great images on the flashcards?
- Thank you David! This is great.
- Thank you! This is great!
- I am having a lot of trouble making the flashcards with icons. It's easy with a simple number when I type that into the shape; the select state works great. however, when I try to use an image, the image will not group with the rectangle, and will not disappear when the selected state shows. I've tried many ideas, but cannot get this to work. Can you please help?
- Hi- Does anyone know how to group images so that they all "flip" when I click the card to change the state? Is there a special trick to getting the graphic to turn around at the same time as the rectangle to show the back of the card?
