Learn. Show. Repeat.

Tag: Articulate

Showing My Work #11

Often when we talk about our work, we talk in terms of ‘what’ we did. The Showing My Work series of posts aim to also capture the ‘how’ something was done.

E-Learning Heroes Challenge #18 – Using Characters in E-Learning. The brief: This week your challenge is to show us how to use characters in e-learning. You can create static slides that show character-based ideas, or build something more dynamic to show the interaction between characters.

This challenge is all about using characters and my inspiration came from a similar interaction I’d seen a few years ago, although it was laid out differently and used video.

It’s essentially a question and answer style interaction where users can ‘ask’ a question and see the response from each person within a group. The whole interaction is built on one slide.

I started by inserting a square for my characters then duplicated it three times, so I had four squares. Then I used the ‘Align’ function to evenly space the squares across the slide. I use align a lot because it takes care of evenly arranging objects. You can align object to the slide or select several objects together and it will space them evenly between the first and last object:

I used the illustrated characters for this demo but you could the use photographic ones or add your own images. I put one in each square then used the ‘Group’ feature so that it became one image (and not a square and a character).

Then I added a title (Ask the Team), some instructions, three question boxes and a large rectangle where the responses would be displayed. As there’s a few objects on the slide, naming them in the timeline is helpful to avoid confusion and it’s a good habit to get into.

This interaction uses 12 layers (3 questions x 4 people) to show responses to the questions. I set the layout on the first layer, then duplicated it using the ‘Duplicate Selected Layer’ button in the Slide Layers panel:

Then I was able to change the character every fourth layer. Again, naming the layers is important so to not get the layers confused. I went with P1, A1 (Person 1, Answer 1); P1, A2; P1, A3; P2, A1 and so on.

Now that everything was laid out, I needed to make it work. Firstly, I used a cool Storyline 2 feature called ‘Button Sets’ which make objects work like a button and only allow one object at a time to be selected. To create a button set, select the objects, right-click your mouse and then click on Button Sets. I created two button sets – one called Questions and another called People.

Secondly, I needed some triggers to make the whole interaction work. I created a trigger to show a layer when the state of a question and a person is selected:

For the layer P1, A1 to display, both Question 1 and Person 1 need to be selected. I then copied and pasted this trigger 11 more times and adjusted it for the three questions for each person.

While this demo is a template and uses text-based responses, you could use audio or video responses.

Click on the image below to view the demo:

If you’d like to use the source file to customise and use in your projects, you can download it here.

Let me know what you think and you can see all of my ELH Challenge entries on My Portfolio page.

Like this:
Like Loading…

April 18, 2015
Showing My Work #10

Often when we talk about our work, we talk in terms of ‘what’ we did. The Showing My Work series of posts aim to also capture the ‘how’ something was done.

E-Learning Heroes Challenge #52 – Using Interactive Sliders in E-Learning. The brief: This week your challenge is to show creative ways to use sliders in online learning. You can focus your slider on functionality or visual design.

I enjoy watching cooking competition shows on TV like MasterChef and My Kitchen Rules. Often on these programs the contestants are given the same ‘core’ ingredient and they need to create a meal that hightlights this ingredient. In a way, this is similar to the weekly challenges in that you create a demo based on a core theme or Storyline feature.

On the shows there’s always at least one or two people who don’t achieve desired outcome or as they say on TV ‘fail to make the core ingredient shine’. In other words, the core ingredient doesn’t stand out and gets lost among all the other ingredients in the dish. On reflection, this happened to me with this challenge and I’ll show you what I mean.

In this challenge the ‘core ingredient’ were sliders (not the tasty little burgers) a new feature for adding interactivity in Storyline 2:

In an eLearning project, a slider allows learners to reveal information, pictures etc. as the thumb is dragged along the track. When a slider is inserted into a project, you can customise it for your needs via the ‘Slider Tools’ tab:

In the above example, the slider is divided into 10 ‘steps’ which are the number of movements the thumb makes along the track.

I was struggling for an idea for my demo but I happened to see a tweet where a guy called Nick Barclay had recreated movie posters using circles and colour. So I thought that I could do something where movies were represented with colour and as you drag the thumb the colour changed. Then you need to guess the name of the movie.

