Skip to main content
Category

Gamification

Flu Facts Challenge

Play the Interactive eLearning Game!

Take the Flu Facts Challenge is a short informal learning game, created with PowerPoint and Articulate Storyline 360. Click on the image to view the game demo. This demo was submitted to Articulate’s Choose Your Own eLearning Challenge #378 (2022).

The game is meant to be played by members of the public at individual kiosks at a community health care fair. Both adults and children will have access to the game.

Gamification, or applying game design techniques to instructional design, is one way to engage and motivate people to interact with a learning module.

Images: Many of the character and background images in this module come from eLearning Art, a subscription service that provides graphics and templates for the eLearning community. This demo is featured on their eLearning and Training Examples blog.

To create the comic book effect with the images I used, I employed the use of a tool that turns regular images into cartoons: Colorcinch. This online photo editor & “cartoonizer” is inexpensive and easy to use.

Authoring Tools: PowerPoint, Storyline 360, Colorcinch, eLearning Art

The Project Overview and Background Information for Take the Flu Facts Challenge can be downloaded here.

Project Overview

Name That Font!

This demo is another response to Articulate E-Learning Heroes Challenge #345 – Using Font Games to Learn About Typography.

Click the image below to view the interactive eLearning game demo: Name That Font!

Development Details

For development details, see my blog post for Cheese or Font? The development process for both demos is essentially the same.

Authoring Tools:

Powtoon animation, Articulate Storyline 360

Cheese or Font?

This demo is in response to Articulate E-Learning Heroes Challenge #345 – Using Font Games to Learn About Typography.

Inspiration

Articulate frequently revisits challenges after several years, and this challenge is no exception. I looked at the original challenge, and saw the title Cheese or Font, and thought it sounded like fun. Unfortunately, the link provided didn’t take me to a game, so I had to create my own!

Gamification

Sometimes you just have to memorize facts to get the job done (although probably not about cheese vs fonts). This short memory game demo shows an engaging, quick way to present this kind of task. Users can play the game several times, and teach themselves various ways to memorize the correct answers.

Click the image below to view the interactive eLearning game demo:  Cheese or Font?

Development Details

The animation application I used to create the intro to the game is Powtoon. I generally don’t start out knowing what I’m looking for when I create animated videos, I just look at numerous examples and templates on various sites until I develop some ideas of my own. Then I start out with a blank canvas and begin looking for the elements I want to use. In this case, I used a book prop from Powtoon combined with a mouse/cheese image from Pixabay.

Music is an important element, and I listen to music clips (sometimes furnished by Powtoon, sometimes by other applications/subscriptions) until I get the sound I want. Although the opening animation is only approximately 5 seconds long, I want the music to play for the entire Storyline interaction, so I include a couple of minutes to the video length of the Powtoon.

Camtasia Video Editing

After downloading the Powtoon video, I edit it using Camtasia. In this case, all I wanted to do was decrease the file size while retaining acceptable quality. I was able to reduce the file size of the video from 10,370 KB to 1,635 KB by removing the audio to a separate file, and adjusting the video quality settings before publishing.

Storyline Interaction

Since I want the music to play continuously throughout the interaction, the entire interaction needs to be contained on one Storyline slide, rather than using separate quiz slides for each question. This is done through the use of layers. The audio file is placed on the base layer, and plays continuously as the user interacts with each layer on the slide.

Video Tips

In Storyline, the video timeline and the slide timeline operate independently. By default, whenever the user clicks on a video (or touches it on a mobile screen), the video stops. However, the Storyline timeline marches on. This can wreak havoc with any timed interactions the developer plans to include on a video slide. In order to keep the video and slide timelines synchronized, I always include a “video shield” that I place on top of any videos I use on Storyline slides. The shield is simply a rectangular shape that covers the video entirely, set to 99% transparency. Now, the video timeline will be unaffected by a random touch. The user can stop or start the video only by using the play/pause controls that are used for the Storyline slide, thus making the video and the slide timelines function as one.

Using the Video Tools tab in the Storyline ribbon, I generally set the video compression to “none,” since I’ve already reduced the file size of the video in Camtasia.

Authoring Tools:

Powtoon animation, Pixabay, Camtasia, Articulate Storyline 360

Name that Bird!

Select the image below to roll the dice and play Name that Bird!

This game demo is in response to Articulate’s E-Learning Heroes Challenge #334: How are Designers Using Random Number Variables in E-Learning?

This game gives the illusion that clicking on the Roll Dice button rolls the dice to come up with a question in random order. However, you will never get the same question twice (unless you play the game more than once), so it’s not truly random. To check out how the variables are set up, check out the free download below!

Freebie Download 

I based my game on a free Storyline 360 template created by Paul Alders. It’s available for download here: Free Rolling Dice Interaction.

Cool Tool

To create the comic book effect with the images I used, I employed the use of a tool relatively new to me: Colorcinch. This online photo editor & cartoonizer is easy to use, and has a free option.

