The interaction design in your learning will make or break your learner’s user experience. Content is key, but the way that the learner is made to interact with that content in order to assimilate it and put themselves in the position of “learning by doing” is even more important.
However, you can’t just chuck any flashy interaction at the content and hope it sticks. There’s a careful craft to ensuring each interaction is the perfect fit for the content it deals with, and different learning points will potentially require different approaches. The narrative will relate the learner to the situation, but it’s the interaction that embeds the learning into becoming a natural behavioural pattern – if done well.
Sprinkling into the mix some surprise and delight keeps up engagement and motivation as well as making the learning memorable.
As a learning designer, I live by the following code.
Keep it simple
Try to make interaction design so simple and intuitive that even someone who missed reading the instructional text can still navigate the content effectively. This can be as simple as suggesting a call to action (CTA) button is active based on its colour. It’s these little touches that imperceptibly add smoothness to the experience.
Think wider than the standard, boring Next or Back buttons. Instead, make the experience much more fluid using specific, context-sensitive CTA buttons that don’t break the flow of the content, such as “Let’s meet John”.
Be succinct
If there is too much content on the same page it can end up looking like a wall. A wall that the learner won’t want to try and break down.
Breaking up lengthy content and combining this with animation can help get across a lot of information in a very digestible format.
Give a sense of progression
Show learners where they are in a course and how much more they need to do to complete their learning journey. Try including a properly planned progress bar using the client’s branding asset to subtly increase motivation to complete the course. Behavioural science has shown that, as humans, we don’t like things left incomplete.
Provide proper instructions
We’ve mentioned how interactions should be intuitive enough to follow without words. But sometimes, no matter how much you try, you’re going to need to use some instructions. When you do, make sure they are clear, simple and uncomplicated.
Think about where you place instructions on the screen, too. They should lead the learner on to the next stage in their journey. Sometimes the interface can suggest directions without a single word. Placing a CTA in the bottom right 1/3 of a layout will suggest to the user that it will take them to the next page.
Think responsively
These days, learners access learning resources through a whole host of devices. We need to design interactions accordingly. Think about how exactly your learner is moving through the course. Are they pressing interactions with a mouse? Their finger? A stylus? A bionic arm?
Well-designed learning interactions need to deal with any potential situation responsively. Think about how the learner will be interfacing with each element of the course, and the human/machine connection.
Put the learner at ease
Make sure you let a user know what will happen before they perform an action. This refers to the intuitive design ideas mentioned earlier, whereby the nature and appearance of your interactions suggests what they do so strongly that users won’t feel unpleasantly surprised by the outcome.
Give feedback that feels good
We may not want to surprise learners in an unpleasant way, but little “golden moments” can be a real pleasure. A little mobile vibration, a satisfying slider or a witty animation can boost the learner’s neurotransmitters.
Clearly this needs to be used win moderation and restraint. A unicorn flying across the screen may be far-fetched from the material or just distracting in relation to the learning point being made.
Keep consistent
For example, if a blue button is a submit button on one screen then you shouldn’t use a blue button to indicate an inactive button on the next screen.
This also helps with building that sense of intuitiveness into the course.
Generate useful error messages
We get it. Sometimes the worst happens. If something breaks, or your interaction sends users the wrong way, give them a gentle error message that puts them back on track.
It doesn’t have to be too long, but make sure it’s descriptive enough. There’s nothing worse than a generic ‘Error’ message!
Eat the dog food
No, I don’t actually mean crack open the Pedigree. A common phrase in QA circles, ‘eating your own dog food’ means trying out the product that you create for yourself. You can never truly know what works or what doesn’t unless you try it out, after all!
So there we have it, 10 learning interaction design best practices that, if followed well, will make your learning a joy to interact with. And that joy is the key to real learning and lasting behavioural change.
