AOC's Helping Hand​

WEB APP & PROGRAM THAT ENCOURAGES HIGH SCHOOLERS TO EXPLORE THEIR CAREER PATH AND TO CONNECT WITH ALUMNI TO LEARN ABOUT THEIR WORK.

 
helping hand mockup.png

OVERVIEW
 

Student debt is at an all-time high. The college application process is more competitive than ever. Now, we can no longer use our high school career passively without exploring what may shape the next 5-10 years of our lives. These are facts that I wish I had known at the beginning of my high school career. I felt blindsided by the realities of college admissions.

Thus, I founded AOC's Helping Hand, a college & career readiness program and platform that encourages students at my high school, the Academy of the Canyons (AOC), to explore their career path through alumni engagement and proactive skill development. At AOC, many students lack the resources and cultural capital to explore their academic pathway or to develop the necessary networking and technical skills.

 

The bottom line: Students lack the direction & mentorship to properly make decisions about their future. I wanted to change that for good.

ROLE

Founder

UX/UI design, User Research, Site Prototyping, Information Architecture, Social Media Marketing, Content Writing

TEAM
2 CO-FOUNDERS



DURATION
NOVEMBER 2019 - AUGUST 2020

Helping students to discover their path, and what it takes to pursue that path.

THE PROBLEM

The Academy of the Canyons (AOC) is a middle-college high school. As a substitution to enrolling in AP classes, students enroll in classes at our local college, College of the Canyons (COC), which provides a unique opportunity for our students to receive AA degrees upon high school graduation. 

 

This opportunity, however, has developed a cultural norm for students to pursue as many AA degrees as possible, as students compare with their peers in regards to the number of AA degrees that they will earn. Doing so has caused students to overlook college and career readiness altogether, as they look to take as many classes as possible (year-round) in order to maximize their AA degree count, rather than pursuing their passions.  

That fact is an antithesis to what top institutions look for. Colleges demand forward-thinking students with versatile skills and a demonstrated passion for their learning. There is a need for a radically different approach to college readiness at AOC.

 

THE SOLUTION

AOC's Helping Hand is an elective class and a website.

 

Featured on our website are over 50 academic pathways that allow students to explore potential majors, colleges, and careers within those paths.

We have also established an alumni network, with over 150 alumni that have shared their career journey known as their career "Roadmap."

The "Roadmap" includes the milestones toward discovering their career path, relevant experience towards pursuing their pathway in AOC and in college, and what they are currently doing at their college or career.

THE ALUMNI "ROADMAP" FEATURE

The use of our site is enforced in homeroom classes, where students are given allocated time in class to develop self-awareness for their interests and passions, and to explore different career possibilities.

The elective class consists of students in sub-teams that collectively host networking and speaker events that assist students looking to learn more about alumni or potential careers.

UX Process

Keeping students at the center of our design process, my co-founders and I worked closely with faculty to design and develop the website and to write its content. The site's development took place over a period of 2 months (8 weeks), and the elective class's development took place over a period of 6 months (24 weeks).

USER
RESEARCH

RESEARCH ANALYSIS

DESIGN & BUILD

USABILITY TESTING

WEEK 1 TO 3

Identify the problem

Surveying current students

Discuss frustrations with faculty

Conduct research on potential model solutions

WEEK 4 TO 5

Affinity mapping

User needs & pain points

Brand identity

WEEK 6 TO 14

Build sitemap

Design information architecture

Design wireframes in Figma

Develop the site in Wix

WEEK 15 TO 39

Cognitive walkthrough

Heuristic evaluation

Design & content interation (critiqued by faculty)

Receive feedback from users, the district, and the school

Plan site implementation and elective class events

User Flows

Before designing the site in Figma, I began the process with a sitemap to document the user flow and navigation.

Surveying Current Students

We wanted to survey current seniors to determine if there were similar feelings about feeling blindsided by the college admissions process, in addition to lacking insight about pursuing a specific career path. Our survey results demonstrated a demand for a mentorship program for students at my school. 65% of the members of my class agreed that receiving guidance from a mentor in their academic pathway would be beneficial [03], which was a key component to developing my confidence in advancing the idea forward.

Further discussions with select faculty would also re-affirm my perspectives, which gave me the confidence to discuss the importance of pathway exploration in underclassmen advisement classes. 

User Research

Studying potential model solutions
 

ALUMNI NETWORKING

To learn how to properly structure my program, I contacted guidance counselors at Harvard Westlake High School and Loyola High School, two private high schools that contain alumni mentorship programs.
 

SOCIAL & EMOTIONAL LEARNING

Mr. Malkowski, my Social & Emotional Learning teacher, developed a four-year plan for students to gain awareness about their strengths and their interests.

This curriculum would serve to pair with usage of the Helping Hand website, as students learn more about their interests and passions.

Affinity Mapping
 

After thoughtful discussions with current students, faculty, and alumni, I gathered a significant amount of information about recurring pain points that pertain to the career engagement aspect as an AOC student. I also mapped out what our program and our elective class looks like, both of which address these pain points.
 

HH Affinity Map.png

Branding & Identity

Colors & Typography

HEADER & SUBHEADER

Circular STD Black
Circular STD Medium

BODY

Circular STD Book

UI ELEMENTS

#0C3C60

#641532

#012540

#FBF3F3

#FFFFFF

TEXT