Authoring Tools

Storyline 360 and Colorcinch.

Word Search

Coronavirus Word Search Puzzle

Coronavirus Word Search Puzzle is my eLearning lightbox demo for Articulate E-Learning Heroes Challenge #316.

Click the image below to play the online eLearning game.

Lightbox Slide for Optional Information

Like many other eLearning developers, I frequently use lightboxes to allow learners to access optional information, as they see fit. In this case, the Instructions button leads to a short video describing how to play the game.

Game Mechanics & Free Download!

To create the game mechanics, I am indebted to Paul Alders, who shared a free word search interaction demo and Storyline download in the Articulate community website. Select the image below to view Paul’s demo, and download the file he shared.

Customizing the Interaction

The first step I took to customize the interaction above was to enlarge the puzzle–I’ve had poor eyesight all my life, and that’s generally the first step I take customizing any eLearning template! I also changed the color scheme/background and added a Powtoon character.

Next, I decided to use sentences as hints for the terms in the puzzle, rather than giving the learner the terms outright. Finally, I created the lightbox slide with a short video to explain how to play the game.

Authoring Tools: Storyline 360, Camtasia, Powtoon

2 Truths and a Lie

Classic Icebreaker Practice: 2 Truths & a Lie is my demo for Articulate E-Learning Heroes Challenge #313.

Click the image below to view the online demo.

Animation Tools: Powtoon, PowerPoint, & Camtasia

I created the animated cartoons with Powtoon, and edited the videos with Camtasia. To animate the cat’s face with different expressions, I used PowerPoint shapes.

Authoring Tools: Powtoon, Camtasia, Storyline 360, PowerPoint

Keep Your Teeth!

Did you know that more than 36 million Americans do not have any teeth? Many more have lost at least one tooth. The purpose of the eLearning game Can You Keep Your Teeth, is (not surprisingly) to keep your teeth.

You can keep them if you answer the dental hygiene questions correctly! Make a mistake, and lose a tooth. Click the image below to play the game.

Update

I originally created this game in 2016, using Storyline 2. This version, submitted to Articulate E-Learning Heroes Challenge #311 – Using Dials and Sliders to Select E-Learning Characters, has been completely updated in Storyline 360, with new graphics and a new video.

The animated video introduction was created with Powtoon, an online, easy-to-use video software application.

Authoring Tools: Powtoon animation, Camtasia, Articulate Storyline 360

Immunity Game

Articulate E-Learning Challenge: Use Animation in E-Learning #201

Click the image below to view  my short eLearning Game Demo for Mobile Devices: Can You Get Immunity?

I created this demo specifically to be viewed on phones, by altering the default slide size and orientation in Articulate Storyline 360. The game features videos created with Plotagon animation, edited with Camtasia.

Authoring tools for this presentation: Storyline 360, Plotagon, Camtasia

Rules of the Road

The Rules of the Road is my eLearning game/quiz demo for Articulate E-Learning Heroes Challenge #245: Designing Custom Quiz Results Slides in E-Learning (2019).

Click the image below to view the online demo and play the game!

Custom Quiz Results and Feedback Slides

The Rules of the Road game is really a Storyline eLearning quiz with gamified elements, including custom question feedback slides and customized quiz results slides.

Authoring Tools: Storyline 360 for the quiz slides, PowerPoint for altering images, Camtasia for video editing

Color Wars

Color Wars: The Rise of Classic Blue is my submission to Star Wars E-Learning Examples, Articulate’s E-Learning Challenge #262.

Click the image below to view the demo.

Authoring Tools

I created the introduction videos in this e-Learning demo using Plotagon animation. Camtasia was used to edit the videos in the demo, by adding speech bubbles and background music. PowerPoint was used to create the opening image, and text effects.

Gamification

Storyline 360 was used to create the the Color Wars game.

Holiday Office Party

The Holiday Office Party is another submission to Using Interactive Video Quizzes and Scenarios in E-Learning, Articulate’s E-Learning Challenge #258. Click the image below to view the comic book-themed gamified demo.

The boss is pretty strict! Can you meet her unwritten dress code standards and win prizes at the office holiday party?!

Authoring Tools: Camtasia, PowerPoint & Storyline 360.

Arctic Survival Game

The Arctic Survival Game is my demo for Articulate E-Learning Heroes Challenge #252: Using Checklist Interactions in E-Learning.

Click the image below to view the online game demo.

Animation

I used the Powtoon animation application to create the retro animated video, and PowerPoint to create and/or alter some of the 8-bit images. Camtasia was used to edit the video. Finally, Articulate Storyline 360 was used to create the game (quiz). 

Authoring Tools: Powtoon, Camtasia, PowerPoint

Play Connect 4!

Click the image below for the demo.

Let’s Play Connect 4! is my response to Articulate’s E-Learning Heroes Challenge #243: How Would You Build a Connect Four E-Learning Game?

