Thrivity Website
Help high-schoolers to explore and get prepared for careers that don't need college degree.

Overview
As the sole product designer, I oversaw the creation of Thrivity's official website. My responsibilities included conducting research, generating ideas, prototyping, testing, and ultimately launching the site with the assistance of the company's two founders. The website successfully launched on May 1st, 2021.
Role
Product designer
Duration
Jan - May 2021
Team
Together with 2 founders and 1 engineer
Background
Reality check with college
Many people are questioning whether a college degree is truly valuable. With this topic becoming more prevalent in discussions and the media, Thvirity conducted an investigation and the results were surprising.
​
-
30% is the first-year college dropout rate in the U.S.
-
$32,731 is the average student loan debt in the U.S.
Decision on Thrivity
Recently, we've had informal discussions with working professionals who don't possess a college degree but have promising careers. As a result, we have decided to create a website to showcase their success.
-
Educate people about non-degree careers
-
Provide information and guidance for career success
Market Research
In the career services market, there are numerous providers. We took the initiative to compile a list of these providers and grouped them into four distinct categories. By examining their websites and other available information, we evaluated their business models and website designs. Although each provider has a unique focus, none of them are considered our direct competition.

Customer Research
One major challenge for Thrivity is our lack of experience with high-school students. We are curious about their daily lives, including who influences their career choices and what factors are most important to them when considering future careers. To address these questions, we are conducting customer research.
Questionnaire
We have distributed over 100 questionnaires to high school students across the country. The survey consists of 14 questions and should take approximately 10 minutes to complete. The questions cover topics such as their personal information, their thoughts on obtaining a college degree, where they obtain career information, and their expectations for their future careers.
Interview
We conducted interviews with eight individuals who fall into the categories of potential users. Our aim was to gain insight into their expectations for future careers and their impressions of non-degree careers.:​
-
High-schoolers
-
Career practitioners
Customer profile
We have conducted interviews with high school students from various backgrounds and have come to the realization that not all of them fit our business model. After careful consideration, we have decided to focus on only one type of customer in this stage. To better understand this particular customer, we have created a customer profile.

Finding 1: big impression gap
After the interview, we found there is a big impression gap between high schoolers and those practitioners.

Finding 2: No clear goal for future career
Based on customer research, we discovered that many of our potential users are uncertain about their future goals. However, when asked targeted questions, they are able to provide clear responses.

Finding 3: Clear expectations for career
After conducting the interview, it became clear that there is a significant difference in perception between high school students and professionals in the field.
.png)
Information Architect
Goals
After analyzing the research findings and aligning them with our business objectives, we have established the website's goals.
Educate
Tackle with impression gap
Educate people on the promising future of non-degree careers
Explore
Tackle with career confusion
Provide people with tools to explore their interests and careers
Prepare
Get ready for future
​
Provide resources and information to help people get ready
Main structure
Once we established the goals for our website, we formed a preliminary notion of the primary sections for it.
Education
Explore
Prepare

Career profile section
During our interview, we discovered that there is a significant gap in understanding between high school students and professionals in this field. It is important for us to bridge this gap and provide accurate and engaging career profiles to help students make informed decisions about their future careers. To ensure the accuracy of our information, we rely on trusted sources such as The Occupational Outlook Handbook and O*NET OnLine, which are both owned by the government..

Information to break misconception
Information related to self-interests
Insights section
After our interview, we discovered that there is a significant difference in perception between high school students and professionals in the field. It's crucial to address this impression gap and find ways to bridge it for better communication and understanding.

Match section
Regarding the Match Section, we have some suggestions for what it could entail:
-
Personality Test
-
Job Quality Test
-
Career Assessment
Complete sitemap
After discussing which content should be included in each section, we have now assigned individual sections. To provide our users with a seamless educational, explorative, and preparatory journey, we require a simple interactive map to integrate into our website.

Prototyping
Once the basic infrastructure was established, I created a low-fidelity prototype to gain a better understanding of the design of each section and how they relate to one another.

Testing
In order to ensure that our website fulfills the expectations of our users and to receive feedback, we conducted a test with 15 high school students. I led the test while my two colleagues documented the process.
​
-
Time frame: 45 mins to 1 hour
-
Format
-
Give the prototype to users to freely explore through Google Meet
-
Ask users to speak their mind
-
Ask users certain questions
-
Ask users to rate each page
-
Suggestions and recommendations
-
​
-
Focused sections
-
Content-wise
-
Career browsing: The filters
-
Insight: Useful information for local careers
-
Career profile: Understandability of income potential, job growth, and education cost parts
-
-
Function
-
Location: Importance of local career information
-
Compare function: Usefulness and frequency of use
-
Guide: Acceptance of a guide be delivered to E-mail
-
-
Test result
We have compiled a summary of the sections that are frequently referenced during the testing process..

Reiterating low-fi prototype V2
Based on the analysis, I have created a second version of a low-fidelity prototype to tackle those issues. Some major changes:
-
Guide: Delete the Guide for this version
-
Compare: Make compare a floating icon across the whole site
-
Location: Add location requests across the site
-
Career browsing filters: Add income potential and job growth into filters
Reality Check and Edge Cases
Reality check
It's important to keep in mind that our design is based on an ideal scenario where we have access to all the necessary data. However, since we're sourcing some of our data from government career resources portals such as OOH and ONET, there may be cases where certain data is unavailable to us. To ensure that our design is accurately supported by the available data, we'll need to verify its accuracy through a reality check..

Reiterating low-fi prototype V3
Following a reality check, I made revisions to my design and created a low-fidelity prototype of version 3. This iteration accurately reflects Thrivity's business requirements and incorporates feedback from users. Additionally, all available data supports the changes made in this version..
Branding and UI
Color palette
I use the colors from our logo for the website's color palette to ensure that they complement each other.er..

High-fi prototype
In order to try out various color options, I created some sample pages for testing purposes. Ultimately, we settled on using the color green as it is a lively hue that captures the essence of high schoolers, while also being sophisticated enough to represent Thrivity's business.s.

Launch
Development
I gave the engineer the high-fidelity prototype and held multiple development meetings to create the site. During development, I made some adjustments as the original design was either not time-efficient or not technically feasible. Through collaboration, we completed the site development in just one month..
Launch
Our MVP version was launched on May 1st, 2021 after a few months of development cycle.
The design: Explore careers
Level 1: Free explore

Provide free exploration experience by inviting customers to search for careers.
Provide one layer of guidance for people to better free explore.
Level 2: Guided explore

Career browsing:
Add important filters to potential customers to provide a more guided exploration experience.

Compare:
​
Allow users to add a few careers to compare their main attributes.
Level 3: Active explore


Match section:
​
Let users go through 10 test questions. And recommend three careers to users.
The design: Educate careers
Education about different careers

Career profile:
​
Provided detailed information about each career: basic information, career future, pathway, etc.
Education about local insights

Insights page:
​
Provide primary career data regarding different states, like median income, annual job opening, income growth, popular industry, etc.
The design: Prepare for careers
Information of career pathway

Career profile:
Provide information about related schools, associations, certificates, educational costs, etc.
Next step: community
Unfortunately, we were unable to incorporate a community function at this time due to time and workload limitations. However, it is crucial to have a community to better equip our potential customers for non-college careers. Here are some community concepts that we have brainstormed:
​
-
Invite those who are working in the field to be mentors for potential customers.
-
Have a community of the same career interests.
-
Have a social media section to let customers share their career updates.