Compact of Mayors

online course for an international research organization

Purpose & Role

Intended for mayors and city officials around the world, this eLearning training consists of seven modules on how to become compliant with the Compact of Mayors, a global initiative to reduce cities' greenhouse gas emissions. For this project, I served as both project manager and lead instructional designer. I coordinated client communication and team resources in addition to designing the menu, navigation elements, and interactions using Articulate Storyline for four of seven modules. Other team members illustrated the backgrounds and avatars and provided quality assurance support. The client provided the storyboards and subject matter expertise.


In order to visually reflect the course's epic goal of empowering city leaders to make a difference in the climate trajectory of their city, my team designed each module to take place in a specific part of a virtual city. As the learner progresses through the course, the city becomes visibly improved; each module's location becoming more vibrant while trees, flowers, and wildlife begin to appear. The visibly improving virtual city, displayed at the beginning and end of each module, provides a subtle reminder to learners that their efforts to complete each module reflect a much larger local effort to improve real cities on a global scale.

A gif showing how the course map becomes increasingly vibrant as the learner progresses through the course.

Within each module, I designed the interface to highlight the main sections of each module so that the learner is always aware of where they are in the module and how the current topic relates to previous and future topics. I went with a simple, bright blue next button to make navigation as easy as possible. In some cases, I added in additional navigation elements where appropriate, such as in module 4 where the learner clicks through a stack of virtual books to access material.

The home page of module 4, which is set in a library.

Below is a screencast demo of the some interactions within module 4, although without the original voice over provided in the course.

Providing nonlinear learning paths, such as completing a stack of books in whatever order one chooses, allows learners to structure their own learning experience. In module 1 the course invites the learner to click parts of a city scene to learn more about the role of cities in combatting climate change. Every time the learner completes a section, the learner is invited to pick the next section that piques their interest.

In addition to emphasizing the epic nature of the learning goals and empowering learners to customize their learning paths, the course aims to capture learner attention by providing ample opportunities for learners to apply material through practice exercises with real-time feedback.

Below is a screencast demo of the some interactions within module 1, although without the original voice over provided in the course.

You can read more about my approach to designing this course here.