Insulin 100

University of Toronto

100 years ago Frederick Banting made one of the most significant medical discoveries of the 20th century. Working from a laboratory at the University of Toronto, Banting and his assistant Charles Best developed and tested a treatment for diabetes which, in the words of a young U of T surgeon, saw patients “snatched from death’s door.” This discovery kickstarted a century of health innovation at the University of Toronto, sparking a culture of ingenuity and collaboration that continues to change the world. 

In 2020 U of T celebrated Insulin 100: a century of health innovation. This year-long campaign included prominent placement throughout U of T’s campuses, a number of high profile events and exhibits, as well as a new Heritage Minute and commemorative stamp. At the centre of this campaign is the Insulin 100 website which tells the story of Insulin’s discovery and the century of scientific innovation it ignited in a rich and engaging way, while also connecting the various elements of the campaign.

Designed and built in close collaboration with U of T’s marketing and communication team, and including the input of more than two dozen stakeholders and subject matter experts, mixes rich storytelling and narrative experiences with high utility news, events, and resources. The homepage is a long form, scrolled experience telling the story of the discovery of insulin through archival footage and printed media including excerpts from Banting’s notebooks and letters and photographs from some of the first patients to receive the life-saving cure. The discovery and its impact established, the narrative then transitions into a high impact timeline covering a century of innovation and discovery in the health sciences before looking ahead to the next 100 years of transformative research with global reach.

Some of the most challenging aspects of this project included the complexity and informational density of the content, and the need to create an experience that was wholly unique and yet clearly references and reinforces the University’s brand. Key to overcoming these challenges was an incredibly close working relationship with the U of T team. O/B designers and developers established a digital workspace using InVision Freehand, enabling all stakeholders to participate in storyboarding, wireframing and sketching sessions. The collaborative space is where the O/B team mapped and remapped multiple drafts of the Discovery story as it was written by U of T’s content team, and worked closely with U of T’s art director and archivists to source and sort through over a century of imagery and footage. The digital workspace became a hub for the project allowing for both synchronous and asynchronous collaboration, and continues to host semi-regular working sessions as the site itself continues to grow and evolve over the course of the campaign.

Early on we identified that the length of the scrolled experience could prove daunting for some users, and that the content may need to change and evolve post launch–meaning there would need to be some level of editability and templating of content without being overly prescriptive or repetitive. To tackle these issues we designed and built more than fifty component templates which could be mixed and matched within the content management system to create an almost unlimited number of layouts and sequences.

To keep the reading experience manageable we designed a mix of big, high-impact but low-density components which would provide visual waypoints through the narrative, as well as a selection of smaller, more informationally dense components to be used within the major sections of the narrative. We then implemented a hybrid table-of-contents and progress indicator UI that clearly outlines the structure and flow of the narrative while telling the user how far they’ve progressed.

Finally, we implemented a number of custom analytics to track engagement throughout the narrative experience so that we could identify drop off points and adjust the experience accordingly. We also implemented a global kill switch for all of the site’s transitions and animations to ensure a comfortable and accessible reading experience for all users.

Since its launch, the Insulin 100 campaign’s impact continues to grow. Engagement metrics for the site have regularly exceeded the team’s expectations, and our approach to structure and flow of the Discovery narrative has paid off, with minimal drop-off throughout the experience. O/B’s componentized approach to templating has allowed the site’s content to continue to evolve, and as new events are scheduled, new stories and experiences will be added to the site. Most importantly, the campaign sparked an increased interest in the power and impact of research and innovation at U of T, and helped to pave the way for the next 100 years.

Visit the Site