learnability matters

Ever wondered what role the interface of an eLearning application plays in the learning process? Have you ever come across an interface that takes a lifetime to understand how to navigate through the course? Can a poorly designed learner interface hinder learning? The answer is yes! Let’s find out how.

A poorly designed learner interface can:

• Challenge the learner to spend additional time learning about the interface before learning the concepts.
• Intimidate the learner with features that have poor affordance.
• Demotivate the learner and ensure that he/she gives up the course out of frustration.
• Leave the learner clueless about where he/she is in the course.
• Make information impossible to attain for the learner.
• Distract the learner from the actual goal of the course.
• Slow the learning process.
• Leave the learner guessing about the navigation.
• Provide two features that perform similar functions.

Remember, the focus should always be only on the learning activities and not on overcoming challenges posed by the interface. Therefore, an interface is not just a placeholder or a decorative piece. A learner interface plays a crucial role in the learning process.

Now to answer the second question—what are the attributes of a good/well-designed interface? Let’s jot these down too.

A well-designed interface should:

• Ensure easy and intuitive navigation through the course.
• Provide meaningful and useful features.
• Have self-explanatory icons.
• Make the learners comfortable.
• Make information easily accessible.
• Be simple and easy to learn.
• Enhance the learning experience.
• Compliment the theme and the instructional design strategies used in the course.
• Instill motivation in the learner.
• Be intuitive by providing strong cues for the learner.

Now that we have discussed the characteristics of a well-designed interface, let us look at a few examples. Look at the following interface and see whether you agree with my reflections. Some courses have an introduction that helps the learner become familiar with the interface. This again means that the learner spends time learning about the interface. But, at least they are not left fumbling while taking the course.

Example 1

1. On the interface, DMAIC, DEFINE, PREFERENCES and BOOKMARKS look all look alike –clickable buttons. Unfortunately, DMAIC and DEFINE are the headers for this slide. The interface has combined the interface elements with content headers.

2 & 3. The buttons in grey, Summaries, Glossary, and Data are disabled. The learner is confused as Summaries and Data buttons are vague and the learner is not sure what information they give. It is also not clear why they are disabled. Why is this information kept away from the learner?

4. Clicking on PREFERENCES, showed me the following screen:

Why is the audio on/off feature hidden in this section? Also, the tooltips are disabled and even if the learner wanted to understand the buttons on the screen, he/she can’t.

5. BOOKMARK was another feature that had me stumped.

So, you need to click BOOKMARKS first, and then click + to bookmark the page. Two clicks performing the same function…. Seriously!

Example 2

1. Help and Exit buttons are situated in unconventional positions. The disadvantage of this is that learners will probably not use it. The learner will always look to exit the course from the top-right hand corner.

2. The Back and Continue keys are located too close to each other. The learner may end up clicking on the other by mistake.

Example 3

1. Interest is not a button. It is the header of the screen.
2. Back and Forward buttons are positioned in an unconventional location. The learner will have trouble unlearning what they have previously learned.
3. The last sentence in the additional information box reads Click on the flashing Forward button to continue. If you still don’t get this, check out how they let you know…

You have three Red arrows telling you exactly what to do! Shocked?! Can’t we just ensure that we design separate screens for each image rather taking this painful method? Learners are not dumb!

Example 4

This interface is good as the icons and buttons are distinct elements and are self-explanatory. Buttons belonging to the same category (Back, Pause, Pause, Replay, Next) are placed together while audio is placed on the left-hand corner. Table of contents is in distinct panel that can be opened if you wish to see the modules.

Example 5

Here is another example of a good interface. Note that the interface is unconventional but very effective. It only provides as much information that the learner needs at that particular point of time.

Conclusion
An interface aids the learning process. We need to ensure that it is designed in way that the learner feels comfortable right from the word go. Few tips that you should remember while designing an interface are:

• Resist the itch to overdo. Remember to keep features and buttons as simple as possible.
• Be careful when trying the unconventional. If you want to be unconventional with the features and buttons, ensure that these are self-explanatory and logical.
• Usability is the key. Make the interface usable. The learner should be able to find information. If your interface is not usable, your course is not learnable.
• Keep it minimal. Design the interface Such that you place only features that your learner will actually use during the course. It is fine if your interface only the Next/Back buttons and Exit course option. You need not have a book marking feature if your course is just 20 mins duration.
• Use logic. Remember to use logic while designing the interface. Will the learner understand what this feature does? Will this feature be useful to the learner?

Share this