UX Design: YELL

homepage_imac_1.jpg

The Young Entrepreneur Leadership Launchpad is a registered Canadian charity that works with the public education system in Canada to empower the next generation of youth through leadership and entrepreneurship.

Collaborating with graphic designers and web developers, my team of UX designers helped them redesign their entire site to better engage students, potential volunteers and community supporters

 

Research

The first step was to do a heuristic analysis of the current site, from the point of view of a student user to identify pain points in the user flow that were the most important areas to redesign.

Heuristic analysis of the current site.

Heuristic analysis of the current site.

User research was essential to understand our target users--high school students seeing a challenge. We merged organizational research & user research to identify the key trends and values that would become the basis of our new design.

Research plan guiding our user interviews.

Research plan guiding our user interviews.

Organizing key insights from our user research.

Organizing key insights from our user research.

 

Planning

Based on our research, we created two user personas who were the focus of our redesign. Jacob became our primary persona, the student user who is a potential participant for the YELL program. Donna was our secondary persona, an entrepreneur who would be an ideal mentor or guest speaker with the YELL program.

user flow 01.001.jpeg
Storyboards.jpg
 

Design

We designed a completely new site architecture around the most common user flows. I tested our wireframe pages with users, and made iterative adjustments based on test results.

The testing process helped refine our progressive disclosure, making sure that users had the information they needed before proceeding. Because the site was targeting several types of users, each with their own needs, it was essential to thoughtfully plan out the information architecture.

Iteration of one screen in the mobile version.

Iteration of one screen in the mobile version.

High fidelity prototype of the site on mobile.

High fidelity prototype of the site on mobile.

 
Final design of the homepage.

Final design of the homepage.