Designing learning for the way we live our digital lives

I’ve spent the previous week in Manchester, on Clive Shepherd’s Digital Learning Design course. Some of the course covered topics I was already familiar with, like how to write for the web (skim and scan, etc.). When the learner has prior knowledge of the topic the learning experience is of course relatively easy. It’s more about reminding you about the things you already know. But when the learner is coming to something completely new, well, that’s another matter.

Learning is hard work

We all instinctively know that learning is hard work. I distinctly remember that memorizing German verbs and multiplication tables made my brain positively hurt. But I hadn’t really appreciated before the difference between designing content for a general online audience and designing content for online learners.

In an online learning context you are dealing with an audience under pressure, feeling the strain of processing new information. Learning expends considerable intellectual effort. Neuroscience backs this up; the hippocampus (our short term memory) can only hold 20 minutes of focused learning. After that we’re bust.

Design learning to be a little less effortful

So we need to build learning content that precisely targets the intended learning outcomes, with a laser-like focus on the essentials (courses), leaving everything else for the learner to discover on their own (resources). We must deliver courses that cater to the different ways people learn. To make learning ‘sticky’ we need to mix together the right compounds from our learning design chemistry set. And choose the right approach – exposition, instruction, guided discovery, or exploration – that works best for what your learners need to know.

When learning is a far from normal experience

But we also need to be mindful of designing learning for the way that we live our digital lives. As digital technology evolves and embeds itself in people’s lives, our perception of ‘normal’ quickly changes.

It can be hard to keep up with the dizzying pace of change – even for the big boys in software development. But it’s crucial that we keep moving and adapting our learning design strategies. Otherwise the gap between people’s experiences of digital learning and their non-learning, day-to-day digital lives will create additional cognitive load. When learning is already ‘effortful’, we need to make it easier by designing content and platforms that emulate familiar, positive digital experiences.

Today’s digital normal is responsive and seamless

