Toronto Life Magazine — Introduction
Shortly after joining St. Joseph Media I started a redesign of Toronto Life’s website. With the team there I helped define, design, and deploy an innovative publishing system that captures the spirit of the 50 year old magazine.
I teamed with the digital product manager and art director to plan, strategize and redesign the website. We started with the content strategy; reorganizing the information architecture, and hierarchy to lay a stronger foundation for the site.
Our goal was to design an experience that is easy to read and navigate, “future proofed”, help advertisers better reach Toronto Life’s audience and apply a refined implementation of the typography and colour while keeping in lock step with the print edition.
As opposed to designing the site 'mobile first', we adopted an 'everything at once' approach, keeping the visual style, content hierarchy and editorial priorities front and centre throughout the process.
On article pages we gave a big boost to the type size and leading, incorporated ledes, and distinct visual styles to call out Q&A's, and other typographical furniture for a story.
Going with a large bold nameplate area on first visit, we also built a variable brand and navigation area that put the primary magazine categories up top with an overflow in an off screen drawer.
Building a modular system
As with any publication it was important to accommodate the way users consume content today.
We built a responsive, modular system, both in design and WordPress to give the editorial team a full suite of tools to tell stories and structure information on the site.
Once deployed, these modules afforded us a great amount of flexibility in presentation on the site; what would usually be five or six very static templates that editors shovelled content into became a flexible design system that could be deployed for most editorial purposes, from the examples here to the award winning best restaurants article.
Want to know more?
Get in touch
email or +01 416 729 2607
- UX & Content Strategy
- Visual & Interaction Design
- Front-End Development