top of page
Frame 211.png

Wave: Mobile App Platform

UX/UI Design | December 2021 - May 2022

Connect with your peers.
Launch or find a project. See your impact.

Working with the National YMCA and National DFA, we developed a mobile app platform facilitating connections between youth and their peers, allowing them to launch or join community projects by forming partnerships with local organizations and mentors, and witnessing their personal impact in their community.

Team Members: Chelsea Tang, Avani Guduri, Thomas Kang, Allison Zhang, Sharon Xue

Tools & Skills

Figma
User Research
User Testing
Wireframing
Prototyping
Storyboarding

Project Role: Team Lead & DFA Project Manager 

Problem Overview

Primary Problem

How can we transform youth (middle and high school students) interested in creating impact in our community into confident and community-centered changemakers, providing them with the resources to do so?

Final Solution

A mobile platform that facilitates connections between youth and their peers, allowing them to launch or join projects they’re interested in with partnerships with organizations, mentors, and professionals while seeing their tangible impact in their community. (Download Overview PDF)

Frame 14.png
User Research

User Research 

Conducting Primary Research

To better understand the needs of target users (middle and high school students) and the current situation regarding successful youth activities, I conducted interviews with 6 YMCA Directors of Youth Programming across main US branches.

Group 47 (1).png

Primary Research Interviews 
Local YMCA Staff
Directors of Youth Programming
Youth involved with changemaking
National YMCA Coordinators
Secondary Research
Articles and Internet sources

Purpose 
This research allowed me to pinpoint frequent issues YMCA branches have with encouraging youth to be active in their community and why some remain more popular. I also strived to reach out to branches with
different dynamics including partnerships with schools versus independently run as well as branches focused on helping kids at risk and those with unique programs targeting youth in government or STEAM. ​

Group 4986 (2).png

Top Questions

  • What percentage of people discontinue participating in programs, and what are some main reasons for leaving?

  • How does the YMCA currently recruit new members? How do youth primarily learn about new programs?

  • What are the goals of people who go to the YMCA, and what existing (youth) changemaker programs are there?

  • What are the primary goals of people who go to the YMCA? What areas do students tend to gravitate towards?

Narrowing the Problem Space

Based on my primary and secondary research including numerous articles and blogs discussing youth activism in communities, I was able to identify large overarching issues and narrow them down to smaller subspaces shown below. From these subspaces, we were able to determine 3 main issues to address in our solution. 

Group 4999 (1).png

1

Key Research Insights

Youth tend to be more successful and invested when they work with other peers on topics of their choice, but these are not easily accessible.

2

Group 4982.png

Youth want and benefit from a lack of adult intervention but lack the resources and guidance to develop their own programs.

3

Seeing the impact of their efforts and being provided with positive feedback encourages continued participation among youth.

Project Goals

Group 4967.png

How can we help students connect with peers with similar interests in an accessible way and provide them with adequate resources to launch their own community projects?

How can we provide resources and guidance for students to develop their own programs with minimal adult intervention, giving them a sense of ownership?

How can we inform students about the community efforts of their peers, encourage participation, and provide positive reinforcement for their hard work?

Synthesizing Stakeholders & User Personas

To understand who this project impacts, I outlined levels of stakeholders and developed distinct
personas to better consider different stakeholders' pain points and goals. 

Group 4985 (3).png
Frame (19).png
Frame (20).png
Frame (21).png
Frame (23).png
Design Process

Design Process

Ideation

After conducting this user research, we began brainstorming potential solutions that would address our 3 challenges and
through affinity diagramming and crazy eights, and narrowed down 5 top solutions.

Group 4997 (2).png

One-day Community Program/ Event 
Implemented to connect youth to non-profits where community organizations present

Podcast Website
Students post videos about changemaking on a variety of topics, motivating others to join the efforts

Profile Matching App 
Connect youth with specific interests and various local community organizations

Digital Feedback App 
Connect youth with specific interests and various local organizations

Newsletters
Educate youth on social issues to incite them to become changemakers and offer recognition








Formal and professional apps currently exist for young professionals looking for careers such as LinkedIn and Handshake, however not many apps foster a platform for younger students to connect with others to pursue their passions more casually. In order to develop a prototype that would be remotely accessible and appealing to a large number of technologically active youth, we decided to design a mobile networking platform. The YMCA currently primarily relies on word of mouth to advertise, causing difficulty in finding new youth to participate since Covid caused many people to drop programs. An app would allow for advertising on social media and other online avenues to find youth.

We consolidated concepts in other solutions including digital feedback where students can review projects and learn about different ongoing community endeavors to join as well as the newsletter idea of recognition and impact where youth can see the impact they make in their community and publicize their efforts through posting. 

Group 4998.png

Why this solution? 

Competitor Research 
 

Before designing, we began analyzing the UI of different networking platforms (Handshake, Facebook, Twitter, Tinder, LinkedIn, Instagram), identifying patterns and features of different sites to incorporate into our own app design, focusing on a more appealing aesthetic, casual yet professional, user experience targetted at a young audience. 

Group 4986 (1).png
Group 113 (3).png

Feed Experiences

Onboarding Experiences

Connecting People

Profile

