My final project at General Assembly was a group project for an actual client: CARE.org. They had a concept in mind for a website that would match their major donors with volunteer opportunities in the countries in which they operate. To facilitate a pilot program happening just months away, our job was to apply UX processes to bring this idea to life.
Persona development, user journey, digitizing and synthesizing our interview & user test notes, sketching and whiteboarding, paper prototype in Marvel, high-fidelity prototype in Axure, graphics in Photoshop, PowerPoint presentation design, photo documentation of our project, video screen recording of all of our user-tests via QuickTime.
Stakeholders & Users
Our research kicked-off with a number of Stakeholder Interviews. In learning more about CARE and this initiative specifically we identified 3 unique perspectives that we would need to consider for our UX work.
- MAJOR DONORS who would become our volunteers
- FIELD OFFICES who would define and manage volunteer projects
- CARE CORPORATE to ensure we stay on mission
We identified the two main users of this website: the donor and the care office employee residing in a remote field office.
I created personas based on our in-depth stakeholder interviews.
Competitive & Comparative Analysis
Whiteboarding & Sketching
Prototyping & User Testing
With three week to complete the entire project, speed and resourcefulness would be valuable to the process so we created a “paper prototype”. It was a hodgepodge of my pencil sketches and photos from our white-boarding sessions compiled as a clickable prototype in Marvel. We remote tested one of our stakeholders from Brazil via Skype screenshare. She doubled as our remote field office CARE representative as she understood their pain points first hand. It was the first physical representation of the website she’d seen since the idea was conceptualized and her enthusiasm sparked great feedback to start refining the idea. Thereafter, we moved into Axure to refine the prototype.
Below are some of the subsequent iterations and key take-aways from the user tests.
V1. Paper Prototype: Whiteboard, Pencil Sketches, Marvel App
“Add an Area of Impact so that he or she will know the impact they are having on people’s lives .”
–Tatiana, CARE Representative in Brazil
View the Marvel Prototype
V2. Lo-Fi Prototype: Axure
“Hands-on volunteer opportunity, hands-on is an important word.”
–Tom Hanschman, CARE Executive Director, Midwest Region
After a lengthy user test and discussion with Tom, it became clear that we needed to spend some time just focusing on language. Although the scope of the project did not include copywriting, it would be impossible to have a productive user test with our major donor the following day because the language was so closely tied to defining the purpose of the site and how it needed to work. My partner and I got in a room and spent a couple hours parsing out our notes and whiteboarding language variations around the words and ideas that needed to be conveyed. It was a huge shift in the prototype but when we put it in front of our user the next day, we knew we were on target and could move onto other areas of the prototype.
V3. Lo-Fi Prototype: Axure
“I would suggest you gather data on how rough they are willing to live.”
–Martha Brooks, major donor and CARE board member
Time to Refocus:
We were so fortunate to have a major donor/board member/future CARE volunteer available to test. Martha was candid and a wealth of ideas and opinions. With all of our great insight and testing results in hand, there were many things we could have done to change or improve upon our prototype but with one week remaining we had to determine what CAREfull Connections HAD to be and do. To refocus our work, we took a step back and crafted our elevator pitch as we realized we'd not stopped to formally define our product. This was also the point at which I went back to all of our interview notes to see how our prototype was measuring up. It was insightful to go back to our first interviews and understand words I'd written but didn't fully understand the first time around. With a few more action items in hand, I turned our prototype into high-fidelity. Since this product was so form-heavy, I decided to remain in Axure.
For CARE’s major donors who are dissatisfied with only giving money, CAREfull Connections is a website that deepens their engagement by matching their most unique skills with CARE’s most pressing needs.
Hi-Fidelity Prototype: Axure & Photoshop