Acts of Kindness

Acts of Kindness is a information tracking web application that helps people be kinder everyday. Users input their acts of kindness along with the mood they felt, which will be visualized in a beautifully interactive way.

Acts of Kindness was created with 2 other people in a Human Computer Interaction Studio course at UCSD in a 10 week process. Through user research, user testing, & prototyping, we carefully designed an app to solve the problem:

people enjoy doing kind things, but they often lack the motivation and personal feedback that encourages them to do more.

USER RESEARCH

In order to find user needs, we conducted interviews based on what types of personal tracking people did. Through our interviews of UCSD students, we found that people track physical health, but not mental health, and often forget what they did that day.

In order to combine the mental health and memory, we decided to brainstorm ideas on what type of things people forget and how we can remind them of their actions and emotions linked with them.

Examples of the questions we asked were:

  1. Do you do any personal tracking?
  2. What type of tracking if so?
  3. How often do you remember what you did in the past week?
  4. Do you often forget how you felt when you were doing certain things?

Through this we found that people often forget how they felt when they did things for other people. For example, while doing dishes for a roommate one often forgets that they were feeling mildly annoyed and wonders why the rest of their day did not feel as happy as yesterday. In another instance, one might be elated at the end of the day and forget completely that she found the perfect gift for her boyfriend which was the cause of her happiness.

PROTOTYPING

After getting our key features down, we made our first paper prototypes using the user feedback from interviews. We were able to receive a full heuristics evaluation from another team in the class which provided insight on the design and functionality of the app.

PROTOTYPE 1

Home, Add, Check History and Settings pages

PROTOTYPE 2

Home, Add Act, Check History and Add Mood pages

To make our app multifaceted, we leaned towards prototype 1 because the mood is directly related to the act of kindness, whereas in prototype 2, adding a mood is separate. After using Nielsen’s 10 heuristics to find breakdowns and ways to improve, we created mockups of a few pages of our app.

Wireframe prototypes made with Balsamiq

DEVELOPMENT

After this step, we began development on github. Using a boostrap template we were able to easily implement the different pages of the application. Although I was new to web languages, Html, CSS and Javascript were not too difficult to pick up having done computer science courses before. Using JSON data we were able to pull and store local user input to generate data visualization modules.

Check out the application on Github: Acts of Kindness

Demo of our app for presentation day

Acts of Kindness is one of the most important projects I’ve worked on in college. This is the first time I have started completely fresh with all the steps to app development and ended with a sellable product. It was extremely fun to work with my partners and brainstorm design ideas together. I hope users have as much fun using this app as we had making it!