Help

Course Design 101

This guide was created to take you through the recommended process for creating and running effective courses for your learners in Xen.Ed.

We hope that it will provide you with an understanding of why it is important to carefully design your courses for the learners' benefit, what methodology to use, and how to apply this in Xen.Ed, using the combine powers of:

The Course Outline,
The different Content blocks,
The WYSISWYG editor.

Where to start?

Prior to building your first course, it is worth reviewing the content you want to migrate or create in the LMS, and what templates and design blocks you would need.

Decisions need to be made about the content, structure, timing, pedagogical strategies, sequence of learning activities, and type and frequency of assessment in the course, as well as the nature of technology used to support learning. Making these decisions is the process of creating your own design.

Instructional designers practice what is referred to as "backward design", which is starting from the objectives and working through the content to make sure that the objectives are measurable, that there are assessments to measure those, and that the content matches up so that we have alignment across the board.

This process is largely influenced by Instructional Design's best practices and, should you be interested in the subject, we highly recommend pursuing further research and training.

Xen.Ed is also proudly connected with a network of experienced Instructional Designers. You can reach out to your account manager to learn more about how we can assist you with reaching out to trusted partners for assistance with the design of your course.

Is online learning different to the traditional model?

One of the fundamental differences between developing online course materials and face-to-face materials is that is that producing online course materials requires more careful and rigorous planning.

Unlike face-to-face learning, which gives teachers the freedom to go off-script, in online learning, the whole process is pre-set, so you must anticipate any possible hiccups during the planning stages. Structuring, content, and results are of greater importance in e-learning.

Instructional design makes creating the course easier and ensures that all the learning goals are met. For instructional designers, the benefits of the process are felt in the production phase while, for students, they’re felt when the class is launched.

For example, if you're in a face-to-face session, it's quite easy for you to interact with your students and make mistakes and make errors and just automatically correct yourself. People can interject and raise questions and clarify understanding.

If you're trying to communicate asynchronously, whether via video, audio, or text on screen, what you say has to be scripted and perfect.

A note about Blended learning
If you are planning a blended rather than a fully online course, it will also have implications for all of the steps in your learning design process.

When you consider the blended context, think carefully about the level of the desired learning outcomes, the possible ways of assessing these and how (and which) face-to-face and online learning activities can be woven together in a planned, pedagogically sound manner.

You will also need to either:
Consider when the scheduled face-to-face meetings should be: can you arrange for these meetings to coincide with the course activities that are more meaningful face to face?
Create your course and then decide on which dates you will meet face to face. This will depend on your level of input. You might wish to try out the now popular flipped classroom approach, whereby students complete readings and lower-level assignments before coming to face-to-face sessions to complete the higher-level problem-based activities as a group (see the 'Useful links' pod to the right).

Concepts

While there are a number of instructional design models and processes, many of their components are similar:

1. Analysis

A needs analysis typically includes understanding the needs and learners including why a training or learning solution is required. It may be the case that training is not the solution and some other type of performance improvement or non-training solution will be recommended.

In this stage, you’ll also begin to develop the goals of the training, including learning objectives, and determine how the training will be delivered.

2. Design & Development

Design and development includes the actual design and development of the instructional materials or determining the delivery methods to be used. It often includes drafting curriculum and lesson plans, developing any instructional materials including presentations, e-learning, job aids, participant guides, and anything else to be used in the training.

3. Evaluation

Evaluation looks at how you determine if your training or learning solution was successful. Did it create a measurable impact on the learner’s behaviour and did that lead to the desired results back on the job?

Recognised best practices

‘Chunk’ learning into ‘micro-bites’

Modern learners are busy! 2/3 of knowledge workers complain that they ‘don’t have enough time’ to do their job (“Meet the Modern Learner” Bersin by Deloitte, 2014).

Breaking online learning into smaller chunks allows learners to complete sections when they a have a ‘spare 5 minutes’, or to access ‘bites’ that are relevant to the moment.

Simply put, your course should include a landing page, an introduction, as many modules as required, and then a summary, with an optional final task or assessment if needed.

