Chicago Style Course

Computer screen showing title page of a course "Chicago Style Training for Writers"

This concept course is imagined as a form of customer training for the well-known Chicago Manual of Style (CMOS). Students learn citation basics and practice checking citations for some of the most common source types. Creating such a course could promote adoption of Chicago style in more college courses, leading to more sales of books and digital subscriptions to the CMOS.

Roles: instructional design, e-authoring, video editing, graphic design
Tools: Articulate Storyline, Camtasia, Adobe Illustrator, JavaScript

Try the Course


After determining the goals, scope, and tools to be used in the course, I started by prototyping the activities. I knew that use of screen space would be a challenge, because creating citations often involves switching back and forth between multiple books (or windows if done digitally). I settled on a tab interaction that would allow learners to consult multiple views but would ensure that the question, answer choices, and detailed feedback would all be viewable on a single screen. I also iterated several design options to find the best use of the CMOS brand in the course

eLearning course presented in two columnseLearning course presented as a mock file folder with a blue backgroundeLearning course with folder tabs at topeLearning course with flat, modern design. A white background with red and blue accents.


Another important challenge arose with the images of book title pages, which I wanted students to be able to consult when checking citations. Because putting text in an image is inaccessible for screen readers, I decide to recreate the title pages by matching the original typography with fully readable text. This approach had the added benefit of allowing me to customize the title pages by tightening up the white space to reduce scrolling. See the full details of this work in the design document and accessibility report.

The design of the activities meant that a standard quiz template wouldn't work. Instead, I created custom slides, using layers, states, triggers, and variables for a polished fully functional result. Customizing allowed me to ensure that students could access whatever supports they needed during the activity. The activities are also designed to require multiple guesses if the student fails initially. Detailed feedback is provided once they find the correct answer.

A screenshot of Articulate Storyline showing a quiz slide with multiple layers and triggers

To prepare students for the activities, I devised just a few introductory slides, along with a worked example video. Using Camtasia, I was able to edit my demonstration video to ensure smooth visuals, crisp audio, and clear visibility even on smaller screens. Features used include annotations, zoom and highlight effects, an intro template, and generating a separate captions file.

Try the Coursescreenshot of Camtasia showing multiple tracks used to make a video

The finishing touches came in storyline. For the video captions, Storyline defaulted to a gray background, which did not fit the black background of the video slide. Fortunately, I was able to find a JavaScript on e-Learning Heroes that was easily modified to fix this. JavaScript is still new for me, but I love learning new ways to push the capabilities of Storyline. Finally, I created a custom tabs interaction using the timeline-based triggers to achieve a smooth motion and color transition

A screenshot of Articulate Storyline showing a JavaScript triggerA screenshot of Articulate Storyline showing a tabs interaction with multiple layers and triggers

Finally, I created a job aid/infographic to ensure that students would have concise support at the moment of need, including while they were completing the multiple choice activities within the course as well as when creating citations throughout the semester. I used Adobe Illustrator to create a readable and attractive job aid that can be easily saved digitally and placed physically wherever it might help.

Infographic outlining the three step citation method

I enjoyed expanding my capabilities while I created this course. One challenge that remains is making sure this course is easy to use on smaller mobile devices. Other approaches (like using Rise) would have helped make the course more adaptive, but at the trade-off of losing some customization in the interactions. Though either approach is valid, I might very well have preferred a different approach depending on the priorities of the sponsoring organization.

Try the Course