One of the greatest advantages of e-learning compared to classroom based learning is its convenience. Students can participate in a course at the time and place that best works for them. Mobile learning expands on that convenience, freeing the learners from even having to be at a desk using a computer. With mobile learning, a tablet, (or even a capable smartphone) is all your users need, and classes can be had anywhere those can go, which is, literally, everywhere.
There’s only one caveat: any old e-learning course wont do in this fancy new mobile e-learning world. Content has to be designed appropriately in order to be viewed and manipulated in a tablet. Worry not, though, as this doesn’t mean you’ll have to throw away your existing material. You’ll just have to make a few adjustments here and there, and in this blog post we’ll tell you all you need to know about creating tablet compatible courses.
1. Size matters
Your content might look fabulous in the average high resolution desktop or laptop screen but that doesn’t mean it work in a tablet. Tablets have constrained resolution. Even those fancy “retina/Hi-DPI” tablets, despite being nominally hi-res, use their extra pixels for extra sharpness, as opposed to using them to fit more stuff on your screen.
When designing for tablets, 1024×768 is a useful resolution to have in mind, as it’s the one all iPads (and thus, the overwhelming majority of tablets sold) share.
Another thing to have in mind would be “responsive design” ― a set of methods and tools helping to create websites that adapt to different screen sizes, all without having to serve different versions of your content to each.
2. Touch
Mobile, whether a tablet, a smartphone or a so-called phablet hybrid, is all about touch. While most mobile devices support connecting external keyboards, you can’t realistically expect of your users to have one. Rather you’ll have to ensure your e-learning classes work well with touch.
Buttons, for starters, must be easy for the average user to press, even if he has fat, sausage fingers. That means they have to be large-ish (you have heard of Fitt’s law, haven’t you?) and touch-ready. Be careful, though, as not all web controls used on the desktop are touch ready.
There are lots of libraries and frameworks available to help you create webpages and content that plays well on mobile devices, including mobile-focused versions of established desktop projects, such as jQuery Mobile. And of course follow the UI guidelines of your platform (iOS, Android etc), regarding sizes, supported web controls, etc.
3. Speed
Mobile devices have come a long way since their humble beginnings, but they are not yet (and probably will never be) as capable as our desktop and laptop devices. It’s the classic compromise between power and portability.
Think of their CPU/memory/storage and other limitations when you design an e-learning course for them. A heavily interactive course that works on a laptop might be slow as molasses on a tablet, while a Flash based animation will not play at all in both iOS and Android.
Keep your courses lean. That doesn’t mean they have to be spartan and minimalist ― just that they should not be bloated and that they should avoid using “cutting edge” web features, as they are often unsupported (case in point, Web GL support, which took years to come to mobile devices).
Oh, and keep and eye on your file sizes too, optimizing you website assets (images, js, css) to make it load faster.
4. Connectivity
Tablets and mobile devices in general might often be used at home or in the office, but they are first and foremost meant to be used on the go. Your users might be riding the subway to work, or hiking in the great outdoors. And they’ll want to use your e-lerning service from those places too. So, make your content work in situations where there is limited or no connectivity.
Material designed with limited connectivity in mind must be lightweight (to load fast when there’s slow or patchy internet access). Avoid large videos, images and audio in your mobile content, or try to make its viewing optional, not a prerequisite in studying a course.
As for those places with no connectivity, there are HTML5 features like the so called “Local Storage” functionality, that let you store things on a student’s browser for offline viewing. It might not be a prerequisite to offer such a capability, but it would be a very impressive feature that your competitors mostly likely would not offer.
5. User habbits and device capabilities
Users don’t use a tablet (much less a smartphone) in the same situations or in the same manner as they do a laptop.
Some things are plainly harder to do on a tablet, like having precise control over your pointing (fingers are fatter than a virtual mouse pointer). Having many websites open is also more cumbersome without tabs and multiple windows.
Study how your users use your content on tablets and mobile devices in general. Pay particular attention to where their use differs to what they’d normally do when accessing your website from the web. And, it goes without saying, apply what you’ve learned to your e-learning content design.
For example don’t make the users scroll a lot ― it’s something that’s not as convenient as it’s in the desktop. And of course, test your final product in an actual mobile device, or rather more, as an emulator wont show you all possible issues your design might exhibit. Eat your own dog food by trying early prototypes of your mobile content on your mobile device.
6. Fragmentation and the Pareto Principle
When designing for the desktop you have the luxury to use all available HTML5 features in the browsers you target, and assume a generic target client machine. With mobile, you don’t have that luxury; Some features come late to the mobile browsers, and others don’t match between mobile devices, even if the latter are from the same vendor.
From screen-sizes to sensor support to camera and sound capabilities, not everything is available to all machines. In fact for Android there are hundrends of different device configurations, and Apple’s catching up fast too.
That doesn’t mean you have to limit yourself to the lowest common denominator of the features you’re interested in using. The Pareto Principle, named after the Italian economist Vilfredo Pareto, is a heuristic that states that you can rip 80% of the benefits for 20% of the effort ― something that holds in surprisingly many situations.
Following the Pareto Principle, instead of trying to cater to 14 iOS and 300+ Android devices, focus instead on the 20% of devices out there that 80% of your users actually use (which in the tablet world, for a long time, just meant “focus on the iPad”).