I came up with four movies and I used state changes to change the colour of a rectangle as you drag the thumb along the track. I added triggers for each step on the slider:

Then, because the demo was about movies I thought it needed to be themed and set in a cinema. So I found an image of a movie screen, resized the rectangle to fit the screen, made the track transparent and changed the thumb to a popcorn image:

Then, because there were four movies it needed a ‘home’ screen to start from. Plus this would allow people to choose the order in which they completed the demo. I added a screen with four movie poster frames and some instructions and each movie branches from the home screen. Here’s how it looks in Storyline:

Each time you go into a ‘theatre’ you come back to the home screen until all four are completed. After each cinema was visited, I used a change of state on each movie poster along with some true/false variables to darken the colour of the poster which indicates that it has been completed.

Then, because I wanted people to enter their guesses for each movie into the demo I needed something that allowed for this, so I used a text entry variable. These are cool because you can type information into one part of a module and it can be used in another part (and this can be done more than once if needed). I jazzed it up so that it fitted in with the overall theme:

Then, if people were typing in their guesses, they needed to see if they were correct so I needed another screen that showed their answer (using the text variable again) compared to the correct response. I came up with the idea that you were playing for ‘free movie tickets’ for each correct response and I found a ticket image and duplicated it four times:

Then, to tie it all together I added some intro and closing screens along with some music to help set the scene!

Can you see what happened?

I started out using sliders but kept adding a little bit more, then a bit more and by the time the demo was finished I had variables, changes of state, branching and some sliders in there too. At the time, I was satisfied with how it had turned out but I didn’t realise how diluted the sliders demo had become until a few days after I finished it and I went back and looked at some other entries. By adding more and more to the demo, I’d lost sight as to what it was supposed to be about in the first place. So while I didn’t really make the slider interaction shine, I did learn a valuable lesson and that is to stay focused on the reason why you’re creating something in the first place.

I still think it’s a good demo but unfortunately it doesn’t really meet the brief and showcase the use of sliders. To see for yourself, click on the below image to view the demo:

Let me know what you think. You can see all of my ELH Challenge entries on My Portfolio page.

Like this:
Like Loading…

March 26, 2015
Practice and Sharing: The Keys to Success
These were the two messages that stood out over three days in Sydney at last year’s iDesignX Australian Instructional Design Conference (21^st March) sponsored by B Online Learning & Articulate and the eLearning Design Workshops with Tom Kuhlmann and David Anderson (22^nd and 23^rd March). I was fortunate to attend all the sessions and for me it was a dream come true to not only be in the same room as Tom and David but to hear and learn directly from them (I also got to meet them which was an incredible experience and a real highlight too).

Practice

As someone with a keen interest in learning generally, but eLearning in particular, I’m always looking to other experienced people in the learning field to find out how I can improve my own skills and knowledge. While it would be great if there was a magic pill you could swallow and voila! you’d be transformed into an eLearning whizz, the reality is that when you look at anyone who is successful in their field, the one thing they have in common is a commitment to developing their skills over a period of time. Tom and David are no exception to this. Over the years they have worked on many projects but they also make time to experiment and try new things. The speakers at iDesignX also showed that they have put in a lot of effort over the years to get to where they are today.

Tip: a good place to start practicing your eLearning skills is in David’s Weekly Challenge. You can also learn more about building great eLearning courses at Tom’s Rapid eLearning blog.

Sharing

Tom and David are role models when it comes to sharing. Their jobs at Articulate along with their travel schedule must keep them extremely busy. However, they are extremely generous with their time and have a great willingness share what they know, provide advice and help anyone who needs it. It’s something all learning professionals can learn from and do more of.

So, in the interests of sharing, here’s firstly what I took away from iDesignX:

“Instructional design is about crafting the appropriate learning experience. We need to reframe content so that it’s meaningful and relevant. Then we need to give learners something to think about and have them make decisions.” Tom Kuhlmann – VP Community at Articulate