#0C3C60

#641532

#FFFFFF

#DED704

Logo Design

My co-founder and I wanted a logo that resembled the feel of our existing school logo in order to create a visual association of our organization and the school. We did so by incorporating the school colors, as well as a spin on our Oak Tree logo, adding roots to symbolize how the career process is "deep-rooted," or multifaceted.

#0C3C60

#641532

ACADEMY OF THE CANYONS
LOGO AND COLORS

helping hand logo draft 3.75.png

PRIMARY LOGO

SECONDARY LOGO

TERTIARY LOGO

3862a0bf3ba45b2aa991a3e00cec4047.png

"DEEP ROOTED"
GRAPHIC

Site Components

BUTTONS

Primary Action ➜

SECONDARY ACTION

Tertiary Action

LABEL

AOC'S HELPING HAND

AVATAR

CARD

ddc8342fcf8dc626369a2770f5c153c2.png

HOME PAGE

Here, users are given an overview of the AOC program, as well as a glimpse into student life and a list of necessary resources for college & career readiness.

CONNECT WITH ALUMNI

We have recruited over 150 alumni to share their career journey with us, and to be willing to provide career or college advice to any AOC student that needs it. This page is secure, and requires a log-in for students to access it. Our web dev team hand-approves each student.

EXPLORE AN ALUMNI'S CAREER JOURNEY

Here is an example of an alumni "roadmap." Each roadmap includes the milestones toward discovering their career path, relevant experience towards pursuing their pathway in AOC and in college, and what they are currently doing at their college or career.

DISCOVER YOUR CAREER PATH

Here, users are given an engaging and visually appealing page that allows them to identify a pathway that they find interesting. This was designed for students to pair their personal passions to potential academic interests, or to simply find what they're interested in.

EXPLORE YOUR CAREER PATH

Each pathway page contains information about potential majors, colleges, and career possibilities within that pathway. The page also includes pieces of advice for pursuing that path in high school, as well as four-year coursework plans.

LIFE AT ACADEMY OF THE CANYONS

These pages are also for prospective parents and students, or for current students. Here, a user can gain an understanding of what student life is like at AOC, including student groups, faculty, and school events.

WHAT DOES MY YEAR LOOK LIKE?

These pages are for prospective parents and students, or for current students. Here, a user can gain an understanding of what they will be doing throughout that grade level.

COC COURSE CATALOG

Here, a user can browse the community college classes that they can take as a student at our school. Classes are divided into our 8 defined pathways, and include course descriptions.

 
 

Marketing Campaign

Ran two-part social media marketing campaign to recruit 150+ Academy alumni to share their career "roadmap," and to spread "hype" among current students about the organization and using the website.

Shared animated videos and informational posts about our organization's mission on Instagram, Facebook, and LinkedIn. Individually reached out to notable alumni based on their line of work or prestigious educational path by making phone calls, sending emails, and direct messaging.

PART I: RECRUITING ALUMNI

3992efee4afcdc29732a2faa7e6c70f2.png
3f57cf59cbb973d307712ef0cdda7c0f.png

PART II: INFORMING CURRENT STUDENTS

d665c9162b839fdbd80047c8a71e48b4.png
fd312cb70880811d8b3e50b20d90658d.png
c8fbb9e14bbb8b39b2e3d07bf19cc44f.png
76ff3bb467d2d916e8cd9ad9f43a274e.png
6ace6bc51e1a57c67b381d18fd2361c9.png
fe9eb466c6a9d72f089a15d29e1b6de8 (1).png
a55884e6cd04247311a78a42bd61a296.png
5129bb076b87d73bd9a6a52d5ece423b.png

Four-Year Course Plans

Crafted over 20 four-year coursework plans for students in each respective pathway or concentration, all of which reflect our brand identity. Coordinated with school counselor on feasibility of ed-plans, as well as all potential combinations of certifications or course sequences.

ARCHITECTURE Academy of the Canyons Ed-P
BUS. ADMIN Academy of the Canyons Ed-Pla
FILMMAKING Academy of the Canyons Ed-Pla
COMPUTER SCIENCE Academy of the Canyons
GRAPHIC DESIGN Academy of the Canyons Ed
MATH & PHYSICS (Engineering) Academy of

Our transformation

 

I truly think that developing the Helping Hand Program has been a culmination of the skills that I have learned up until this point, and I look forward to seeing the program evolve over time.

 

I strongly believe that every student deserves a fair chance to properly navigate the college process and to understand the stakes behind our rapidly-changing economy. As a student that felt blindsided by the college process, my hope is that the Helping Hand program will remain an integral component of the AOC experience, with the hope of ensuring the postsecondary success of the next cohort of students for years to come. 

4,600+

visitors

 

2,600+
unique visitors

THE MEASURABLES

150+

recruited alumni

8

months of planning w/ faculty

What I've learned

1. Simplicity is strength.

As a designer, it is easy to spend time creating intuitive, out-of-the-box designs. However, it is important to remember the "why." The primary goal is to understand the user and their specific needs.

2. Continuously survey consumers about the user journey.

Efforts to continuously monitor customer satisfaction with the website died off very quickly. It is important to stay updated with the user's needs.

3. Don't be afraid to speak up during the design process.

It is important to remember that, even though specific ideas develop strong support, don't be afraid to speak up in opposition if you feel that the idea presents a challenge to the user.