I never played Connect Four–I’d never even heard of Connect Four, before being introduced to it through the Articulate E-Learning Heroes website. So, instead of trying to come up with a different version of the Storyline game available on the Articulate website (created by Russell Killips), I decided to add elements to it.

Animated Into, Instructions, and Sound Effects

I added an animated introduction, created with Plotagon animation, and edited with Camtasia video editing software. I also included a lightbox with instructions, accessible to users like myself who are new to the game. In addition, I included some sound effects on the Winner and Draw slides.

Free Connect 4 Storyline Download:

Connect Four Freebie By Russell Killips

Authoring Tools: Storyline 360, Plotagon, Camtasia

What do you Hear?

How many musical instruments can you identify accurately, by listening to the sounds they make? Play What do you Hear? to find out!

Click the image above to view the eLearning game demo.

This Storyline eLearning game demo is a response to Articulate’s E-Learning Heroes Challenge #231: Interactive Audio. The challenge is to share an eLearning example that demonstrates how eLearning can be used to help students learn about music.

Gamification

I created the What do you Hear? game using Articulate Storyline 360, and Plotagon Animation software. To increase learner engagement, the game is personalized throughout with the learner’s name, by employing a Storyline UserName variable.

Authoring Tools

Plotagon Animation, Camtasia 2018 for video editing, Storyline 360

Play Mongoose vs Cobra!

It’s Mongoose vs Cobra! Who will win? Marty and Mona Mongoose battle the snake charmer’s cobra to get to the finish line. Click on the image below to view the demo, roll the dice, and play the game!

This Storyline game demo is a response to Articulate’s E-Learning Games Challenge #225. The challenge is to create a variation on the classic board game, Snakes and Ladders.

I used Russell Killips‘ original Snakes and Ladders Storyline Game for inspiration. To learn more & download Russell Killips’ freebie Snakes and Ladders Storyline template on the Articulate E-Learning Heroes site, click on the image below.

Authoring Tools

PowerPoint 365, Storyline 360

St. Patrick’s Day Trivia Game

Play the St. Patrick’s Day Trivia Game!

This eLearning game demo is a response to Articulate E-Learning Challenge #224: How are Designers Using Progress Bars in E-Learning?

In this case, the progress bar shows a shamrock if the user answers correctly, a dark green oval if the answer is incorrect, and a light green oval if the question is unanswered. To view the demo, click the image below.


Features & Authoring Tools

Besides the progress bar, the Storyline 360 game features a custom animated character I created with Plotagon animation, and Plotagon’s text-to-speech audio. The game is personalized with the user’s name, using a Storyline userName text variable. I used Camtasia’s video-editing software to edit the Plotagon videos in the game.

Name that Color!

This eLearning game demo is a response to Articulate E-Learning Challenge #214: Using the 2019 Pantone Color of the Year. I designed the game with a vertical interface in Storyline 360, to be played either on your phone, or your computer.

Plotagon Animation

I used Plotagon’s animation application to create the animated segments, and edited them using Camtasia’s video-editing software.

To view the eLearning game demo, click the image below.

Authoring tools for this presentation: Storyline 360, Plotagon, Camtasia

Who Said That?

Who Said That?! is my submission to Articulate’s Using Badges, Awards, and Achievements in E-Learning Courses Challenge #197.

Gamification

This demo is a short American history e-learning game, where the learner must correctly identify the quotes of four famous figures in American history. Answering all four questions correctly will earn the learner the coveted Simply the Best badge!

Animation & Video Editing Tools

The animated videos in the demo were created with the Plotagon animation application, then edited with Camtasia video editing software. I imported the short videos into Articulate Storyline 360 to complete the quiz.

Updated 6/3/18.

Who has the Right of Way?!

Who has the Right of Way?! is my submission to Articulate’s E-Learning Heroes Challenge #195: How Can Learners Choose Their Own Avatars in E-Learning?

Gamification

In this learning game example, the user selects an avatar that is used throughout the game. The the game is also personalized with the user’s name.

Answering the questions correctly is the way to earn points and earn a Right of Way Expert badge.

Authoring Tools: GoAnimate (for the animated video background), and Storyline 360.

Updated 6/4/18.

ELH Challenge 174: Random Word Generator

This is my entry for Articulate’s E-Learning ELH Challenge # 174Using JavaScript to Create Random Word Generators in E-Learning.

Click the image below to give the Fairytale Generator a spin!

  

Instructions

To use the generator, simply click each button as many times as you need to choose your desired components: characters, locations, and actions. Clicking the buttons will generate random words or phrases for each category.

Then, click NEXT to view your customized fairytale. Want to make changes? Click PREV to go back to change the components, then advance the slide again to see how your fairytale has changed.

JavaScript

The generator uses JavaScript to generate the random words. Matthew Bibby has a great, easy-to-follow tutorial on Generating Random Words or Phrases in Storyline on the Articulate E-Learning Heroes community website, along with downloads you can use. I followed his method closely to create my demo!

Authoring Tools: Articulate Storyline 360