10 Graphic Design tips for e-learning educators

03-logo-design-color-tips1
You deployed the most capable LMS platform (*cough* eFront *cough*). You have written the finest course material, crafted the best exercises, and organized them to perfection. You are finally ready to take your  live, but could there be anything missing?

Indeed, there could. Most of the time not much thought is given to the graphic design. At best, it’s left as an after-thought. In this article, we’ll explain why the design of an e-learning course is an important factor of its success and give a few basic guidelines that every e-learning educator should be familiar with.

1) Design is important

If you were to only take away a key insight from this article, it should be this. Design affects how students perceive your content. Bad design choices can render the content unreadable or hard to follow, while subtle design cues can help students navigate your courses or emphasize important sections. 
Good design is also a marketing tool. It helps differentiate an amateur looking e-learning site from a professional looking one. 

2) Hire a specialist. Or become one.

If you can afford to hire a design specialist for your e-learning content, don’t think twice about it ― your content will look much better for it. Don’t go for a designer that specializes in print design or brochure like, static websites. You’ll want someone who understands the dynamic web and the interactive aspects of using an LMS. Those usually come under the title of “UX Designer” or “UX Expert”.
If you can’t afford to hire a designer, don’t fret over it. You can still learn the basics and do a good job yourself ― that’s what we’re for after all.

3) A nice template is only the beginning

You might think you can bypass this whole “design” can of worms by using some ready made template. And, sure enough, it helps. A good template, especially one designed specifically for e-learning content (e.g one provided by your LMS vendor), can help you get all the defaults right, and avoid bad choices. But that’s just the beginning. 
A great template can take you 80% of the way to a nicely designed e-learning site, you have to take care of the rest of the 20% yourself. You’ll have to customize it for your particular content’s needs. You’ll also have to settle on colors, fonts and other choices the template might offer as customization options. And, finally, you’ll have to add your own branding on top of it.

4) Content is King

All your efforts towards the design of your elearning content should aim  to making your content shine. As they size in the publishing business, content is king. 
Design is not about adding graphic elements, decorations and ornaments for making stuff look pretty. It’s about organizing your content visually in a way that makes it easy to read and easy to follow. An important aspect of that is, for example, the proper presentation of your content’s hierarchy — its chapters, sections and subsections. If you’re not sure about a graphic elements utility with regard to your content, don’t add it. Less is more. 

5) Design for your audience

Of course you should *always* design for your audience ― those are the ones that will benefit from your design choices. But in this tip, we want to stress how you should also design for your target audience sensibilities and skills.
If, for example, your e-learning courses are addressed to small children you should not overcomplicated the navigation, or make the site look austere. Touches of color and bigger font sizes (like in children’s books) can help them connect to the content easier. If, on the other hand, you’re targeting lawyers or financial professionals, it will obviously be better to avoid cheeky colors. 

6) Design is mostly about typography

Even in this age of multimedia, if your content is anything like the average e-learning course most of it will be textual. Good typography ― choice of fonts, font-sizes, line length, columns etc, is the most important part of good graphic design.
Chose your fonts wisely ― if in doubt, stick to the standards — Arial, Helvetica, Verdana, etc (sans serif fonts usually look better on a computer monitor compared to serif fonts). Avoid garish choices (Comic Sans, anyone?). Don’t make them too small or too large. A font size of about 16px is a good starting point. Don’t make the content too long or too short horizontally. Around 70 characters per line is considered a best practice for optimal reading ease.

7) Color me impressed

Your palette matters. Believe it or not, color choices are not just about “personal taste”. Read a bit about “color theory” — it can help you pick colors that fit nicely together (e.g complementary colors) and avoid clashing hues. There are desktop programs and web services called “palette generators” that can help you pick and match color sets.
Consider “color coding”. That’s the name of the technique in which you use colors in your design to separate distinct content elements. E.g important notes could have a yellow background. Warnings could come with a red heading, etc. 
Above all, focus on readability. Long text passages should have good contrast — so use colors with a strong contrast for your typography (black text on white-ish background is a safe choice). You can still use bolder colors on your titles and asides, since those are short and typically use larger, easier to read, font sizes.

8) An image is worth a thousand words

The choice of illustration for your courses is important too. If you want custom illustrations for your content, consider creating your illustrations to fit your site’s graphic design (or vice versa). 
Avoid just using random pictures off of the internet, and especially don’t mix and match illustrations having different styles (e.g technical drawings and cartoons). Using a consistent style helps establish your content’s identity.
If you are strapped for cash, there are picture packs, with thousands of pictures, clip-arts and illustrations on various topics (e.g medical, animals, computers, flowers, etc) that might be appropriate for your content, and that usually have a consistent visual style. 

9) Keep up with the times

This tip is especially important for the branding and marketing appeal of your site. Some design choices are timeless, others change with the times. Try to create a design that appeals to modern users. Nothing says “cheap” and “amateur” than a 90’s looking design, whereas a Web 2.0 era style signals that you are a tad behind the times in this Web 3.0 era.
Your users will all be  familiar with sites like Facebook, Twitter, Google, Yahoo and the like, so keep an eye for design trends that appear on those that you can apply on your own e-learning site. 

10) Learn from your users

This list offers you a few basic guidelines (and it’s surprising how many sites get this stuff wrong). But even if you apply everything that’s in here religiously you won’t have a perfect design. There’s always room for improvement. Design is an iterative process.
Listen to your users, watch them use the site, and note any difficulties, complaints and suggestions they might have. Use their feedback to improve on your original design. Rinse. Repeat. Don’t be afraid to redo some design element you were fond of, if it proves problematic for your audience. 
And with that, we conclude our list. You already know enough to avoid the kind of visual atrocities one all too often sees on the web. Stay tuned though, because in future articles we’ll get into further details for a lot of elements on this list (typography, colors, illustration, etc).
  • Penny Claridge

    This is a great article thank you, and very timely for our organisation who is embarking on e-learning and working hard to implement this list right from the get-go, yet taking an iterative approach. Thank you for the advice and confirmation we are going in the right direction!

    • papagel

      Thanks for the good words Penny!