Gamify Your E-Learning with Scratch-Off Cards #125

Scratch Cards for E-Learning #125: Challenge | Recap

How Can Scratch Cards Help Gamify Your E-Learning Courses?

Looking for creative ways to engage learners using gamification techniques?

Scratch cards just might uncover the inspiration you need to grab learners’ attention and pull them into the course.

Gaming elements like discovery, anticipation, and rewards are inherent to scratch cards, making them ideal for e-learning. Let’s look at a couple of examples:

Scratch and Win Game

Here’s an example that combines a drag-over, custom states, and variables to count the number of times the coin is dragged over the scratch area.

Scratch and Win Game

Click to view the interactionDownload

Each time the learner drags the coin across a scratch area, the object displays a more transparent version until it eventually reveals the hidden icon.

Lottery Scratch Card Game

In this example, Darren worked in some JavaScript magic to randomize the hidden icons. You can learn more about how he put this example together in this forum thread.

Lottery Scratch Card Game

View the interaction | Learn more | Darren Heath

Text Eraser

This example uses the same drag-over effect to reveal a hidden text object. It’s a simple demo, but it’s a good one to learn the basics of the scratch-off effect.

Text Eraser

View the interaction | Download | Gerry Wasiluk

Challenge of the Week

This week, your challenge is to design a scratch-off game. You can rework one of the files above, or create your game card from, well, scratch.

There are two components to this week’s challenge: technical and visual. The technical component requires a good understanding of advanced triggers and variables. The visual component is all about coming up with a fun design for your scratch-off card.

Bonus points for anyone who shares their source files this week. Scratch-off games are a lot of fun and I know your fellow community members would really appreciate seeing how you built your projects.

Ideas for Scratch Card Interactions

  • Multiple choice questions. Cover the correct and incorrect feedback icons.
  • Randomize the choices. How can you randomize the objects below the scratch area so learners see different choices each time they play?
  • Results slides. Create anticipation by hiding the results of a quiz or course to let the learner scratch off the cover to view their results.
  • QR Codes. How could hidden QR codes be used in scratch card e-learning games?

Last Week’s Challenge:

Before you scratch this week’s challenge itch, take a break and check out the skeuomorphic examples your fellow community members shared in last week’s challenge:

Skeuomorphism in E-Learning

Skeuomorphism in E-Learning: Challenge | Recap


Wishing you a scratch-tastic week, E-Learning Heroes!

New to the E-Learning Challenges?

The weekly challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos.

Bill Kelleher
Brenda Tyedmers
Meaghan Lister
Brenda Tyedmers
Brenda Tyedmers
David Anderson
Katie Bright