Building Trust Through Design in a Pandemic: Redesign of Healthing

Thumbnail
Thumbnail

How might we deliver a modern, scalable health news site within 3 months to provide Canadians with credible health information?

Team: Product Manager, Product Owner, Development Team, QA, Client Design Lead and Client Poduct Owner

Timeline: 3 months

Timeline: 3 months

Final Deliverables: component library, mockups, prototype

In 2021, as misinformation spread faster than the virus itself, my team was tasked with transforming an outdated health news website into a modern, trustworthy resource for millions of Canadians.

And we only have 3 months to design, build and launch it.

Healthing is a health news website under Postmedia, one of Canada's largest media corporations. Their mission was clear: become "a premier destination to inform, educate, and connect Canadians to healthcare news and resources, curated by disease."

But the reality didn't match the ambition. The existing website was outdated, and not responsive for most Canadians accessed health information on the go.

Impact Delivered:

  • Successfully launched a modern, trustworthy health resource during a critical time.

  • Created a scalable foundation that supports future growth

  • Designed with business objectives in mind (various ad slots to generate revenue)

  • Positioned Healthing to compete with other health-oriented websites

To anchor the design in purpose, I initiated the project by collaborating with stakeholders to understand the fundamental goals and user problems we needed to solve.

Who is it for?

Primary Users:

Canadians Seeking Health Information During the pandemic, our audience needed quick access to credible, trustworthy health news. They were navigating on mobile devices, looking for specific conditions or general wellness information, and needed to distinguish between editorial content and sponsored articles.

Collaborators

The Postmedia Design Lead: Working simultaneously on the parent company's brand guidelines. I needed to align with their vision while creating components that worked for Healthing's specific needs.

The Business Stakeholders at Postmedia: Focused on maintaining brand consistency across properties, generating revenue, and meeting the non-negotiable September launch date.

The Development Team: Building in parallel with my design work. They needed precise specifications, comprehensive guidelines, and realistic expectations about what could be delivered in each sprint.

Healthing's website wasn't just outdated—it was actively working against its mission to be a trusted health resource.

Three critical problems emerged:

1. No Site Structure

Pages were inconsistent, especially sponsored content. Since sponsored content generated significant revenue, the lack of standardization created both user confusion and missed business opportunities.

2. Cumbersome Navigation

Excessive nested menu elements made finding information difficult, particularly on mobile devices. When users are searching for health information, every extra tap is a barrier.

3. Not Responsive or Scalable

The website didn't align with Postmedia's new brand guidelines.The lack of mobile optimization meant the site failed most Canadians who accessed it on their phones.

Phase 1: Rapid Alignment (Sprint 0)

What I Did:

  • Worked collaboratively across client and project teams to understand primary objectives

  • Identified the real priority: create a scalable structure for future growth

This was a turning point of the project

Phase 2: Foundation Building (Sprint 1)

The Challenge:

The Postmedia design lead was still finalizing brand guidelines, so I was designing without final styling. This created uncertainty about which elements would change.

My Solution:

  • Focused on information architecture and page structure first

  • Set clear expectations with stakeholders about what will be ready when the component library arrives

  • This "structural first, styling second" approach meant templates were prepared to go once components were finalized

Phase 3: Component Library Development

What I Created: A comprehensive component library based on Postmedia's brand guidelines and technical platform capabilities.

The library needed to:

  • Work seamlessly on mobile and desktop

  • Support both editorial and sponsored content

  • Be flexible enough for future updates

  • Align with the parent company's design system

Phase 1: Rapid Alignment (Sprint 0)

What I Did:

  • Worked collaboratively across client and project teams to understand primary objectives

  • Identified the real priority: create a scalable structure for future growth

This was a turning point of the project

Phase 2: Foundation Building (Sprint 1)

The Challenge:

The Postmedia design lead was still finalizing brand guidelines, so I was designing without final styling. This created uncertainty about which elements would change.

My Solution:

  • Focused on information architecture and page structure first

  • Set clear expectations with stakeholders about what will be ready when the component library arrives

  • This "structural first, styling second" approach meant templates were prepared to go once components were finalized

Phase 3: Component Library Development

What I Created: A comprehensive component library based on Postmedia's brand guidelines and technical platform capabilities.

The library needed to:

  • Work seamlessly on mobile and desktop

  • Support both editorial and sponsored content

  • Be flexible enough for future updates

  • Align with the parent company's design system

