hubble-long-with-desc

what

Hubble is a mobile application that helps students explore different careers by connecting them with industry professionals and allowing the students to shadow them for a day. I worked on it during my BrainStation UX design diploma course.

time

8 weeks

role

User Research (Interviews, Competitive Analysis/Market Research), Wireframing, Prototyping, User Testing, Branding, UI Design

tools

Sketch, inVision, Adobe Illustrator, Principle


What's the problem here?

University life is hard when you have no clue what career path to pursue.

Did you know that:

44% of students don't know what they are going to do after graduating

75% of students change majors at least once before they graduate.

I had this problem, my friends had this problem, my friend's friends had it too. I thought I have got to do something about this.

 

“How might we help university students acquire career advice from industry professionals to help them find their career paths?”

 

I had 2 goals that I wanted to accomplish:

1. To ease the anxious feelings of university students when reaching out to industry professionals.

2. To allow students to explore different career options related to their field of study. 


What exists in the market?

competitive landscape

LinkedIn vs Shapr

While looking for platforms that help students get connected with other professionals, LinkedIn and Shapr were the 2 most popular. The problem with this was that LinkedIn felt way too intimidating and lacked student support and Shaper felt way too much like Tinder. There's got to be a better way.

 Who is this app for?

University Students.

It's for all the students out there who are struggling to find a career path. Those who can't seem to put their passions into something to create a livelihood. To everyone lost in college, we've all been there. So I wanted to understand the pain points and frustrations of university students. To do this, I interviewed 5 people, 3 university students and 2 fresh graduates.

Say Hello to Isabella, your fellow lost, confused university student.

Capstone-Main-Persona

Persona of Isabella

 Isabella struggles to find information about what she can use her degree for. She thought she wanted to be a teacher but then realized, it might not be for her. Now in the middle of her degree, she is even more lost as to what to do with her life. She then tries to consult industry professionals for help.

Here is her journey:

Experience Map

experience map for Isabella's informational interview journey

Isabella gave me a ton of insight on where the pain points in her journey were to get the information she needed. She just wanted to talk to someone, or even better yet, shadow them through their workday, just to see what it is like. 

I then created a simple task-flow diagram showcasing how my app can help Isabella find someone to shadow with ease.

new doc 2019-07-18 16.37.59_1

task flow diagram of the epic "finding someone to shadow"


The start of something new

From the task flow diagram, I started to ideate the features of the app to help Isabella find the perfect person to shadow. 

new doc 2019-07-14 23.20.32_1

the first sketches I made when ideating features that I used for paper prototyping

new doc 2019-08-28 14.00.56_1

second round of sketches after 1 round of paper prototype user testing


Is this useful for Isabella?

To check if my designs were even intuitive at all, I did 3 rounds of usability testing, 1 with the paper prototypes, and 2 with mid-fidelity wireframes each with 5 participants.

the tasks the participants were asked to perform were:

Explore the careers that are related to your field.
Send a request for a shadowing appointment.
Schedule your appointment with your chosen professional.
  

Round 1

  • 80% of participants were able to complete task 1 with no problem.
  • 100% of participants were able to complete tasks 2 & 3 with no problem.
Explore 3
Messaging 2
Suggested
ProfProfile

Round 2

  • 100% of participants completed all tasks with no problem.
  • Participants found the text too be too small.
  • 50% of participants were confused by the header hierarchy.
Explore 3
Messaging 2
Suggested
ProfProfile

I found a bunch of issues and found lots of places to improve. Iterated on the designs around 4 times to get it to be as intuitive as possible. I was getting close to getting something for Isabella to use. 


The Reveal

Presenting Hubble.

Isabella can now explore professionals that matched her skills, interests and goals in a friendly and encouraging environment.

hubble-explore

She can quickly see an overview of the professional’s background to decide whether its a good match.

hubble-profile

She can request to connect with her chosen industry professional with just a click of a button. She doesn't have to dreadfully reach out to them to only be ~ghosted~ by the other end.

hubble-request

The professional messages Isabella first and she can directly message back showing that they are as eager to meet her as she is to meet them.

hubble-messaging

Gotta look presentable

For the look and feel of hubble, I wanted to go for something fun and playful so that Isabella will not feel intimidated when using the app. I also went with a space theme to capture the "exploring different careers" aspect of the application.

Logo & Wordmark Sketches
Wordmark
Logo

Every product needs it's customers

After finishing the final hi-fi prototype for the app, I started to think about how to market the product to potential users like Isabella. To do this, I created a marketing website for both the desktop and mobile for people to browse and entice them to use hubble.

Marketing website mockup

Now that it's over...

throughout this journey, there were many things that I could have considered but did not have the time and resources to. Since I only had access to the student POV to the problem space, I would like to research more about the industry professional's POV in order to make a hubble version for the professional's side.

What I learned

This project was the biggest UX project I had to date, and I am very proud of what I was able to accomplish. Though I had difficulties, I learned so much. Here are my top highlights:

REMEMBER WHO THIS IS FOR.
Always go back to your "why's" and your "for who's."

DATA DRIVES FEATURES.
Integrate the user's pain points in all your design decisions.

APPROACH PROBLEMS HEADSTRONG.
Face your problems head-on and don't run away from them in times of difficulty of fear. (aka never skip a step in the process)

ENJOY THE JOURNEY. ✌︎

Thanks for getting this far, I know it was a lot. But hey, here's more things to read...

PROS RebatesProject type

PROS ConnectProject type

Jupyter3DProject type

keepfreshCase Study