Key takeaways

  • ​Onboarding experiences should remain short and easy to complete (allow for skipping questions, indicate progress, have pre-made options to select, collect personalized interests) 

  • Include filters for searching for projects to match users (including by interest, organization, time span, distance, school, and more)

  • Allow for customization of project and member pages 

  • Allow for organizations to connect with peers and peers to connect with other peers and groups

  • Incorporate heavy use of visuals into the design, especially with one's feed

Wireframing

Before diving into high-fidelity mockups, I designed wireframes for the different pages of the platform to understand the overarching user flow and start to fill in detailed aspects of the experience. 

Frame 7 (10).png

User Testing

I helped conduct user testing sessions where we received feedback from youth participating in YMCA programs regarding our wireframes, allowing us to iterate for future prototypes. The feedback we received included: 

  • Better align project categories with primary youth interests so we created a survey to determine popular topics for youth

  • Allow for youth to post updates about projects and be motivated by viewing others' project updates 

  • Allow for youth to find organizations and peers based on distance

  • Adding chatting features where peers can speak to members of projects before joining and creating project groups 

  • Include public or private components to one's profile

Difficulties 

This step proved to be really difficult because it was our first time interviewing younger students and there were obstacles with waivers as well as finding students that were incentivized enough to agree to an interview. We also discovered the gained insight from youth from surveys was very beneficial.

Design Style Guide 

To determine the visual language of app, we began by exploring existing color palettes for children’s applications. Most of the existing platforms are targeted for more serious professional connections and lack a fun exploration element. We wanted our platform to exude friendliness, where anyone can easily find others so wanted to use bright colors and organic shapes.

Group 4999.png

I found creating a design system to be an exciting experience because in the past for companies I've followed their existing brand guidelines and visual language. Creating a strict style guide also allowed for our designs to appear cohesive.

Frame 7 (13).png
Final Prototype

Final Prototype

Onboarding Process

Quick, short process to create a basic profile for the user, allowing them to pick their interests for project matching purposes (most other questions are optional). Their interests are also displayed on their profile in order to facilitate peer to peer relationships and can be edited later on their profiles. 

Group 89.png
Group 94.png

Explore & Join Projects

Based on the user's interests, appropriate projects are recommended on the project page, and can also be filtered by the user. Each project and organization also have detailed pages for users to read about members, description, and logistical information (skills needed, community partner, founding date and location).

Projects Page

Filters

Project Page

Org Page

Connect with Peers & Orgs

Group 105.png

Networking Page

Profile

Chat

Chat

Users can connect with peers who have similar interests or are working on projects they wish to learn more about as well as organizations they might want to launch projects with or be a member of. Chat features allow easy communication between project groups and organizations. 

See Your Impact 

The home feed will display project updates for youth to see the effect their project, and others, on the community, inspiring and motivating each other. Features like saving, commenting, and liking encourage positive feedback for their hard work. Youth are also able to easily launch projects.

Group 112.png

Home Feed

Launch a project Process

Full Prototype Walkthrough (with audio)

Next Steps

Next Steps

Implementation Guide 

Student Feedback 

Group 4987.png

“Counter[s] performative activism that's prevalent on social media by providing a place for people to funnel their energy and passion to make real change.”
YMCA Student 8th Grade

“I would actually like to use this app. It’s so hard to find projects and opportunities for younger students.”
Youth in Government Student 7th grade

“This seems like a great way to meet new people in the community and gain connections”
YMCA Student Ambassador 8th grade

Next Steps

Measures of Success

Step One
Conduct more user testing for our final prototype with target students
Step Two
Develop a functional prototype through programming
Step Three
Discuss implementation guide details with YMCA staff members

Number of users and connections
How many peers, professionals and mentors have we connected?
Number of projects launched

How many new projects have been initiated to improve the community?
Impact of Application

Meaningfulness of projects and networking is determined through surveys and feedback from users

Undergraduate Grant Application 

This semester, I applied for an undergraduate grant to continue developing this project to fruition. This entails iterating on the prototype by interviewing more students to validate design concepts and conducting user testing to validate design decisions while compensating research participants. I also plan to conduct more interviews with YMCA coordinators for feasibility and implementation and program a final functional application to present to the organization. 

Group 4988.png

Reflection

Through this project, I appreciated being able to collaborate and lead a team comprised of students from different majors and backgrounds. All of us were able to bring varying perspectives (whether Cog Sci, business, CS, art or design) to each discussion and certain skillsets. I gained experience with delegating tasks according to what people were interested in learning. I was also able to facilitate regular communication between my team members, National YMCA directors, and National DFA studio leads to coordinate regular feedback meetings and reflection sessions which reinforced my belief in beneficial critiques from stakeholders. We presented our final project to the National YMCA at the end of the semester and received overwhelmingly positive feedback from the directors.

I consistently struggled to find users for user research which made me realize how difficult it is to conduct research without personal leads or through a company. It taught me persistence as we cold-emailed over 30 YMCA branches around the country to get in contact with directors of youth programming. I even attempted to contact numerous branches near my hometown to create personal connections and asked for referrals from other directors or students. Although in the end, the interviews we received were comprehensive, allowing us to synthesize and generalize issues across community organizations. It was extremely gratifying to see that students wanted and said they would benefit from an app like this.

bottom of page