Toronto Life Homepage Redesign
I had worked on the previous design for Toronto Life while Creative Director at SJM. Over time the print edition of the magazine had evolved its presentation where the website had not. I joined SJM to rethink the homepage and article templates to bring them more inline with the graphic design of the magazine and enhance curation opportunities for editors.
Keep what works, fix what doesn’t
The last redesign of Toronto Life had left it in a good place. Its homepage averaged 100,000 unique visitors per month, making it the most popular destination for its parent company.
Teaming with the editorial team and digital product manager, we identified content types and article taxonomies that editorial wanted to promote reviewed the requirements and strategy product had developed.
To give editorial the flexibility they needed, we adopted a modular ‘content block’ strategy for managing the pillar pages. This allowed us to design not only the homepage, but also to include pillar (or sub-categories) as well. The blocks are groups of content cards customized for different sections or themes or subject matter with titles and sub-navigation where relevant.
The top stories block with a portrait image. The magazine produces a lot of portrait images due to its format, when cropped they often lose their impact. This block accommodates a portrait hero.
The top stories block with a landscape image. In instances where the hero image is landscape, this block is to be used. The smaller cards can also accommodate portrait images and text only presentations where an image isn’t relevant (to avoid stock-y images).
Standard category blocks with sub-navigation. These are for the primary sections or ‘pillars’ in the magazine. They come with sub-navigation and can be sponsored.
A simple numbered list block, primarily used to promote most popular articles but can be packaged for other purposes.
The ‘Big Hero’ block using a full screen ‘door’ for immersive, visually engaging articles or long reads. The ‘door’ can also be used to promote a single article at the top of the page.
Editorial also wanted the ability to ‘package’ up entire blocks for promotions, series or events. The solution was to provide space for a heading and a coloured background to isolate the content.
The magazine also does regular special interest one-off publications annually, for example - “Best Of...” or “Reasons To Love”. This block is an intro to those series and can accommodate special thumbnails for numbering or flair.
We also designed a shop-able block. This basically has simple article cards coupled with a ‘buy-button’. They can be used for one-off sponsored blocks or act as teases for Gift Guides.
Toronto Life maintains an ‘Insider’ program that features special events, articles and series for members. As opposed to a more marketing focus, this carries articles promoting tied to insider content.