Landing Page
Adults see value in meaningful learning experiences that are relevant to their lives (Adult Learning Australian (n.d.). Adult learning principles. Retrieved from https://ala.asn.au/adult-learning/the-principles-of-adult-learning). In order to see meaning, they need a clear ‘why’ and ‘what’ regarding the learning program. The landing page should clearly articulate the program’s purpose, duration and learning outcomes.
Introduction
Insert navigational instruction that reflect your audience’s digital literacy. Always provide generic navigational instructions in the introduction. For those less familiar with eLearning programs, you may also insert directions before each interactive element e.g. ‘Tap the + buttons to reveal further information’.
Introduce the program, including background information, its purpose/intention and its overall structure (e.g. learning map). This way, learners can clearly see ‘WIIFM’ and the learning journey they are embarking on.
Modules
This is where the learning content lies. We’ll have a closer look at this section below.
Summary
- Congratulate participants on completing the course to build a sense of achievement.
- Summarise the learning by restating the learning outcomes.
  This allows learners to reflect on what they’ve learned and their progress.
- Suggest ways for learners to embed and action their learning. 55% to 70% of learning occurs during on the job experience/through application (Deconstructing 70-20-10” Training Industry, Inc., 2018). Knowledge application is an important part of not only reinforcing learning, but also building on and refining understanding and skills developed during the program.

Content sequencing instructional design eLearning

Let’s take a closer look at the seven-step process to follow when structuring and sequences eLearning modules.

Steps 1 & 2
It is important to introduce the module and learning outcomes so learners have a high level overview of what they’re about to learn.
- You might choose to repeat the learning map at the beginning of each module to highlight where learners are on their learning journey.
- This also builds a sense of progress.
Steps 3-7
These steps focus on a particular topic within a module. The topic is introduced, content delivered, key messages reviewed, and knowledge and skills applied.
- Steps 4, 5 and 6 introduce the content, deliver the content, then summarise the main points. This repetition helps the learning ‘stick’.
- Step 7 is a knowledge check or quiz to ensure knowledge transfer has occurred.
- Repeat steps 3 to 7 for each topic within a module when sequencing for effective eLearning.

Cater for audiences with varying knowledge

Some programs may be developed for audiences with varying knowledge and experience.

In these cases, we recommend providing opportunities for learners to take ‘deeper dives’ into certain topics, in addition to the core modules. This in effect varies the content sequencing. This content may be optional or mandatory for select learners.

For example, mandatory content could be incorporated for learners that require further support. This need could be identified through a ‘confidence check’ or by responding incorrectly to a question. The learner would be directed to further information and activities regarding the learning need, and complete the lesson before continuing on to the core modules. This ensures the learner has grasped the foundational knowledge before building on these concepts during the next core module.

Optional lessons may be incorporated to include information that other learners may consider irrelevant or confusing. These sections may also include links to other resources that allow participants to extend their learning.

Implement evaluation strategies

Evaluation strategies are used to determine whether the program has hit the mark, and to assess how it could be improved. Examples of this for eLearning may include feedback surveys, focus group forums and knowledge checks to assess learners understanding of key concepts.

How to design your course in Xen.Ed

With the theoretical aspects explained, you should understand how to structure your course.

Now, let's dive into how to implement this within Xen.Ed!

Outline of the course

You can manage the structure of your course with the Outline feature, which is the root page of your course in Studio, and it lets you organise the content in its logical sections, sub-sections, and units (individual pages).

Inside the unit: Course template

Each unit is a self-contained page for your learners, and it is recommended to be consistent across all of them, as this assist learners to navigate and understand your content.

The fonts and colour scheme should remain the same across the units, within the same section at least.

You can create content blocks to store your headers and footers, so they can be implemented and repeated easily.

While Xen.Ed automatically displays a breadcrumbs section, at the top of each new page, it is a good practice for you to also provide a navigation scheme in your footers.

Mini-templates with the WYSIWYG editor

The WYSIWYG editor is one of Xen.Ed's most loved features. This is easy to understand since it provides course designers with advance abilities to create and edit web content without the need to learn how to write HTML and CSS code.

The editor provides layout and design capabilities, which can be saved as templates and re-used across all your units.

You can create your designs directly in the Editor or import their HTML and styles from another source.

Anatomy of a well designed page

This example is provided by courtesy of RTO Works & Strawberry Solutions.

Fonts

Great fonts are essential to great design. But picking fonts can seem like an impossible dark art at times. Understanding how they work, and how font feature influence legibility and induce feelings is important.

The anatomy of typography

The first step is to understand the anatomy of a font.

The second step is to get acquainted with typographic terms and compositional techniques.

Pairing

It's no easy feat to choose the right font pairings. The aim is to find two fonts that complement each other without clashing, which is a lot easier than it sounds. When looking for the perfect font pairings, may we remind you of the famous old adage, "concord or contrast, but don't conflict"?

Use font superfamilies

The guaranteed way to choose great font pairs is to choose fonts that reside in the same typeface family. There are plenty of 'super-family' fonts to choose from out there on the internet which means when it comes to choosing your font pairings, you already have a cohesive set of fonts that should work well together. Its common knowledge that a good super-family will have both a Serif and a Sans Serif version of the typeface.

Pair contrasting typefaces

Contrasting fonts can be hard to find as you're effectively searching for two fonts that are totally different but also complement each other rather than causing conflict. If typefaces are too similar, it's likely that they'll conflict. You don't often find that similar serifs or similar sans serifs look particularly nice next to each other. To achieve the perfect contrast, you'll often want to pair a serif font with a sans serif font.

It's also important that you establish a clear hierarchy. This could be as simple as adjusting the weight, the size or the colour of the same typeface, but when the typefaces vary, careful font pairing is crucial. For example, if you have a really unique display face full of personality, you'll need something more neutral to do the hard work and create a balance.

Pair type sub-categories

'Serif' and 'sans serif' are very broad classifications, and each can be split into several sub-categories. Generally speaking, Old Style serifs such as Bembo, Caslon and Garamond will combine well with Humanist sans serifs like Gill Sans and Lucida Grande.

Transitional serifs have a stronger contrast between thick and thin strokes (examples include Bookman, Mrs. Eaves, Perpetua and Times). These pair with geometric sans serifs like Avant Garde, Avenir, Century Gothic, Eurostile, Futura and Univers.

Finally, modern serifs tend to have a very dramatic contrast between thick and thin for a more pronounced, stylised effect, as well as a larger x-height. This third sub-category includes Bodoni, Didot, New Century Schoolbook and Walbaum.
Again, geometric sans serifs marry best with these.

To experiment freely on theses concepts, you can use sites such as fontpairings.com or fontpair.co.

Colour theory and the colour wheel

Ever wondered how designers and artists find the perfect colour combination?

They use colour theory. colour theory is a practical combination of art and science that’s used to determine what colours look good together. The colour wheel was invented in 1666 by Isaac Newton, who mapped the colour spectrum onto a circle. The colour wheel is the basis of colour theory, because it shows the relationship between colours.

Colours that look good together are called a colour harmony. Artists and designers use these to create a particular look or feel. You can use a colour wheel to find colour harmonies by using the rules of colour combinations. Colour combinations determine the relative positions of different colours in order to find colours that create a pleasing effect.

There are two types of colour wheel. The RYB or red, yellow, blue colour wheel is typically used by artists, as it helps with combining paint colours. Then there is the RGB, or red, green and blue colour wheel, which is designed for online use, as it refers to mixing light – like on a computer or TV screen.

Colour combinations

Complementary

Two colours that are on opposite sides of the colour wheel. This combination provides a high contrast and high impact colour combination – together, these colours will appear brighter and more prominent.

Monochromatic

Three shades, tones and tints of one base colour. Provides a subtle and conservative colour combination. This is a versatile colour combination that is easy to apply to design projects for a harmonious look.

Analogous

Three colours that are side by side on the colour wheel. This colour combination is versatile, but can be overwhelming. To balance an analogous colour scheme, choose one dominant colour, and use the others as accents.

Triadic

Three colours that are evenly spaced on the colour wheel. This provides a high contrast colour scheme, but less so than the complementary colour combination — making it more versatile. This combination creates bold, vibrant colour palettes.

Tetradic

Four colours that are evenly spaced on the colour wheel. Tetradic colour schemes are bold and work best if you let one colour be dominant, and use the others as accents. The more colours you have in your palette, the more difficult it is to balance,

Primary, secondary and tertiary colours

There are 12 main colours on the colour wheel. In the RGB colour wheel, these hues are red, orange, yellow, chartreuse green, green, spring green, cyan, azure, blue, violet, magenta and rose.

The colour wheel can be divided into primary, secondary and tertiary colours.

Primary colours in the RGB colour wheel are the colours that, added together, create pure white light. These colours are red, green and blue.

In the RYB colour wheel, primary colours are colours that can’t be mixed from other colours. There are three primary colours: red, yellow, and blue.

Secondary colours are colours that result from mixing two primary colours. There are three secondary colours. In the RGB colour wheel, these are cyan, magenta and yellow. When you mix light, red and green make yellow, green and blue make cyan, and blue and red make magenta.

In the RYB colour wheel, the secondary colours are purple (red mixed with blue), orange (red mixed with yellow), and green (yellow mixed with blue).

Tertiary colours are colours made by combining a secondary colour with a primary colour. There are six tertiary colours. In the RGB colour wheel these are orange, chartreuse green, spring green, azure, violet and rose.

In the RYB colour wheel, the tertiary colours are red-orange, yellow-orange, yellow-green, blue-green, blue-violet, and red-violet.

Warm and cool colours

The colour wheel can also be divided into warm and cool colours. The warmth or coolness of a colour is also known as its colour temperature. The colour combinations found on a colour wheel often have a balance of warm and cool colours. According to colour psychology, different colour temperatures evoke different feelings. For example, warm colours are said to bring to mind coziness and energy, while cool colours are associated with serenity and isolation.

Warm colours are the colours from red through to yellow. These colours are said to bring to mind warmth, like the sun.

Cool colours are the colours from blue to green and purple. These colours are said to bring to mind coolness, like water.

Shades, tints and tones

You can create shades, tints and tones of a colour by adding black, grey and white to a base hue.

Shade

A shade is created by adding black to a base hue, darkening the colour. This creates a deeper, richer colour. Shades can be quite dramatic and can be overpowering.

Tint

A tint is created by adding white to a base hue, lightening the colour. This can make a colour less intense, and is useful when balancing more vivid colour combinations.

Tones

A tone is created by combining black and white—or grey—with a base hue. Like tints, tones are subtler versions of the original colour. Tones are less likely to look pastel, and can reveal complexities not apparent in the base colour.

Hue, Saturation and Luminance

A hue is basically any colour on the colour wheel. When you are using a colour wheel or a colour picker, you can adjust the saturation and luminance of a hue.

Saturation is the intensity or purity of the colour.

Luminance is the amount of brightness or light in a colour.

Colour meanings and colour schemes

This is just an introduction to the fascinating world of colour. There’s so much more to learn! For instance, did you know that the colour royal blue was created in the 1800s for Queen Charlotte?

Was this article helpful?

How can we help you?