It’s five years now since Ethan Marcotte’s seminal article (http://alistapart.com/article/responsive-web-design) on responsive web design. Five years on and smartphones are ubiquitous. And the screens we interact with on a daily basis vary from tiny through to ginormous: smart watches and smart phones, tablets, laptops and supersize smart TVs. We increasingly expect to interact with the same platform and content across all devices, moving seamlessly between them.

At CIPD we’re about to embark on a project to redesign our website and make it responsive (amongst a list of other improvements). But it’s not just humble organizations like CIPD that are grappling with the challenges and opportunities that responsive design brings, so too are the giants of web and eLearning software.

A couple of weeks ago a colleague introduced me to a whizzy new tool: Adobe Muse. Muse creates cool-looking dynamic one-page scrollable infographics and microsites. (Check out site of the day at http://muse.adobe.com/site-of-the-day.) But Muse doesn’t (at least not yet) create responsive sites. And the two most popular eLearning design programs – Adobe Captivate and Articulate – are still not capable of building responsive courses.

The next release of Adobe Captivate will export responsive courses (due end 2015). And Articulate is building a responsive player. But open source got there first. (Don’t you just love open source!) Adapt Framework is the new kid on the block and builds responsive courses in a scroll-based template that’s ideal for presenting content on a smartphone. Another open source development xAPI is gradually replacing SCORM, allowing sophisticated learner interactions to be captured and recorded on a LMS (via a Learning Record Store), without the need for a continuous internet connection (which is one of the drawbacks of SCORM). Again, technology is evolving in ways that emulate the way people increasingly interact with their devices.

Today’s digital normal doesn’t look like a ‘traditional’ corporate VLE

But not only do we need to build learning content that works on multiple devices, we also need to host it in familiar-looking environments. Lynda.com for example, doesn’t look like a Virtual Learning Environment: it looks like an App store. CIPD’s VLE doesn’t look like anything else our students will be used to using online. Using it (as I had to a lot last week) feels like you’ve fallen through a space-time wormhole back to 2001. (Although it has to be said, it is responsive!)

The future is now

So the future is now… well, almost. We need to keep on our toes. We need to continually evolve as the digital world around us evolves; designing and building learning that resonates with the digital concepts, conventions and environments our learners familiar with.

Clive Shepherd’s Digital Learning Design course is available via CIPD. Clive blogs about all things elearning at Clive on Learning.

Advertisements

Designing eLearning: take aways from the world of graphic design

This week I’m in Manchester, on Clive Shepherd’s excellent Digital Learning Design Course (CIPD). For our second practical assignment I’m working with Ben Ingils-Grant to write a blog post about using graphic design principles in eLearning.

First let’s talk fonts

Fonts fall into two categories – serif and sans serif. How do you tell the difference? Well, a serif font has a little, decorative flourish at the end of the strokes. Sans are (you guessed it) sans or without the fussy little flourish.

serif and sans

So, as I’m sure you’re asking yourself at this point: when do I use serif and when do I go without? Serif fonts are easier to read on the printed page, and are usually used for blocks of text in newspapers and magazines. Sans serifs work well in contrast: for headlines and pull quotes.

Sans serif fonts are most commonly used online, because screen resolution (even Apple’s retina display) is much lower than print, making serif characters harder to read than sans serif onscreen.

A golden rule of typography, and by extension when using fonts in graphic design, is to stick to just one or two fonts. Simplicity is (as ever) key: too many fonts looks confusing and unprofessional. Avoid!

fighting fonts

Another one to avoid is the dreaded comic sans: childish, frivolous and shallow. Perhaps once, back in the early 90s, it was ok, even fun, to use comic sans – on a 5 year olds birthday party invitation, or a Christmas card greeting. But overuse has soured that once childlike and innocent relationship.

images

Some people still think comic sans is a friendly, approachable typeface, but inappropriate use can have a jarring, unintended hilarious effect.

comic bad 1

SIMILARLY, NEVER USE CAPS! UNLESS YOU WANT PEOPLE TO HATE YOU. FOREVER.

For more bad font nostalgia, remember blinking text? The days of blink are finally over; few browsers these days will even support it (the tag has been depreciated), but oh how we miss you. Your inappropriate blinking purple (or yellow, or blue) text was always certain to grab our attention, like a screaming toddler.

What many people don’t know is that many fonts are proprietary and require a license. To avoid costly litigation (it’s no joke, it did happen to a publisher I used to work for) avoid proprietary fonts. Instead check out the free font database at: http://www.freefontsdb.com.

But beware using custom web fonts that can slow the rate at which your web page loads. Particularly irksome if you’re viewing content on a smartphone. (Check out this great article at http://www.filamentgroup.com/lab/font-loading.html.) Always make sure you include a default fallback font in your CSS so browsers don’t grind to a halt, waiting to find and load your fancy font.

Finally, Amazon and Google have recently announced that they’ve designed and are rolling out new fonts specifically for reading ebooks.

Now over to Ben.

Colour schemes in learning content

Colours have inherent meanings, and the use of colours can focus attention and direct the viewer’s eye to the areas you want them to see. In learning materials, the use and deployment of colour can enhance materials or break them. There are a few general guidelines that can be used by content designers to ensure that their work is beneficial for learners.

Colour schemes are often the forgotten piece in the content puzzle for designers. Just Googling bad use of colour in design can pull up several million examples of truly horrific displays of design efforts, which can leave the viewer feeling nauseous. Colour schemes can open up subconsciously, the viewers mind for materials and information to stick in the viewer’s memory.

The first general rule is for the designer to use between 2-4 colours only in a set of materials. If there are more colours used then the reader can be left feeling dazed, lost and unable to focus on the content of the material.

This effort from http://www.ingenfeld.de/ (2010) is a perfect example of content being lost behind a wall of colour.

22-300x191

For more fun bad web designs check out this post on website fail.

The internet is littered with examples like this website; to avoid confusion content that is being designed from scratch should start out with this in mind. Colours can help direct, but too much colour can confuse.

The number of colours can be limiting, even in some cases to one colour, and a designer can alter a colour to display various shades of the same colour to provide flexibility in creating materials whether images of text.

The use of colour is, stating the obvious, an art form. Picking the right colour for the right material is a skill, and choosing the right shade for the right moment or emphasis can also prove tricky. Jerry Cao, explains about colour theory for The Next Web (http://thenextweb.com/dd/2015/04/07/how-to-create-the-right-emotions-with-color-in-web-design/) and you can identify emotions that are subconsciously associated with colours. The shading of the colours in your materials is an important factor to consider when choosing your colour scheme.

Another stumbling block for colour in content design is clashing colours. Clashing colours are most commonly used to draw attention or give warning to the viewer about something. When developing learning material you want your viewer to be at ease and engaging with materials and not put on edge and worried about their eyesight as they read through your content.

External factors may impact on the use of colour in content that you produce; the most prominent may be branding guidelines which restrict the designer to one set of prescribed colours. When working in this context it is best for the designer to be aware of these restrictions and to not create content that relies on additional colours that are outside the brand guidelines.

If there is discussion about colour schemes, then there are many resources available for designers to provide inspiration. Websites and apps are becoming more readily available for designers to engage with and create new materials. The example below is of a website that runs through the basics of colour scheming, but the range of options to aid designer is limitless thanks to the internet.

materialcolors

Adobe have joined the market and launched an app to accompany their other creative software, Adobe Colour, and if a designer finds a specific colour or colour scheme from any source, then the app can scan an image or view through a camera in the device and set up an appropriate colour scheme. These apps will help those not confident in their own ability to create colour schemes but the take away message is to try your schemes and test them out to check they are appropriate and feasible for your content.

For further reading check out Google’s advice on colour and design.

And if you’re wondering about the pink elephant (literally in the room), Clive was illustrating the relationship between the emotional part of the human psyche (the elephant) and the logical, rational brain (the poor rider atop of the elephant). Read more in Clive’s blog where he talks about the book (he read on holiday) Switch – How to Change Things When Change is Hard – from Chip and Dan Heath.