6 Design Principles for Effective eLearning

6 Design Principles for Effective eLearning

Gone are the days when learning was confined to classrooms filled with rows of clunky desktop computers. Smartphones, tablets and modern technology in general have made learning accessible to practically anyone from any location. With this in mind, UX designers need to consider certain design elements that will ensure effective learning regardless of device, screen size or location.

According to Adult Learning Theory, one of the main factors that impacts effective learning is that adults struggle to retain information when they’re overwhelmed by too much text, too many visuals, or both. 

We looked into how this need for simplicity impacts the 6 eLearning design principles and how you can apply these to design effectively for eLearning. The principles take into account wider adult learning theories as well as general best practices for eLearning design.

1. Multimedia Principle

For learning, using a combination of media types is more effective than using text alone. Designers should use graphics that are directly relevant to the content because research shows that using irrelevant graphics actually impairs learning. A combination of text and audio or text and visual content works well; however, the most effective pairing is visual and audio together. Bear in mind though that people can generally only pay attention to one visual and one audio element at a given time, so keep it simple. 

DuoLingo: This is a good example of an interface applying the multimedia design principle effectively by using a combination of one audio and one visual element per frame. The audio graphic in the third frame is directly relevant to the task requiring users to listen to a spoken sentence. This allows users to focus on one task at a time and reinforces their learning.

2. Contiguity Principle

Because eLearning often takes place within a scrollable interface, the tighter the text-graphic alignment, the easier it is for users’ to understand the relationship between each element. The psychology behind this principle is that the less space there is between an image and its description, the less work there is for the learner’s brain.

DuoLingo: The tight alignment between the image and the text in the third frame applies the contiguity principle well as the connection between the image and the text is easily understood. Instead of cluttering the scrollable screen with a tonne of information, this interface is designed so that learners can simply press a button to move on to the next exercise.

3. Modality Principle

The way you present information should be dependant on how complex the information is. For example, if you’re trying to explain a complicated process, it may be more effectively conveyed in a visual format so you can avoid potential ‘information overload’.

 5-Minute Clinical Consult: This is a good example of an interface applying the modality principle; a complex concept (irregular heartbeat) is being explained using a graph for users looking to find medical diagnoses. A simple and clear flow chart makes it easier for non-medical professionals to understand an otherwise complicated medical diagnosis.  

4. Redundancy Principle

As with the Modality Principle, the way you present information also directly impacts learning. The elements you don’t include are just as important as the ones you do include. Over-explaining or including too many types of media may overwhelm the user, so get rid of whatever isn’t necessary. 

Skill Pill: Here’s a ‘Skill Pill’ for the army that teaches basic medical skills for soldiers to use in the field. The interface allows learners to effectively ‘learn by doing’ and apply concepts presented in previous sessions without real-life consequences. This design is an example of the redundancy principle combined with the modality principle as the action required is simple and straightforward and needs minimal text and more visuals.

5. Coherence Principle

As a designer, you should use the same formatting throughout your interface and to bear in mind that when learning is the objective, ‘less is more.’ Any unnecessary visuals or sounds added to a website are called ‘seductive details’ and must be avoided in eLearning. This content will most likely distract the user and take away from the rest of the educational content. A prime example of this is any interface that auto-plays content or ads.

Skill Pill: The ‘Discover’ page here is potentially distracting since there is a lot of video recommendations matching popular search themes. Skill Pill counters this cleverly by placing the search bar at the top of the page. Also, the color schemes of the videos and recommended content are consistent, which applies the coherence principle well and makes it less likely that users will be seduced by irrelevant content below.

6. Personalization Principle

People generally absorb information more effectively when they feel like there’s a ‘human’ element included and when content is personalized, conversational and informal. A good way to implement this principle would be to incorporate an optional ‘virtual teacher’ to guide and support learners. Designers should consider the potential distractions that pop up content might create though – we all clicked Clippy away aggressively at some point, right?

Conclusion

Generally, adults learn best in an environment when they are given only the essential pieces information needed to understand a concept; simplicity and clarity are key. The most important principles to remember when designing for effective effective eLearning are:

  1. Only use visuals when they add to the lesson being taught
  2. People can only pay attention to one visual and one audio element at a time
  3. Don’t overuse media, this will distract and overwhelm your users
  4. Add a ‘human’ element in your design and consider a ‘virtual instructor’ that addresses users in first or second person.

What do you think is the most important element for effective eLearning? Let us know in the comments or tweet us @usabilla

To view or add a comment, sign in

More articles by Netania Engelbrecht

Others also viewed

Explore content categories