Effective User Interface Design for Mobile Learning
by Noleen Turner
*A friendly word of warning to those involved in ‘conversion’ projects – mobile is different to traditional web – and your mobile learning programme won’t work if it’s just a regurgitated experience. Mobile learning is micro-learning, designed for short bursts of activity – your learners are likely to access it while on the job, performing a task, or in between other activities. And learners need to be able to access it via a range of mobile learning technologies which are likely to include smartphones and tablets.
But I digress…and to get back to the original point how do you design an effective user interface for mobile learning? And how do you manage navigation, usability, and aesthetics ensuring that the transition between screens feels natural and that users know where they are at all times during the programme?
LearningSolutions Magazine recently published an article entitled “From e-learning to ipad – how to adjust the user interface”. In the article they consider how the user interface design contributes to
the success of a learning mobile app – one in which the user interface enhances and eases the learning process.
According to LearningSolutions, the layout you build for your mobile learning app must enable users to answer these five questions:
- Where am I?
- How did I get here?
- How can I return to where I once was?
- How far have I gone?
- Where else can I go?
In response to these questions I’ve tried to come up with my own tips for optimising the mobile learning interface:
|How to improve the experience|
|Where am I?||
|How did I get here?||
|How can I return to where I once was?||
|How far have I gone?||
|Where else can I go?||
And finally…don’t forget to test your user interface
Once you design an interface, make sure you test it with a sample group of learners, checking how long it takes to complete the learning, how easily they can navigate the learning, how many navigational errors they make etc.
Useful resources for designing mobile learning
iOS Human Interface Guidelines
http://thatcoolguy.github.com/gridless-boilerplate/ guidelines on HTML5 & CSS3 topics
10 Tips For Designing mLearning And Support Apps
From e-learning to ipad – how to adjust the user interface
Ten things to think about when designing your iPad App