Mixing Up the Drag & Drop

It’s the holiday season which means lots of baking in my household. Pies, cakes, bars, cookies… you name it, we make it. With so many treats on my mind, I decided to build a delicious drag and drop demo.

2014-12-11_13-30-07

Baking Basics walks you through the process of making a cupcake batter. It showcases a lot of Storyline features including branching, animations, and a slider. But the icing on the cupcake is a custom built drag and drop interaction that gives feedback based on both where and when you drop an object.

Order in a drag and drop is important if you want the learner to demonstrate knowledge of a process such as baking or, on a more serious note, putting on a biohazard suit.

Mapping Your Route

To add an element of order to your drag and drop it’s helpful to first map out the sequence of events. This is part of my map for this project:

2014-12-11_13-28-57

Adding in Feedback

For each potential misstep, I added in a custom feedback layer. Constructive feedback was created for when an object is dropped on the wrong target or in the wrong order.

I also added subtle feedback for when steps are completed correctly to let the learner know they are on the right track.

2014-12-11_13-33-03   2014-12-11_13-32-40

Making Order Matter

Now all you have to do is add in some variables and triggers using your map as a guide.

  • First, I created a True/False variable for each variable listed in the map.
  • Then I created a trigger for each action to change the value of the corresponding variable when complete. This is also where I added in any corresponding conditions.
  • The final step was to trigger feedback layers if an action was completed in the wrong order.

And that’s it! To learn more about creating drag and drops in Storyline (& Storyline2), you can check out this tutorial or post your questions below. And you can click the image below to try your hand at making some vanilla cupcakes.

Happy baking!

2014-12-11_13-30-44
Advertisements

4 comments

  1. Oh Allison, this is fantastic! My kids like to bake, so I may have them take your course! Such a wonderful set of interactions and feedback. And of course, it’s gorgeous, too – thanks for sharing and inspiring!

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s