8 design tips for mobile e-learning

Evie Schellens

Our smartphones have become an extension of ourselves. We use them for everything: communicating with friends and family, online shopping, ordering food, playing games, and so on. The use of smartphones in e-learning has become increasingly more popular in the last few years: from e-learning to m-learning. It is time to take the use of smartphones in the design of your learning environment into serious account. We give you 8 tips to help you along the way.

1. Delete unnecessary text from your e-learning

Even involved users only read about 30% of the words on a page, because they usually only scan the content. This is fairly easy on a bigger screen, but in order to read something quickly on a smartphone you need to scroll, which slows down the absorption of content. This can be frustrating for your users, which is why you should prioritise essential content and put ‘nice-to-know’ information in the ‘read more’ part of the page.

2. Keep the file size of your e-learning small

Especially when people use cellular networks to access the online academy it is important to keep the file size of your e-learning small, so the loading time is faster. Compress images and get rid of elements that are not necessarily needed to minimise loading times.

3. Prioritise navigation and legibility

When your users learn on-the-go, their environmental conditions usually are not as optimal as they are at home or the office. This is why you should make your mobile design as easy for them as possible. Black text on a white background makes reading way easier, so do not deviate from this in your design. The font size 16 or 18pt generally works for all devices.

4. Make sure navigating your online academy is easy

The navigation aspect should be super easy on a mobile device. Avoid big menus that make you scroll through a lot of items, and make sure that clickable items are big enough for a finger or a thumb. Try to decrease the amount of clicks necessary to complete an action. Keep the limitations of a smartphone in mind as well, not all actions that are simple on a desktop, are as simple on a smartphone. ‘Drag-and-drop’ movements are, for example, rather difficult to do on a small touchscreen.

5. Test your e-learning on multiple platforms and browsers

If your content is dependent on a browser instead of an app, there can be unexpected variations between the different browsers on similar devices. It is important to at least test the most common browsers, and keep in mind that there may even be variations between older and newer versions of the same browsers.

6. Adapt the content of your online academy

Bitesize content is optimal for learning on a mobile device. Research finds that the average study session on a smartphone is approximately 10 minutes. Users are inclined to follow a course that is divided into 20 ‘bites’ of a few minutes instead of one long lesson that takes 45 minutes. Divide your study material into small parts. You can read more about this in our blog about microlearning.

7.  Make sure you have an organised content index

Simplify the lay out of your content, so the most valuable information is the easiest to find. Use clear headlines, lists, images, and icons for an optimal overview. Less is more in a mobile environment. Make sure your content is easy to read and navigate.

8. Mobile first?

E-learning and online academies are increasingly opened on smartphones. What is this like in your organisation? If the majority studies on their smartphone, you can consider designing your online academy in a ‘mobile first' way, instead of a responsive desktop version.

To conclude, we can definitely say that almost all of the e-learning courses that you create for your online academy should also function on mobile devices. To create a strong user experience, you need to make sure that the content is ready and optimised for this possibility.