Kindact

Mobile UX design for  promoting generous behaviors in society

Problem Statement

During the COVID-19 pandemic, many people experienced financial hardships and they felt ashamed to ask friends and their acquaintances for help. We all knew some and wanted to help them while keeping their dignity intact, but we didn't know how to do it!

Design Goal

Designing an experience that promotes generous behavior in society in general and facilitates giving behaviors even when not asked to help

 

Overview

My Roles
  • Research assistance

  • UX/UI Design and prototyping

  • User testing

Timeline

June - August 2020

 

Background

This project was defined when people faced with financial hardships due to the COVID-19, and many of us found our friends and families in hardships. The core of this project is the idea of facilitating the process of helping each other even when the person in need doesn't ask for help. 

Approach

The project was managed with an agile method in 7 sprints in 14 weeks. I collaborated in the research phase and worked actively in the UX design and prototyping stage. The main tools that I used for this project were Figma, illustrator, Miro, and my freehand sketching skills. 

 
 
Clickthrough Prototype

The output of this project was a clickthrough high fidelity prototype that is ready for doing more user testing and hand-off to developers.

Open prototype in new window

This is an interactive prototype here, you can click on it and explore designed features

Home screen

 The Generosity Map

Inner Circle Page

Connect with friends and family for donation purposes

Give Page

Select different options for donating

Wallet Page

Keep track of donation transactions and manage financials

Process

process.png
 

Research

This project started with a research phase consisting of the following parts:

  • Secondary research and competitive analysis

  • Survey about generous behaviors with over 200 responses

  • Interview with 12 survey respondents for a deep understanding of the reasons behind their actions

After doing all the research work, I can say that the main finding that was consistent in secondary research, user survey, and user interviews were these items:

Recap.png

The other tool that I used in this project to conclude the research findings, was to map the current state of the user journey for donating activities.

journeyMap.png
 

To synthesize research insights into a usable document for the design stage, we created a user persona so that all team members can empathize with real users and have an understanding of their needs, challenges, and goals in the donation process. 

persona.jpg

Design

To start generating ideas for this experience, we came up with 3 donating scenarios that our persona might experience:

Scenarios.png
Lo-Fi Design

I started working on a wireframing and low fidelity prototype based on the information architecture and ideas that I had from the ideation process. Here are some of the screens that I made and used for the user testing session.

lofi-1.jpg
User Testing

For user testing of the low fidelity prototype, we decided to go with the RITE method and iterate on the prototype after each 3 user testing sessions. Overall we tested the prototype with 11 users and iterated it 3 times.

usertesttake.png
High Fidelity Design

For designing high-fidelity interfaces, I defined a design system consisting of colors, fonts, and dimensions of elements that should be consistent on all screens. Considering principles of accessibility and inclusive design was a top priority in making decisions in this section.

Colors​

Psychologically, green is the color that is associated with generosity. Blue is a color for calmness. The dominant color of this app is the mint color that is a combination of green and blue

colors.png

Font

The readability of the font was the main criteria in selecting a typeface. Proxima Nova is a modern sans-serif font that has a friendly appearance

font.png

Buttons

Ease of detection and interaction were the main reasons for deciding about the dimension of Buttons

buttons.png

After defining the design system, I started polishing every single screen to create a click-through prototype.

home.gif
donate1.gif
donate2.gif

UI flow for logging Meal

 

Success Measurement

Though measuring  success at the time of designing the prototype is not possible, I think the following KPIs can measure the success of UX design when the product is launched:

Success.png

Reflection

If I look back to the project:

  • As a junior designer, I found out that I need to do better at making sure that I’m keeping track of all the research findings and constantly going back and referring to those findings. Research happens over several phases, we have to run secondary research, survey, user interviews, and so on. So during sprints that everything happens so fast, we might forget to go back and check with research. With the purpose to have a smarter decision about design, we need to be aware of all research insights.​

  • Testing my Hi-fi prototype with users is a remaining part of this project that can make me sure about the use of colors and fonts or it can change my mind!

  • And the last thing is that this design focuses mainly on designing an experience for people who want to donate. We didn’t work on the people who want to claim a need or start a fundraising cause. This part is missing in this work and for the next step, I believe I have to work on that part.