top of page
Frame 3 (1).png

CBC Radio Canada -Proposed Redesign

The Problem:

The CBC Radio Canada website could improve in certain areas including usability, navigation, targeting, and look and feel. 

​

The Solution:
We have proposed a new desktop and mobile version of the government site using UX and UI capabilities.

My Roles

 

UX Researcher, and UI Designer 

​

Tools Used

 Figma, Google Suite, InVision

01 User Research

Testing notes.png

Usability Test Notes

We conducted usability tests on the current CBC Radio Canada Website to identify the major pain points:

  • Too much information 

  • The colour of the site is not consistent 

  • There are too many menu items 

  • The logistics are confusing for the user

02 Ideation

Moodboard

Creating the mood board allowed the team to know what UI elements we would like to implement in the website redesign and sparked the creativity to start the process.

Screen Shot 2022-09-27 at 3.57.06 PM.png
Group 548.png

Annotated Usability and Heuristic Issues

Some of the repeating issues we found while conducting usability testing were: 

  • Found the design to be inconsistent 

  • Too much information to be retained on a single page 

  • The design is not minimalistic and very crowded 

Card Sorting

We conducted the activity Card Sorting to organize the site content that suits the user's needs and how they interact with the product.

Card Structure for Sitemap.png

Sitemap

Creating a Sitemap allowed us to visualize all of the pages to be able to start the process of designing the navigation.

Sitemap v2.png

03 Prototyping

UI Style Guide - CBC Radio.png

Style Guide

Creating a style guide allowed us to develop a cohesive design and stay on brand when making high-fidelity prototypes for both the desktop and mobile versions of the website. 

Low-Fidelity Wireframes

Creating the low-fidelity wireframes helped to visualize the layout of the site and to start usability testing to ensure the flow and usability of the site with the users

iPhone 13.png
iMac 24 inch.png
iPhone 13.png
iMac 24 inch.png

High-Fidelity Wireframes

After conducting usability testing on wireframes, we created the high-fidelity version and conducted more tests. The only change needed was a UI element on slider images. That change was made and the prototype was complete for the scope of this project. In the future, I hope to continue testing and building out the rest of the pages.

bottom of page