Group 38.jpg

Beholdr - Show More Careers to Teenagers


Beholdr - Show More Careers to Teenagers

UI/UX, San Francisco Unified School District


This is a project I worked on as the design intern in Goodby Silverstein & Partners during summer, 2016 in San Francisco. It was created for San Francisco Unified School District to help high school students recognize potential career path through their current interests.

We worked in team of five, which included art directors, copy writers, developers and me as the designer. We worked together from the beginning of the project, including synthesizing the challenge, brainstorming ideas, and prototyping solutions. I worked on the project for two months.


Empathetic to teenagers

In our team, most of us were college students and new graduates. We could closely relate to high school students' wish and struggle to find the best fitting college major and potential career path. We were passionate to help teenagers discover more career possibilities. 


Problem Brief

Not enough urban teenagers in San Francisco know about potential job pathways in a practical way.



Create a playful mobile interaction that can excite teenagers to explore practical careers based on their interests. 

Our goal was to help high school students engage with self-identifiers and be excited about their future. The product aims to be flexible, interactive, informative, and shareable. Our client provided us with 50 interests that high school students identified with and the careers that the client would like to incorporate into the interaction.

The interests high school students identified:



Our client, Amanda was a high school teacher who was familiar with the characteristics of teenagers. We worked closely with her to help us better understand our target audience. Our team brainstormed and gathered information together. After refining and combining our six initial ideas, we concluded into one solution.

Teenager digital habits we discovered



A mobile responsive website which shows potential career paths based on teenagers' input of interests. Each career category also has a special selfie filter to use and share with friends. 

We decided to make the product a mobile responsive webpage. It is mainly viewed on mobile, since most high school students have phones but not computers. Also considering the limited budget and time constrain, a mobile responsive website required less time and cost to develop. 





Exploring the most engaging interaction for teenagers

We explored different ways to make the interactions interesting and still easy to use. With the same user flow, we came up with different proposals for the select interests page. After discussing and testing, we decided to go with the SWIPE interaction. 




Careers are divided into five categories:



Visual Design

Bright colors to reflect the energy of teenagers and diversity in their identities.

We named our minisite "beholdr" because we hope teenagers can use this interface to become aware of the practical use of their interests and excite them to pursued the career path. We added the slogan "Frame your future" which not only emphasize career discovery but also works well with the special filter feature. 


Early iterations


Final logo



A collaborative process

During this project, I learned to work with developers, art directors, and copywriters. Each one of us had a different role and contributed uniquely based on our own specific skills. The teamwork was a solid prove of "1 + 1 = 3". 


Learned to support my design decisions while communicating with clients

Even though this was an intern project, our client had great trust in our skills. We had a lot of freedom through the process. As the designer on the team, I constantly needed to support my design decisions while presenting to the team and the client. it was a great opportunity to learn to communicate with people with different perspectives.