A few months ago, I was looking for a simple way to allow learners to visually track their completion of an e-learning module. For each lesson, I wanted learners to see if they have completed the content, review, and the exercise. I wanted all of this information to be visible in one place for the learner. This is a lot of information to track, but I wanted to keep the look clean and clutter-free, so it’s easy on the eye. I think it’s important to let your learners see where they stand in the grand scheme of the course; it helps them see the big picture and it keeps them motivated when they know how much content there is left for them to complete.

For that project, I decided that the simplest way to let learners visually track their progress throughout the whole course was to build a simple table of contents menu that has a table layout.

How to Create a Simple Table Layout

I added a Completed state with a checkmark to each of the green circles, and set up my variables and triggers so that the Completed state becomes visible when they have looked at the related content. Each of the circles is a clickable link, which will take you to the related content. Each of those related content slides has a variable associated with it, and a slide level trigger that adjusts the variable to true when the slide is visited. Once you’ve reviewed the related content, you are linked back to this table of contents menu, where the circles with checkmarks indicate the content you’ve already viewed.

I created a very simple Screenr tutorial to show you how I’ve setup this menu. Additionally, you can view a published version of the file here, and the template is also available in the Downloads section on the Articulate site, if you’d like to use that as a starting point in your own project.

11 Comments
Judy Bickel
Benny Tiah