“Tips when using virtual training: prepare and support participants, consider cognitive load, design for different levels of engagement, have learners interact often, support facilitators, pilot the training and test, test, test, test.” Brenda Smith – Medibank Health

“When using video in learning experiences, authenticity is very important.” Mark Parry – Parryville Media

“Clean and balance (in graphic design) creates stability and can direct learner focus.” Minh Nguyen – DEEWR “Using curation for learning design > collect, filter, evaluate, arrange, present, distribute.” Anne Bartlett-Bragg – Ripple Effect Group

“Before you gamify your eLearning course, make sure it meets the learning objectives.” Ruth McElhone – B Online Learning

“Learning experiences should be meaningful, memorable and motivating.” Ruth McElhone – B Online Learning

“Using video for manual or process tasks shows the correct way to do something.” Tony Nye – Australian Red Cross Blood Service

“Pictures clarify words and stories add context to content.” Blair Rorani – Ever Learning

“What makes an industry pro? Experience; Skills (practice your craft); Authority and Luck.” Tom Kuhlmann – VP Community at Articulate

“Luck is where opportunity and preparation meet.” Tom Kuhlmann – VP Community at Articulate

“You need to be proactive and look for opportunities. Sharing expertise creates opportunities.” Tom Kuhlmann – VP Community at Articulate

And from the workshops with Tom and David:

On designing an eLearning course:

Ask yourself:
1. What content needs to be in the course?
2. What is the right look and feel?
3. What is the learner supposed to do?
Be intentional, stick with a consistent design and don’t settle for defaults (colours, fonts etc.)

On eLearning makeovers:

Review the five common components of eLearning courses:
1. Text – should be from the same font family
2. Elements – the goal is unity not uniformity
3. Colours – use colour for contrast and emphasis
4. Background – it should contribute to the visual and not dominate
5. People – if you use characters maintain unity
On interactivity:

Interactivity connects the user to content. There are two types of interactivity:
- Touch – the learner interacts with the screen (by clicking, dragging or hovering)
- Decision – the learner interacts with the content.
On Learning Objectives:

When thinking about learning objectives, ask yourself:
- Who is the learner?
- What is the situation?
- What do you want them to do?
- How can they prove it?
On building interactive eLearning:
- Know your tools – don’t build clunky courses
- Create relevant content
- Use stories for learning especially if there’s a lot of content
- Remember the 3 C’s:
1. Challenge the learner
2. Give them choices
3. Have consequences for decisions
There were at least a couple of hundred people at the conference and about 80 people each day at the workshops. If everyone incorporates just one or two of the things they learned into their eLearning courses the quality would certainly improve. But if everyone also shared what they’ve learned with others in the field, it would help to improve even more courses and contribute to building a strong community of learning professionals!

All in all it was a great three days of learning from the best in the field and also chance to meet lots of people who I’d only known via Twitter and make the physical connection. Let’s follow Tom and David’s example by practicing our skills and sharing what we know so that we can develop ourselves as well as others.

Footnote: This post originally appeared on my old blog site “Learning Snippets” and the B Online Learning blog in 2014.

Like this:
Like Loading…
March 20, 2015
Showing My Work #9

Often when we talk about our work, we talk in terms of ‘what’ we did. The Showing My Work series of posts aim to also capture the ‘how’ something was done.

E-Learning Heroes Challenge #71 – Teaching Math Concepts with E-Learning. The brief: This week your challenge is to design a short lesson to teach one or more math concepts. The inspiration for my demo came from one of the source material examples that David provided, where teachers are using LEGO bricks to teach kids fractions. I also went to their website to check it out further.

$Teaching fractions with Lego$

My idea was to re-create this method for learning about fractions in an eLearning piece for this challenge. After playing around with some ideas on paper, I came up with a three screen demo: Introduction > Visual Explanation > Try it Out.

Here’s a behind-the-scenes look at how I did each screen.

Screen One: Introduction

I like to have a brief intro to my demos and most of my challenge entries have one. Originally, I had a LEGO character and some LEGO pieces (I created the pieces using shapes – circles and rectangles – along with some shadow) flying onto the screen but it wasn’t quite what I wanted as I felt it was a bit dull. As I’m using LEGO as the teaching method for this demo, the LEGO Movie was in the back of my mind and I thought it would be cool to make the pieces come alive and enter onto the screen. I created a basic ‘animation’ using multiple copies of the images and the timeline. Here’s what the Slide View for this screen looks like:

