Project Overview
Team: Lavina Rana, Chris Weeks, Jazmine Watkins
Role: UI Design Lead, Project Manager
Time: Period: 2 weeks
Tools: Sketch, Adobe XD, Adobe Illustrator, Craft, InVision
Problem Statement: As we transcend towards a cashless society, we are often left without a convenient option to donate to the homeless.
What is Touch?
How can we help the homeless? With the use of creative thinking and technology my group members and I came up with the idea of a donation app that works by connecting to a weather proof bracelet with a built-in NFC chip. The idea is that the money gets donated to the homeless person wearing the bracelet via the App on the donors cell phone. Donated money (Touch dollars) can only be used for things like food, locker space and sanitary needs at authorized stores. This offers a convenient way to donate and while giving the donor peace of mind.
User Interviews and Ethnographic Research
Recipient Research
Research methodology: Qualitative
We conducted our research outside Austin Homeless Shelter where we interviewed 9 potential recipients. Conversing with these people gave us insights into their thought process, needs, wants and frustrations.
Example Questions:
- What do you need at the moment?
- How much money do you typically get in a day?
- How do you spend your money?
- How long have you been homeless?
Key Findings:
From the interviews we conducted, there was a sense of wanting their own space and being belonged to somewhere safe and away from harm and theft.
Front Steps Austin
Front Steps Austin
Donor Research
Research methodology: Quantitative online survey
Using Google Forms, we created online surveys that we sent out to family, friends and colleagues between the ages of 20-35.
Example Questions:
Key findings include:
- Majority of participants don't donate to the homeless.
- They would donate if they knew their money was going somewhere beneficial.
- Participants are aware of the homeless issue in Austin.
Empathy Map & User Persona
Based on our research, we realized it was vital to create a donor persona and a recipient persona to understand their needs, goals and frustrations.
Empathy Map
Donor Persona
Recipient Persona
Insight
So what if there was a way to make sure that the money was going toward something beneficial and not to drugs and alcohol. A device that they could wear and use to receive monetary donations and redeem it at participating stores such as supermarkets, vending machines, locker spaces, public showers.
Storyboard
Once we gathered our users' insights, we created a storyboard to help illustrate the ideal scenario for both the donor and recipient.
Decision Wireflow
Our goal was to make the sign up process simple and straight forward. We adopted a 'don't make me think' approach to our wireflow. The donor simply signs in using his or her fingerprint ID and holds the phone near a touch bracelet to donate.
Mock-up image below shows the Touch bracelet. Alongside is a diagram showcasing a 4 -step user flow.
Touch bracelet mock up with built in NFC chip.
User Flow
Low Fidelity Prototyping & Testing
After finalizing our decision wireflow, I started sketching out the screens for the sign up process. We did rapid testing with a volunteer and found out that it was essential that we added an on-boarding page for users to understand/trust the app instead of jumping straight to the credit card details info page.
Paper Prototyping
Paper Prototyping
UI Style Guide
We created a simple, modern design that communicates credibility, trust, warmth and meets high standards of visual accessibility. Sans-serif font were chosen for headings and the body text. Although they are both from the same font family, they differ in weight and style.
Digitizing Wireframes & Iteration
Our first prototype for the App is shown below.
First Prototype
After some user testing and quality feedback on our first prototype, we changed the UI to a more clean and finished look. We also added a navigation bar, field for the user to set a donation amount and an option to share your donation on social media.
Second Prototype
Future Developments
Based on quality user feedback these are additional developments we would like to implement in Touch.
- Theft protection for recipients, the bracelet can only be redeemed using a fingerprint ID.
- There needs to be a way for the recipients to know how much they have on their bracelet.