Shape—Career Discovery App

UX/UI, Branding, App Design, Logo Design, Mentorship Project
Many of Shape's app screens side by side with the app icon on the right side
Overview

Many high school students are uncertain about what to do after graduation. Shape helps them explore potential career paths based on their interests, talents, and skills. The mentor feature lets students see what work might look like in multiple occupations.

Recognition

2024 RGD Student Award, UX Design Honourable Mention

Year

2023

Roles

Research, Ideation, Branding, Logo Design, UX/UI Design

Tools

Figma, Procreate, Illustrator

Mentors

Nathan Ng @ Engine Digital

Scott Strathern @ Engine Digital

Problem

Many high school students are unsure about what to do after graduation

A lot of pressure is put on high school students to decide what their plans are after graduating. This makes them go through uncertainty and doubt as they try to make up their minds about what career options and post-secondary options to pursue.

Objective

Informing, inspiring, and guiding students

To design a mobile app that informs, inspires, and guides high school students in grades 10 to 12 (aged 15 to 18) to make a decision about different career options, post-secondary options, and trades available to them after graduation.

User persona for a grade 11 high school student
User persona for a grade 12 high school student
Research—Roadblock

We weren’t allowed to do primary research interviews—so we didn’t

After doing the initial round of secondary research, I drew up primary interview questions which were all validated by an industry strategist. Then, the unfortunate news came that we weren’t allowed to conduct any primary research interviews. So, we didn’t.

The interview questions were then used for another round of secondary research. This time, I looked at online forums, academic articles, and also asked the questions to myself, and remembered past conversations, in order to find answers for them.

Research—Secondary

Secondary research → 7 key insights → 3 project principles

For the secondary research, I also looked at a lot of statistics, surveys, and polls. Once enough information had been gathered, 7 key insights were pulled from my research.

These key insights were distilled into into 3 project principles that would be the north star for the project.

Key insights pulled from the secondary research
Project principles, written in a student's point of view. They are: guide me, understand me, and inspire me
Research—Competitive & Comparative Audit

Finding gaps and opportunities for improvement in the current market

For the competitive audit, I looked at what was already out there. I found that there were a lot of websites (like MyBlueprint, EducationPlannerBC, EngineerGirl, etc.), but not any apps.

As for the comparative audit, I looked at applications that did a lot of things really well (like Spotify, Duolingo, and Headspace).

For both audits, I looked at what worked and what I liked from what was already out there as well as opportunities and places where there could be improvement.

A competitive audit of the MyBluePrint website, showing screengrabs on the right and notes on the left
A comparative audit of the Headspace app, showing screengrabs on the right and notes on the left
Strategy

Seeing how users will experience the app through the customer journey 5E model

For the strategy part of this project, I created user personas, an empathy map, user journeys, and looked at opportunities by seeing how the two user personas would engage with the app by working through the customer journey 5E’s—entice, enter, engage, exit, and extend.

An empathy map showing what students say, do, their pains, and their gains
Text showing the different opportunities that the app could provide using the 5 E's: entice, enter, engage, exit, extend
Branding

Going through many rounds of ideation to find a name and visual style

Aside from working on the UX/UI of this design, another aspect I personally wanted to improve on was creating a strong brand.

We went through many mood board iterations and I sketched out many logo concepts. The logo design process became more streamlined once a simple name that encapsulated the project had been locked down.

A gif of name brainstorming, logo sketches, and logo process work
Shape's logo which is three rectangular blocks stacked in a staircase with a circle on the top block
Key Screens

Which screens are the most important to design and present?

With the many project stages we went through, and with some bumps and roadblocks along the way, our deadline for the project was looming before us.

There was no time to build out all the screens, and no time to prototype at all, so we evaluated which screens would be the most important to spend our remaining time and energy designing.

Text showing notes for deciding on the key app screens
A gif of app screen sketches
Final Interface

Onboarding

During the onboarding, users are lead through fill-in-the-blank sentences about their interests, goals, and what they want to accomplish. This section informs other parts of the app so that the content would be curated to better fit the user.

Four phone screens. One is the launch screen with the app icon and the others are the onboarding screens
Final Interface

Progress

In Progress - Planning, users see an overview of the path they will be taking to get to their goal. Goal setting and exploring interests is already completed because it was done during onboarding. The journey has already started!

Progress - Quiz Results is where users view results from quizzes taken in the Discovery section.

Two screens of Shape's Progress section. The right screen has a planning timeline and the left screen displays quiz results
Final Interface

Mentors

A big part of the research pointed to how getting advice, talking to people, and having role models and people to look up to was an important part of the decision making process.

In Mentors, users can go through interviews, advice, day in the life, personal insights, and more content from people who work in specific jobs.

Three screens of the Mentors section showing interviews and career advice that users can listen to, watch, or read
Reflection

What’s next?

Moving forward with this project, I would like to create the complete screen set for the app as well as prototype it all and add motion. Additionally, I think it’d be really cool to make a branding package for Shape too.

In the timeframe that I had for this project, I learned a lot. A special thank you to Nathan for all the back and forth collaboration we went through and to Scott for his keen eye on design and critique whenever we had check-ins. This project wouldn’t be what it is without their guidance.

Thank you for making it to the end of this case study!