Phase 1: Rapid Alignment (Sprint 0)

What I Did:

  • Worked collaboratively across client and project teams to understand primary objectives

  • Identified the real priority: create a scalable structure for future growth

This was a turning point of the project

Phase 2: Foundation Building (Sprint 1)

The Challenge:

The Postmedia design lead was still finalizing brand guidelines, so I was designing without final styling. This created uncertainty about which elements would change.

My Solution:

  • Focused on information architecture and page structure first

  • Set clear expectations with stakeholders about what will be ready when the component library arrives

  • This "structural first, styling second" approach meant templates were prepared to go once components were finalized

Phase 3: Component Library Development

What I Created: A comprehensive component library based on Postmedia's brand guidelines and technical platform capabilities.

The library needed to:

  • Work seamlessly on mobile and desktop

  • Support both editorial and sponsored content

  • Be flexible enough for future updates

  • Align with the parent company's design system

Here are my design iterations and component library.

Unfortunately, there were no user tests due to the timeline, so the requirements relied heavily on business requirements

The Breakthrough: Refocusing on the right problem first

The turning point came at the end of Sprint 0 when I realized we'd wasted the entire sprint. I was focusing on solving the navigation while developers needed to tackle the EBIX integration work with medical articles.

I raised this misalignment and, through conversation with PO and developers, we aligned on priorities and improved communication; the entire project shifted. Design and development collaboration became smoother.

Handoffs improved. We started hitting our stride.

While working on the final screens,I worked closely with the development team throughout, including:

  • Setting handoff expectations upfront

  • Adding design logic documentation (not just visual specs)

  • Reviewing builds in QA to catch inconsistencies early

  • Being available for quick clarifications

The successful team collaboration led us to launch the redesigned Healthing website in September 2021—on schedule, despite all the challenges.


What We Delivered:

1. A Modern, Scalable Component Library

2. Improved Site Structure

  • Standardized sponsored content widgets for seamless user experience (and better revenue opportunities)

  • Clearer distinction between editorial and sponsored content

  • Consistent page templates across medical articles, the homepage, and editorial content

3. Streamlined Navigation

4. Responsive, Mobile-First Design

5. Better Ebix Database Integration

Project Impact

For Healthing:

  • Successfully launched a modern, trustworthy health resource during a critical time when athe udience needed reliable health information

  • Created a scalable foundation that supports future growth

  • Designed with business objectives in mind (various ad slots to generate revenue)

  • Positioned Healthing to compete with other health-oriented websites

For the Business:

  • As the first designer in the Toronto office to take on a client project, I facilitated important discussions and raised questions that benefited the entire process

  • Fostered closer relationships with in-house dev and QA teams

  • Developed better handoff processes that the team could use on future projects

For Personal Growth:

  • Learned to design collaboratively with developers in parallel cycles

  • Developed skills in stakeholder management across multiple organizations

  • Built confidence in advocating for process improvements mid-project

Next Step:

This project taught me that great design isn't just about the final artifact—it's about the process that creates it. When you're working within impossible constraints, adaptability, collaboration, and process thinking matter more than perfection.

I entered this project as the first designer in our Toronto office, taking on a client. I left it with stronger relationships, better processes, and the confidence to speak up when something isn't working, especially when the timeline is tight and the pressure is high.

What I Learned:

1. Early Team Alignment Is Critical

Getting everyone aligned during discovery prevents scope ambiguity. For future projects, I'd advocate for:

  • A design brief from sales, including what the client currently has (research, design inspirations, style guide)

  • Business objectives and target users are clearly documented

  • A checklist from design tickets to guide the review process

2. Process Design Matters As Much As Product Design

The breakthrough moment wasn't a design decision but a process improvement. When constraints are tight, the meta-work of designing how I work becomes just as important as the work itself.

more creations

Logo

Let's create something extraordinary together.

Logo

Copyright and design by Jane

more creations

Logo

Let's create something extraordinary together.

Logo

Copyright and design by Jane

Read more at

Jane Li

Jane is an UX designer with 6+ years of experience working in various companies. After realizing design is only a small part of the big picture, she now shares visual ideas and personal stories to help designers recognize their worth beyond the pixels.

Currently working on improving the bank's CRM (Salesforce) platform to enhance frontline employee experiences across Canada.

Let's create the next chapter of your stories togehter

Copyright and design by Jane

more creations

Logo

Let's create something extraordinary together.

Logo

Copyright and design by Jane