top of page

New York Cares 

Mobile App

Web-App

Responsive

Redesigning the orientation process for a more seamless experience

Frame 1.png
NYCARES2noshadow_edited.png

New York Cares 

New York Cares is a non-profit organization focused on volunteer management. They offer a variety of different volunteering opportunities and help match these opportunities with potential volunteers. We reviewed and identified usability issues and to help create a seamless experience.

Role

UX Researcher,

UX/UI Designer

Team

Simon Tobias - UI Designer

Mergim Shalaj- UX Designer

Lily Chen- UX Researcher

Timeline

3 Weeks- Jan 2020

Motivation

Passion Project in the non-profit industry 

PROBLEM

One of the problems we saw was the website was visually outdated, but we focused on evaluating the site for usability issues. We assumed that the home page was the problem as it doesn't onboard the user with the process.

RESEARCH

We have conducted a structure interview with five users that were frequent users to the site as well as potential users. 

01  Can you walk me through the volunteering sign up process? ​

02  How was your experience with navigating the website?

03  Describe how the website content met your goals?

Understand

Design Process
Anchor 1

Humanizing Data

We created Alex based on the data gathered from the research process and the " I statements" that emerged from our affinity mapping

woman-wearing-black-eyeglasses-1239291.j

ALEX, 25

Research

GOAL

She wants to find volunteer work that matches her schedule and interests 

PAIN POINT

Sign up process is convoluted

and poorly designed

NEED

Wants an easy way to filter volunteer opportunities based on her preferences

Filters volunteer opportunities
based on time and skill needs

BEHAVIOR

Design 

Challenge

How might we help users have a streamlined volunteer process based on her preferences?

Evaluating current  website

We conducted a usability test on the existing website with four users with the rest of the users we gathered from the screener survey. 

*The current process that New York Cares currently have to be able to participate in a volunteering opportunity is  you must

01   Register & Create an account.

02  Attend an in-person orientation.

Nycaremockup.png

After entering all your preferences, search results page

Frame 2.png

60%

USERS 

Were confused about the steps of the sign-up process especially orientation 

Were confused about the steps of the sign-up process especially orientation 

75%

USERS 

Frame%202_edited.png

Didn't find their preferred volunteer opportunity from the first search 

Didn't find their preferred volunteer opportunity from the first search 

Synthesis

Diverging and Converging Ideas

We conducted two rounds of design studio, we sketched our ideas and focused the team's effort into solving Alex's problem that represented the target audience. 

Conversion of our Ideas- Last Phase of Design Studio

IMG_2930.jpg

Ideate solutions for the defined problem

Iterate/Refine based on critique and feedback

Collaboratively decide on the best solution 

IMG_0811_edited.jpg

Final Design Solution

Ideating

Mid-Fi

Usability Report

Home%20Page_edited.jpg
Implementation

We created an on-boarding process for the volunteer process on the home page 

INSIGHTS

01 Users thought the on boarding circles were clickable, 45% clicked

directly on Volunteer

02 Users went straight to searching for opportunities 

Validation

& Testing

Although our design creations failed in Mid-Fidelity, the insights we got were extremely valuable to the Hi-fi iterations, where we were able to translate our learning into design opportunities.

01

Safari_Mockups_—_MacOS_Mojave.png

We removed the circles in the on boarding and add in step1,2,3 to display more of an on boarding 

02

Safari_Mockups_—_MacOS_Mojave.png

We color coded availability slots by circles when searching, so the users don't have to go through back & forth searching

Learnings &

Insight

View The Importance of Paper Prototyping full case study Here

01

What would I do differently next time?

I wish I time-boxed aggressively during our design studio, wasting time debating in the design studio, which has led us to skip paper prototyping which could have saved us a lot of errors.

02

Over communicating

What didn't make our design process efficient was that we didn't over-communicate or schedule a time for stand up to check in with each other which made gaps between our team. 

03

Next Steps

After focusing on MVP, the next steps would be to conduct Heuristic Evaluation and see if the site meets accessibility guidelines + Conduct further usability testing on Hi-Fi

bottom of page