Games

Make it a Game: Climb Heroes Mountain!

December 31, 2014 By Jackie Van Nice 17 Comments

Select Image to Launch Demo

When people are new to the Articulate E-Learning Heroes community I like to point out a few things on the site to help them get going. Even if you know something exists – the weekly challenges, for example – you might not know how to find it.

Make a Game of It!

I thought it’d be fun to create a game that gets newbies to explore the site and points out some of the best tools around to help them succeed in their jobs. I’m entering it into David Anderson’s gaming challenge where I already have one cold, foamy, refreshing entry – but can you ever have enough games?

Some Nifty Features

Here are some elements I used that you could include in any game or interaction to make it more fun, effective, and appealing.

Images That Looks Just Like the Site’s

A fully-realized and consistent theme: Since the topic is the ELH site, I tapped into its visual style and themes to create my own. I used the mountain on the ELH Discussions page and the happy campers in front of it to establish my camping and mountain-climbing theme. I also created pictogram images that mimic the look and feel of the site’s own images.
A game goal: The goal is to climb Heroes Mountain by taking on a series of challenges. Each challenge involves navigating the ELH site to find something of value.
Real-World Challenges & Motivation

Real-world motivation: Aligning your learner’s motivation with the game’s goals makes it involving from the start. My game character is new to e-learning and needs help in her job, just like lots of newcomers. What better motivation to learn about the helpful features of ELH?
Real-world decision making: In the game, you search for things on the site just like you would in real life. The only difference is feedback. If you’re headed in the right direction, feedback is delayed until you arrive at your goal. If you’re headed in the wrong direction, you learn more about the site and get a prompt to remind you of your goal.

Game Progress: Badges!

Game Progress: Some Mountain Climbing

Giving rewards and showing progress: After you meet each challenge, you earn a themed badge and your virtual stand-in climbs a little higher up the mountain. Seeing a goal and your progress towards it is always good motivation to keep going.
A satisfying result: Not only is there a “win” at the top of Heroes Mountain, but the game’s character also wins since meeting the challenges on the ELH site helped her become more successful in her job.

Ready to Make Your Own?

If you’d like to make your own game (and find lots of inspiring examples!) check out these game-specific ELH challenges: Create a Simple E-Learning Game, Steal This E-Learning Template, and E-Learning Games for Kids. Plus you can find lots of free templates to get started on the ELH site!

Happy new year – and happy climbing! You can make your way up Heroes Mountain right here.

Learning to Spend Money the Yummy Way

November 17, 2014 By Jackie Van Nice 12 Comments

Select Image to Launch Demo

This week’s Articulate challenge is to create a learning game for kids. What’s not to like about this one?

Grandma’s Got Some Money

The Idea

The only problem was coming up with an idea. I messed around with math and word games, then starting building a camping game, but wasn’t happy with any of it.

I finally realized that unless the game emulated a situation where a kid really needed to apply some knowledge, I wasn’t going to like it and neither would the kid. This scenario reminds me of my wonderful brother Bryan who was always finding treasures and wondering if he had enough money to buy them, but it applies to any kid – large or small.

Flat, Mobile-Friendly, Kid-Friendly Design

The Interaction

The Intro: I wanted to ease you into the situation rather than unceremoniously drop you at a cupcake shop. Grandma supplies the money and the mission. The rest is up to you.

The Design: I kept the design pretty flat. I also wanted it to be playable on a tablet, so kept it simple and clean. Using a drag-and-drop, avoiding hover states, and keeping images large enough to easily tap and move with fingers were also part of my mobile-friendly plan.

The Challenge: I didn’t want there to be an on-screen calculator that showed how much money would be left after each cupcake was chosen. Those don’t exist in real cupcake shops, so why supply one here?

My Wish List: What I would love to do is supply feedback that goes over the math of what they just spent and ask them how much change they have left. I’d also love to make it so that if they chose to spend a smaller amount – buying just one cupcake, for example – they could save that money and take it with them to the next challenge. I’d want them to go to the movies, a fast food restaurant, an arcade, etc., and be met with different challenges in each location.

Too Much to Mention: There’s lots more that went into this one – from the variables and conditional triggers to the images, fonts, and pictograms – but if I go into all that we’d just be burning daylight, and you need to go buy some cupcakes! (But feel free to ask me questions.)

Go Buy Cupcakes!

Have fun spending Grandma’s money on a little cake and frosting right here.

Select Image to Launch Demo

Dating Zombies as a Survival Strategy

October 19, 2014 By Jackie Van Nice 8 Comments

Select Image to Launch Demo

This week’s creepy-yet-practical Articulate challenge is to put together something that will help us prepare for – and survive – the upcoming Zombie Apocalypse. My idea may not have the best success rate, but it’s all I’ve got.

The Idea

Zombie

Sticker

Inspiration