Each image has been duplicated five times and I used the timeline to display an each image from each group one after the other (less than 1 second for each image). Here’s a section of the timeline that shows what I mean:

So when you look at the intro screen, it looks like the same image is moving from off-screen onto the screen. I deliberately wanted the objects to change position as they move in and I think the effect looks pretty good.

Screen Two: Visual Explanation

Next, I wanted to explain the concept of fractions and to do this I used an 8-stud LEGO brick because it can be divided into 1/2, 1/4 and 1/8 pieces. On this screen I showed the whole followed by the fractions and then how the fractions add up to the whole. For this, I used the timeline to introduce the pieces individually and show their relationships with one another. Here’s part of the timeline:

Screen Three: Try it Out

This is where the learner gets to have a go. I used the 8-stud brick and the learner needs to select from a group of bricks the one that would cover half of it. A layer shows depending on the brick they select and gives feedback on their choice. Learners can also have another go if they select incorrectly or repeat if they want to try it again. My original idea was to have lots of bricks and have different combinations that would cover half e.g. 1 + 3 and 2 + 1 + 1 etc. but I found it became too complex with all the different combos and keeping track of the selections. I tried using number variables but it didn’t work like I wanted to so I abandoned the idea.

If this was a longer course, I would have included more ‘trying out’ as well as other fractions – 1/3 and 1/5 as well as more try it out screens.

I was also reminded of the importance of clearly labelling all objects in Storyline projects especially when you have a lot of them, it makes it easier to keep track of everything!

Anyway, here’s my demo, you can click on the image to view it:

$Math Concepts$

Let me know what you think and you can see all of my ELH Challenge entries on My Portfolio page.

Like this:
Like Loading…

March 6, 2015
3 Things I’ve Just Discovered in Storyline 2

Storyline 2 has heaps of great functions to help create fantastic eLearning, so many in fact, it’s hard to know them all. But in the past couple of weeks I’ve come across three hidden ones (well, hidden to me) that I wish I had known earlier. I wanted to share them here because if they’re new to me, chances are they’ll be new to someone else too.

#3 – Moving Objects with Arrow Keys

Ok, I’ve known for a while that you can move objects (shapes, text boxes, images) using the arrow keys but sometimes I found that they didn’t move far enough and then the next move was too far! That’s because when you move something with an arrow key, it moves by 8 pixels at a time.

But if you hold down the CTRL key and press the arrow key, it just nudges the object by just 1 pixel! This is really good for making those fine on-screen adjustments.

Note: You can also do this in PowerPoint.

#2 – Size and Position

This comes in handy when you want to have different objects in the same place on-screen across different slides. To find the position of an object:

Select the object and right-click:

Select Size and Position

Then click on Position:

You’ll see the horizontal and vertical position of the object on the slide. In this case it’s from the top left corner but you can change it and go from the centre. Now you can line up your objects on different slides by using the same position for each!

Note: You can do this in PowerPoint too.

#1 Hiding Base Layer Objects via the Timeline

When working with layers, have you ever wanted to hide some of the objects on the base layer? I sure have! SL2 does give you the option to hide all objects on the base layer and when I’ve wanted to only hide some of them I thought you had to a shape to cover them up. But it can be done using the timeline.

Click on the layer.

Look at the Timeline and you’ll see a tiny little arrow near Base Layer Objects:

Click on the arrow and it will now point down and all the objects on the base layer will be shown:

Next to each object is an ‘eye’ symbol.

Click on the eye of the objects that you want hidden (it will turn grey and the objects will hide on screen).

Here’s a before:

And After:

Each time you are on that layer the objects you’ve selected will be hidden. You could have different settings for different layers if you wanted too.

Well that’s it, three little functions I’m glad I now know about. Hopefully they’ll come in handy for you too!

Special thanks to Beck and Ruth for telling me about these three gems.

Like this:
Like Loading…

February 23, 2015