Montreal Gazette

I partnered with Postmedia to redesign their online news products and re-platform their digital infrastructure. The Montreal Gazette was the first in this project, which will eventually encompass all of their publications.

When I started, I found a collection of diluted design decisions in the website’s UI, technical debt that negatively impacted editorial operations, and ‘one-size-fits-all’ templating, which stripped each publication of its independent voice and brand. It was clear the existing platform was ‘designed’ around Postmedia’s internal organization, not the end user’s experience.

My brief was to help the Postmedia product & design teams reorient the sites’ design to:

• Showcase the work their journalists do and give it form, emphasizing reader experience
• Enable the editorial team with faster and more flexible control over the look and feel of the publications
• Create an environment where Postmedia’s journalism is monetized and presents a clear path to subscription

Utilizing a centralized hub hosted on WordPress VIP, the solution leans heavily into WordPress’ Gutenberg editor to enable the team to approach the 140 publications in Postmedia’s network all at once and individually as they need, using a modular library of UX patterns that serves publications of any size or editorial pace.

The block library sits within a hub, and each satellite brand has its distinct visual styles applied downstream in a parent-child relationship at a spoke level. The differences end users see live in the typography, accent colours and spacing that build on the centralized foundation.

It’s realized as comprehensive design system that includes a set of purpose built blocks that extend to every aspect of the editorial experience - from branded site headers to news packages, articles, newsletter signups and editorial recirculation. The design team maintains these blocks - which are then made available to editors to deploy as the news demands inside the CMS.

Part of the project included rebuilding Postmedia’s metro papers branding from the ground up.

The challenge here was to create a design language that felt like a newspaper, could be reconciled with the long standing identities of each of the city papers, and present a modern feeling website that’s been designed to meet reader needs - that is to understand the news of the day at a glance, or delve deeper into an article of interest.

The block system extends to article and pillar pages. The goal with these was to create more accessible, intuitive reader and editor experiences. The current template was very one dimensional with little hierarchy. Our new approached focused on the principle that: the web is (still) primarily, a text based medium.

Users visit news websites to read the news. Our goal was to make it easy for them in every aspect of the site. That means a larger body copy with ample leading, a hierarchy designed for quick scanning and a comfortable typographic measure, on articles, recirculation cards and index and pillar page blocks.