Matthew Warland
St. Joseph Media
Design Direction

Toronto Life Magazine

Toronto Life is the city’s preeminent publication for food, real estate and cultural news. In the lead-up to it’s 50th anniversary, the publisher initiated a redesign of the website to help it connect with its printed magazine as a brand, and establish itself as a modern digital publication.

I teamed with the digital product manager and print art director to plan, strategize and redesign the website. Collaborating with stakeholders in advertising, art, technology, and editorial, my focus was to bring the quality of the magazine to the overall experience online.

While working as creative director at SJM, my team and I also implemented constant improvements to torontolife.com and launched special projects like Neighbourhood Rankings and Best Restaraunts.

Toronto Life Homepage

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.

Toronto Life Homepage Toronto Life Homepage
Toronto Life Article

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.

Toronto Life Article
Toronto Life Article Toronto Life Article

It was important to accommodate the way users consume content today. We built a responsive, modular system to give the editorial team a full suite of tools to tell stories and structure information on the site.

Toronto Life Modules
Toronto Life Modules
Toronto Life Modules

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.

Toronto Life Best Of Everything
Toronto Life Best Of Everything
Toronto Life Special Door
Toronto Life Topical Article
Toronto Life Topical Article
Toronto Life Neighbourhoods
Toronto Life Neighbourhoods
Toronto Life Neighbourhoods Toronto Life Neighbourhoods

I Worked On

  • Product strategy & planning
  • Information architecture & wireframes
  • Visual design, & design system
  • Design direction of the website

The Team