Youth 2 Seniors

Desktop and Mobile Website Redesign
Project Overview
Youth 2 Seniors is a local non-profit in Austin, Texas that focuses on connecting local youth with residents of nursing homes to come together in events to bring light to the lives of the often forgotten senior members of the community all while teaching youth the joys of service. Our group was tasked with creating a complete UX/UI redesign of their web and mobile experiences. Their current website had a poor UI that obscured the non-profit's mission, had poor information architecture that made the navigation of the site difficult and convoluted and had an unprofessional look and feel that was a turnoff for volunteers and donors.

Through user research and stakeholder interviews, ideation, prototyping and user testing we developed a completely new and responsive redesign for Youth 2 Seniors.
The Problem
As seen here, the old design of the Y2S website was a lot to take in. A plethora of fonts, colors, designs, text and images that overlapped, links that were no longer working or active and an overall feel that is extremely outdated and unprofessional.

Navigating through the site could take you onto pages where it was nearly impossible to navigate back to the homepage and trying to figure out how to sign up to be a volunteer or submit a donation were extremely confusing.
User Interviews
In order to create a a redesign that resonated with our target audience, our group performed interviews with many people in the community who volunteer with groups similar to Youth 2 Seniors as well as other non-profits throughout Austin. This allowed us to pull key user insights and understand their needs and pain points better. Below are some sample questions we asked them.
  • Can you tell what Youth 2 Seniors does based on their homepage?
  • Would you sign your kids up to volunteer?
  • What kind of information do you need to know before signing your kids up to volunteer?
  • What would make it more appealing to sign up?
  • Would you donate?
After performing our interviews we were able to pull some key user insights.
"Their mission isn't clear. I want to know exactly what I'm going to be doing."
‍
- Volunteer with Heights
& Hills in Brooklyn
“If I were to stumble on this website while looking for volunteer opportunities for my kids, I’d close the tab immediately because they look like they don’t know what they’re doing.”
—  Mom of two kids who volunteer with Generation Serve
“I’d be afraid to donate money. It looks like a scam.” 
— Potential donor
Affinity Diagram
To analyze our data, we created an affinity diagram.
User Persona
Based on our interviews and affinity diagram we created a user persona, which helped guide us through the redesign process.
User Flow, Sketches and Prototypes
We created sample user flow diagrams to help improve navigation of the website, especially for key functions such as volunteer registration and submitting a donation. We got rid of unnecessary parts of the process and added the ability to register multiple kids in one go.

After defining some key user flows we began our design process with sketches to help determine layout and the general structure of the website. We then turned these into lo-fi prototypes that we could use for user testing and receiving initial feedback before diving deeper into the design process.
Hi-Fi Desktop Mockups
When it came to the design decisions for this project, we decided that it would be important to make the website still have a fun and playful feeling, while still becoming much more professional than the previous site.

The founder, Adelle, also wanted to keep her favorite color, purple, a key theme of the site.
Powered by Webflow