Care.org Responsive web Redesign

 
sahel hunger.jpg

OVERVIEW

Care.org is an international non profit organization working to save lives, defeat poverty and achieve social justice.  In this concept work, Care.org needed to find new ways to reach donors through mobile that wasn't already available on their website, incorporate social media, keep donors engaged and motivate repeat engagement.

ROLES

  • Jen Hartwick | Research, Wireframes, UI design, Annotations
  • Heather Bartos | Research, Visual Design, Wireframes
  • Sam Brumenschenkel | Research, Usability Testing

project circumstance

2 weeks, detailed UI/UX and clickable prototype of an earlier design

Tools used

User interviews, affinity diagram, competitive analysis, personas, sketching, rapid prototyping (paper & InVision), usability testing, wireframing (Sketch)

 

1. Research

I utilized an affinity diagram to organize user interview feedback & identify key donation motivators

research methods used

User interviews, affinity diagraming, competitive analysis, personas

 
 

Primary Persona #1

 

"I donate because I like feeling connected to the places I've been and the people I've met."

 
 

2. paper prototype

We made photo copies of the prototype & allocated 20 minutes to test on as many people as we could find.

This rapid testing approach resulted in meaningful feedback that would help inform the first round of wireframes.

 

3. wireframes

I based the UI design for the smallest break point in my mobile responsive site (on right) on the native iPhone app my team originally created (on left) 

Project 3: Native iPhone 7 App

Project 4: Responsive Web Redesign

 

4. Supporting Documentation

Annotated wireframes for all page states were created to explain functional detail.  A user flow diagram and site map were also developed to represent the site navigation.

Detailed Annotations (available in all page states)

 

User Flow