Blog Post

Articles
6 MIN READ

5 Graphic Design Mistakes Newbies Make and How to Avoid Them

AllisonLaMotte's avatar
7 years ago

If you’re new to the e-learning field, you might soon realize that people often assume you have some kind of magical power on the ready: they not only expect you to design the content, they also expect you to make that content look great. And if you don’t have any graphic design knowledge, you might feel pretty intimidated right about now. The good news is that this article will help you avoid making a few rookie design mistakes and get you on the road to success.

Mistake #1: Designing a Unique Layout for Every Slide

One of the most common graphic design mistakes that newbies make is creating a new slide layout for every slide. But using too many different slide layouts can make your course feel disjointed. For example, take this set of slides:

Each of them is completely different, so it doesn’t feel like they’re part of the same course. Reusing a few basic layouts—with similar shapes, colors, and compositions—throughout your course gives it a more cohesive feel, like in the Content Library slides below.

Another benefit of reusing the same slide layouts is that it helps learners instantly identify the type of slide they’re looking at—for example, a title slide or a quiz slide—making it easier for them to know what to do next.

When you’re designing your course, start by creating a layout for each of the basic slide types you find in most e-learning courses and go from there.

Mistake #2: Using Too Many Different or Flashy Colors

If you’re required to use your company’s graphic guidelines, then you might not have much choice in the colors you use for your courses. But if you have a little more freedom to choose your own colors, you might find yourself wanting to include lots of different colors to add a little flair and personality to your course.

However, it’s important to resist the urge to use all the colors of the rainbow in the same e-learning course. Why? Overusing colors can overwhelm learners and make it hard for them to know what to pay attention to.

Take this slide, for example:

There are so many bright colors mixed together here that it’s hard to know what to focus on.

But that doesn’t mean you can’t use bright colors at all, just that you should use them in moderation and in a purposeful way.

Take the slide below, for example:

I used the same yellow as in the previous example, but this time I used it on a white background along with some muted gray tones that are less visually aggressive. And the use of yellow here immediately attracts your eyes to the numbers, making them the clear focal point of the slide.

When you’re starting out, try to keep your color palette to a minimum. Start out with three colors, for example, one dominant and two neutral. When you start to get a little more comfortable with graphic design, you can start using more colors, while still keeping in mind that the colors should complement each other and not overwhelm the learner.

If you’re looking for color palette ideas, be sure to check out Adobe Color and Design Seeds.

And if you’re keen for more tips on choosing color palettes, try reading these helpful articles:

Mistake #3: Going Font Crazy

When people are just starting out in e-learning, they usually do one of two things. They either leave the default font settings as is, or they go crazy and use tons of different fonts. While projects with default fonts may be missing that little something extra, they usually look better than those with too many used haphazardly. Here’s an example of a slide with too many different fonts:

In the above example, there are four different fonts. Not only are some of them hard to read, they just don’t go together and so they detract from the message. Much like colors, when it comes to fonts, less is more. Let’s look at this same slide with only two different fonts:

I typically choose two fonts for my courses: one for the headings and one for the body. If you’d like, you can also mix in a third font for things like quotes or key words that you want to really stand out. However, I would avoid using more than three fonts in the same course.

If you want to emphasize a key message, try putting the text in bold or changing the color instead of using a different font.

Here are some other resources about typography I recommend checking out:

Mistake #4: Not Leaving Enough White Space

If you’re not familiar with the term “white space,” it refers to any empty areas between objects on your slides—whether it’s actually white or another color. When there’s a lot of course content, it can be tempting to pack as much as you can into each slide. I see this a lot, especially with new e-learning designers. Have you ever seen a slide like the one below?

That’s a lot of information to take in at once! When slides are too dense, it can be hard for learners to pick out the key messages. A good rule of thumb is to present one idea per slide. Don’t be afraid to leave white space. Au contraire, embrace it. Let’s take a gander at what it would look like if I broke the above slide down into several “airier” slides.

Ahhh … much better! When you leave enough white space it’s easy to pick out the important information. Remember: it’s better to create more slides with less information than vice versa.

Check out this article for more tips on keeping the content on each slide to a minimum: 5 Ways to Avoid Overloading Your Slides.

Mistake #5: Mixing and Matching Images That Don’t Go Together

A lot of newbies choose images that accurately represent the content, but don’t necessarily match the other images in the project. I get it! After all, the content itself is the most important part of the course, isn’t it? Well, yes and no.

It’s important to choose images that add value, but it’s also critical that those images work well together. If they don’t, you could end up with a course that doesn’t look very professional. Take this slide, for example:

The mix of photos, icons, and illustrations makes the slide look disjointed. And while people say not to judge a book by its cover, the reality is that we all do. If you want your learners to take your course seriously, the graphics need to be on point. Look how much better that same slide looks when I use all photos.

To make sure your images look like they go together, don’t mix and match image styles. While it’s possible to get a good result when mixing photographs and illustrations, doing so is a complex feat that’s best left to the experts. If some of your photos are black and white, add a black-and-white filter to all your photos. Don’t mix flat design illustrations with more realistic illustrations. The key here is to make it look like all the images were created especially for your course, even if that’s not the case.

More Resources

Now that you know the top five newbie mistakes and how to avoid them, you’re ready to get started! But if you feel like you could do with some more graphic design guidance, check out these great resources:

E-books:

Articles:

Like this article? Subscribe to our newsletter to get the latest e-learning inspiration and insights directly in your inbox. You can also find us on LinkedIn and X (Formerly Twitter)


New to e-learning? Sign up for our E-Learning 101 email course, a series of expertly-curated articles that'll get you up to speed with course development.

Published 7 years ago
Version 1.0
  • JohnNixdorf's avatar
    JohnNixdorf
    Community Member
    Remember 10% of men and almost 1% of women have color deficient vision. Red and green both look like a kind of dirty yellow. Use shape and contrast, and label buttons to make your program accessible.
    • SteveHazelton's avatar
      SteveHazelton
      Community Member
      And from someone who is colorblind - not all of us see colors the same (red is not too much of a problem for me, I will get blue and purple wrong every time, and green doesn't exist). Contrast can go either way, but often what is obvious contrast to you might blend together for me. Find a couple of folks who are colorblind and run stuff by them, but when all else fails, simple is good!
  • JohnNixdorf's avatar
    JohnNixdorf
    Community Member
    "Muted grey" type seems to be an Articulate design rule. The problem is that it can be very hard to read, especially on mobile devices. The prime rule for text is it must be readable.

    Grey text also conflicts with the web and app style guideline of "grey text = inactive/disabled"
    • BarryEames's avatar
      BarryEames
      Community Member
      Absolutely John!
      This a major peeve of mine. One of the first things you learn about text based design is CONTRAST for readability. If you can't read it what's the point?

      Grey on white is NOT easily readable yet it continues to be used everywhere! (even on this page). S T O P I T !
    • No-Pun's avatar
      No-Pun
      Community Member
      Yes! (Said the also web designer/developer.) On a similar note, use selection containers that conform to a website vernacular:
      Circle = one answer only ("radio button")
      Square = multiple answers allowed