Error: OVERLOAD! – 5 ways you can design to optimise cognitive load

Let’s do a little experiment.

Imagine a regular quadrilateral, with four equal sides and four equal angles at 90 degrees each.

Now look at the picture below:

Think about the amount of time and energy your brain needed to understand the text was describing a square, versus, the amount of time your brain took to recognize the square in the picture.

What does this have to do with cognitive load?

Cognitive load is the total amount of mental effort being used in a person’s working memory. Put simply, it is the amount of mental effort exercised to complete a specific task.

Cognitive load theory can be classified into three types:


Intrinsic cognitive load is the difficulty associated with a specific instructional topic. It is the effort needed to absorb new information. Consequently, micro-copy, iconography and copy overall play a huge role in good learner experience.


Extraneous cognitive load relates to mental processing that takes up brain power but doesn’t actually help users understand the content in any way. This is the reason learning design should be very purposeful in its use of animation and visual elements. Overloading users with superfluous decorative visuals, distracting animations and excessive amounts of photographs or illustrations can negatively affect usability and memorability by causing cognitive overload.


Germane cognitive load is dedicated to processing information and construction of mental thought patterns or ‘schema’. The brain organises and classifies information through schemas, allowing you to understand how new information relates to other things you already know. Using recurring design elements and existing ‘standard’ icons, minimises cognitive load because we’re programmed to do so by default when processing familiar items or patterns. It’s easier for learners to recognise and learn something new if they can fit it into a pattern of something they already understand.

So, let’s eliminate all cognitive load and make life really easy for our learners! How can we do that?

There’s no way to eliminate cognitive load entirely but even if this were possible, it wouldn’t be desirable. After all, learners are on your course to learn, which involves cognitive effort. The aim should be to optimise cognitive load by minimising it where it interferes with learning and leverage it to help learners make sense of learning in relation to what they already know.

What are the 5 ways to design learning that optimises cognitive load?

Now that we’ve looked at various aspects of cognitive load and how they affect design decisions, let’s look at what you can do right away to optimise the amount of cognitive load the learner experiences.

  1. Overstimulation – Avoid visual clutter
  • Avoid irrelevant images, illustrations, clipart (and comic sans) like the plague!
  • Keep body typography simple
  • Hyperlink text rather than adding a full length URL
  • Animate responsibly


  1. Offload unnecessary tasks – Buh-bye! 
  • Anything non-essential needs to go, irrespective of whether it is textual or visual
  • Are there alternatives that will reduce unnecessary cognitive load on the learner? (Think of the square experiment above)
  • A picture or an intelligently designed infographic can really be worth a thousand words


  1. Use time-proof conventionsWhen someone says hamburger menu, more likely than not most people will think of the same thing. Likewise, if you click on a company’s logo on their navigation bar, you expect to be taken to their home page.There is an existing universal web language and set of norms which include iconography and micro-copy that can be leveraged to reduce cognitive load on learners and make the UI more intuitive and self-explanatory.


  1. Keep it short and simple 
  • Don’t overcomplicate copy unless the subject matter specifically demands it
  • Break text up into short logical snippets
  • If you can say it in less, then do.


  1. Ambiguous interfaceConfusing and ambiguous interfaces force learners to find solutions to problems that shouldn’t be there in the first place. Ambiguous interfaces are a big and unnecessary culprit to cognitive overload. Keep navigation and basic interface intuitive. This does not mean they cannot be aesthetically pleasing but it does mean that designers need to leverage their understanding of the existing ‘web language’ learners can be expected to understand and use these when designing UI.A learner faced with too many options, confusing interface or navigation, is likely to be put off from the learning experience. Even momentary pauses are enough to make learners close their browser window and go back to their “real jobs”.

    The best learner experience in terms of user interface is one they don’t notice because it is so seamless, simple and intuitive. As a result, it requires minimal cognitive processing. To do this, hundreds of crucial design decisions must be made to guide, entertain and avoid trouble for your learners!