OPMC

OPMC

Ontario Project Management Competition Website Design

Ontario Project Management Competition Website Design

8 Weeks

8 Weeks

2023

2023

My Role

My Role

My Role

UX/UI Designer, Freelance Framer Designer.

Client

Client

Client

Ontario Project Management Competition

Team

Team

Team

3 x UX Designer

2 x PM

Tools

Tools

Tools

Figma, Miro, Framer, Google Analytics, Microsoft Teams

Problem

Problem

Problem

Create a standalone website for the Ontario Project Management Competition (OPMC) to build trust and attract participants, project managers, sponsors, and speakers, moving from its single page on the PMI website.

Solution

Solution

Solution

I focused on building trust elements, ensuring a user-friendly design, telling OPMC's story, and creating an aesthetically engaging website. These goals guided the redesign to enhance credibility, improve navigation, communicate the mission, and provide a visually appealing experience.

Impact

Impact

Impact

The average engagement time is 1 minute 32 seconds.
It gained 3540+ new users in a month.
The exit rate is less than 25%.

View Live Site

View Live Site

The Home Page

The Home Page

KEY FEATURES:

Sponsor Grid: Builds trust and credibility.
Image + Text Grid: Simplifies understanding of the competition, making it easy to read and comprehend.
Multiple Registration Buttons: Increases visibility and aids user decision-making.
Q&A Format: Presents information as answers to common questions for easy skimming.

KEY FEATURES:

Sponsor Grid: Builds trust and credibility.
Image + Text Grid: Simplifies understanding of the competition, making it easy to read and comprehend.
Multiple Registration Buttons: Increases visibility and aids user decision-making.
Q&A Format: Presents information as answers to common questions for easy skimming.

The Competition Page

The Competition Page

KEY FEATURES:

Information Blocks: Simplify competition details for quick understanding.

Minimal Text: Engage users with concise content.

Date Timeline: Smoothly presents competition information for clarity on dates and events.

The About Page

The About Page

KEY FEATURES:

Story by Timeline: Engagingly explains the competition's origin.

Image Grid: Connects users with founders and organizers, fostering trust.

Previous Winner Carousel: Demonstrates competition credibility over time.

KEY FEATURES:

Story by Timeline: Engagingly explains the competition's origin.

Image Grid: Connects users with founders and organizers, fostering trust.

Previous Winner Carousel: Demonstrates competition credibility over time.

My Design Process

My Design Process

The design process was iterative and included questions to explain the chosen approach. Please scroll down for a clear explanation of each step and the reasoning behind it.

Stakeholder Meeting

Stakeholder Meeting

Capturing business goals, user needs & technical constraints

In the first meeting, I focused on understanding the needs of users and stakeholders. I gained valuable insights for the project's start through targeted questions and project management skills.

Key Learnings:

  1. Establish OPMC's unique identity with a full website.

  2. Ensure the website is user-friendly.

  3. Simplify competition information for easy comprehension.

  4. Reduce friction in the registration process.

Capturing business goals, user needs & technical constraints

In the first meeting, I focused on understanding the needs of users and stakeholders. I gained valuable insights for the project's start through targeted questions and project management skills.

Key Learnings:

  1. Establish OPMC's unique identity with a full website.

  2. Ensure the website is user-friendly.

  3. Simplify competition information for easy comprehension.

  4. Reduce friction in the registration process.

Old Single Page Website

Old Single Page Website

Since 2016, the old website was just a single page on the PMI (Project Management Insitute) site, overloaded with information and lacking navigation.


I broke down the information to make it more engaging and trustworthy.

Inspirational Websites, Not Competitors

Inspirational Websites, Not Competitors

I drew inspiration from the Wise (left side) and DesignX (right side) websites. They effectively tell the competition's story and are easy to understand. I incorporated their positive aspects that aligned with our goals.

Persona Creation from Interview Insights

Persona Creation from Interview Insights

Information Architecure

Information Architecure

Conducting card sorting sessions provided valuable insights into user perspectives and preferences, leading to iterative improvements in the Information Architecture (IA).

Key takeaway:

Always seek user feedback as what works for oneself may not work for others, highlighting the importance of incorporating user insights into design decisions.

Wireframes

Wireframes

Learning Outcomes from Wireframes and Usability Testing

  1. Add a brief video below the banner to quickly explain the competition.

  2. Place event dates near action points for each event.

  3. Use multiple similar buttons for easier navigation.

  4. Use cards to condense event information and enhance engagement.

  5. Consolidated multiple questions into concise answers through user testing.

  6. Split registration into competition and conference sections for easier navigation.

The Impact

The Impact

The Average Engagement Time is 1 minute 32 seconds.


The Website gained 3540+ new users in a Month.


The Exit Rate is less than 25%.