It started with some dollar store scratch-n-sniff zombie stickers. (I haven’t been curious enough to find out what zombies smell like yet.) But I started to notice categories (food, drink) and sketched out an interaction where a perky person was doing zombie market research. When outcomes for that seemed too limited, I came up with the dating idea.

Creepy Setting — Perky Person

I knew contrast would be key. Lovely, safe, familiar things needed to be set in high relief against their opposites; hence the choices for music, fonts, script, people, food, drink, and everything else.

Tough Choices

The Interaction

Theme

It’s all bad-horror-movie inspired, including the intro with that awesome True Crimes font. Add some of Storyline 2’s new animations and it’s a pretty good title screen.

Slider

This time I filled the thumb with an image of a zombie hand and used no visible track. You slide and release the hand to choose, which seems intuitive. The only downside of using the slide-and-release option was that when I published to HTML5 it treated triggers as though they were part of a while-slider-is-dragged version – so I republished without HTML5.

Options & Outcomes

There are 3 possible outcomes. One based on zombie choices, one based on my own personal choices (largely unlike zombie ones; though lines get blurred in a couple of categories), and one somewhere in between.

Click Image to Launch Demo

Try it Out!

Who’s your perfect match? Give it a try and find out… if you DARE.

Fontcracker Suite: Teaching Typography

September 22, 2014 By Jackie Van Nice 16 Comments

Select Image to Launch Demo

This week’s Articulate challenge is to teach some typography by creating a game or interaction. I dove in – excited that I could finally use Storyline’s new features out in the real world!

The Idea: Motion Paths & Dance

Motion paths are a huge plus in Storyline, so I wanted to feature them. Looking at proper typographic form got me thinking of proper human form, which got me to ballet, which led me to letters dancing to ballet music. Dancing letters using Storyline’s motion paths it would be!

Typography as the Star

The Typography

Many explanations of typographic anatomy use the word “Typography” as their example. I chose “very good form” so I could demo the concepts and stick with my theme.

Visual focus is on the typography throughout and it’s used on every screen. It engages the learner, introduces the concepts, acts as a progress meter, provides feedback, and wraps things up. I used one serif font (Book Antiqua) and one script font (Dancing Script). After settling on 12 typography terms to teach, I forged ahead.

Minimal Design

Minimal Visual Design

Rather than running wild with the theme by adding dancers, Christmas trees, snow, costumes, and scenes from the ballet I kept it simple – guided by the simplicity of the typography.

The main images are a ballet stage as the background and some ballet shoe ribbons. Rather than showing snow, I implied it on the opening screen by having each half of the word “good” fall gently into place.

Learner Control

The Interaction

Rather than announcing itself as an interaction where you’ll learn typographic terms, it starts with a fun bit of music and animation that sets the mood, theme, and topic before a small button appears that says “Teach me some terms”. Nothing is forced; you’re enticed to explore.

Feedback and Options

The learner also has enough options and information to feel they’re in control. If you choose “Challenge me!” for example, a message lays out clear expectations by letting you know what’s needed to succeed and gives you your options. Feedback is clear. If you make an incorrect choice you receive correction and can choose to review or continue.

Slider as Ballet Barre for Review

Best Slider Barre None

I used another of my favorite Storyline features – the slider – to create a ballet barre to review terms. (It features a lovely relative motion path, too!) It gives the learner full control and lets them focus on one item at a time.

Enjoy the Show!

If you have your audio ready, here’s the interaction in all of its very good form.

Select Image to Launch Demo

Can You Motivate This Monster?

June 29, 2014 By Jackie Van Nice 4 Comments

Click Image to Launch Demo

This week’s Articulate challenge is to create a quiz about an instructional design concept. I decided to create a quiz about Dr. John Keller’s ARCS motivational design model.

The Idea

As I brainstormed (heh-heh) how the heck to do it, I thought of the most basic concept of motivation, which is to spur the learner on: Provide him with a jolt of electricity, if you will.

The next thing I knew, Boris Karloff was staring at me as I carefully wired him up to car batteries. You just never know where a challenge will take you.

The Interaction

The idea is that you choose an appropriate design option for each of the four areas: Attention, Relevance, Confidence, and Satisfaction. I made them appropriate to this learner, pulling more from Mel Brooks’ Young Frankenstein than Mary Shelley’s classic novel, but it’s all about keeping me entertained.

Feedback Screen

You get feedback whether your answers are correct (motivated monster), or incorrect (unmotivated monster). I included some quick tips in the player with a mini outline of the ARCS model to help explain and/or lead you to the correct answers, too.

So Much More

I’d love to go over the many other scenes and ideas I had for this one, but at some point I have to call it a quick demo and stop.

I’ll also mention that my AA battery > car battery > single battery cable > neck bolt electrical circuit entertains me no end. I think that’s part of what makes these challenges so fun. You do a quick mock-up and it leads to the funniest improvisations.

Try It!

If you’d like to try using the ARCS model to motivate Frank, the interaction is right here.