hci/d i300 fall 2015 user centered...

17
User Centered Design For a Non-Profit Organization Keana Mowery Alex Meyer Jake Lorton HCI/D I300 Fall 2015

Upload: others

Post on 25-May-2020

3 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

User Centered DesignFor a Non-Profit Organization

Keana MoweryAlex MeyerJake Lorton

HCI/D I300 Fall 2015

Page 2: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

OverviewAbout the Project

This project’s goal was to look at different non-profit community organizations, and to pick one out to assist by addressing a specific need that they have. We used the methods that were shown in the Stanford Design School Guide and the Bootleg guide to complete this project.

We began this project by e-mailing a representative for our chosen non-profit and asking them if they had any problems that they needed help with. Once they got back to us with what they needed help with, we created a mockup of the idea, which lead us to a prototype. Having a visual prototype that we could see and handle helped us perfect our model, leading to our final prototype that will hopefully help out our organization.

2

Page 3: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Problem IdentificationHow We Can Help

ORGANIZATION:

For this project we will be working with Susie’s Place Child Advocacy Center. Susie’s Place is a non-profit organization providing “forensic interviews for children in a child-friendly center for the investigation of alleged crimes against children.” (http://susiesplace.org/about/)

CONTACT:

Emily [email protected]

ISSUES:

Currently Susie’s Place does not have an automatic system in place to thank people who submit online donations or volunteer applications. A user-responsive design to perform this action would be beneficial for the organization.

PEOPLE WHO BENEFIT:

The volunteers and online donors, as well as everyone involved at the center, would benefit from this design. Volunteers and donors will feel that their contribution matters more, and the center’s employees and families who come to the center will feel as if their thanks have been better communicated. This may also increase levels of activity for both kinds of charity if their actions are more recognized.

LINKS:

About/Mission/History: http://susiesplace.org/about/

Volunteer: http://susiesplace.org/get-involved/

3

Page 4: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchProcess

For this user-centered design case study, we will employ the seven mindsets presented in the “Bootcamp Bootleg” journal from the Stanford d.School. Listed below are the seven mindsets and how we will use them to help Susie’s Place.

Show Don’t Tell

Communicate your vision in an impactful and meaningful way by creating experiences, using illustrative visuals, and telling good stories. We will use this mindset when implementing the ThankYou system. The layout of the design will use symbols and design metaphors instead of buttons which are just comprised of words in boxes.

Focus on Human Values

Empathy for the people you are designing for and feedback from these users is fundamental to good design. We will look at the company’s websites to try and determine what its values are, and then use these values to help influence the layout of the design that we create.

Craft Clarity

Produce a coherent vision out of messy problems. Frame it in a way to inspire others and to fuel ideation. Since we need to create a ThankYou page, we will most definitely need to make it so that when the donors receive the ThankYou, they will be happy with their decision to donate, and they will want to donate again.

Embrace Experimentation

Prototyping is not simply a way to validate your idea; it is an integral part of your innovation process. We build to think and learn. Since we are going to be creating the ThankYou system, the design of it is going to be the most important part. To make sure that we are producing a successful, inspirational system, we are going to need to make several rough drafts using different designs to figure out which one will be the most pleasing and functional.

4

Page 5: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchProcess

Be Mindful of Process

Know where you are in the design process, what methods to use in that stage, and what your goals are. As we move along in the designing process, we are going to have to constantly update our goals and reevaluate our progress to make sure that we are achieving what we set out for in a positive fashion.

Bias toward action

Design thinking is a misnomer; it is more about doing that thinking. Bias toward doing and making over thinking and meeting. When we meet up as a group, instead of just making a list of things we could do, we are going to start creating prototypes and drawing out ideas to create the page.

Radical collaboration

Bring together innovators with varied backgrounds and viewpoints. Enable breakthrough insights and solutions to emerge from the diversity. All of the members of our group have fairly different backgrounds, so we will bounce ideas off of each other to try and create the best possible design for the ThankYou page. We could also ask our personal friends, so they are all likely to be different as well.

5

Page 6: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchProcess

We also employ the five design process modes identified in the d.School documents:

Empathize

In order to understand the volunteer system and the importance of donors to the facility, our group conducted an interview and took a tour of the facility. By doing so we were able to observe how these two elements keep the nonprofit running smoothly in order to appreciate them more.

Define

Working with Susie’s Place, we defined their biggest issue as not being able to thank their volunteers in an efficient manner. The employees have a busy workload with, frankly, more important duties than individually thanking each person who contributes to the cause, but they still need to thank their donors and volunteers.

Ideate

We have decided to design a system called ThankYou to implement on the employee’s side of operations where the employee receives an automated list of donors and the system can either automatically send thank you messages through text or email, or the system can present a list of donors and volunteers who have yet to be thanked, and the employee can hit a button with a few options to send thank-yous to that list of people. If the families who are positively affected by a person’s contribution choose to, they can send a message as well, though their names will not be listed for confidentiality reasons.

Prototype

In order to lessen the workload and optimize the volunteer and donor relationship at Susie’s Place, we will be working to design a new system, keeping the following things in priority:

- Modern, but easy to understand for non-tech users- Clear “flow” through website- Process done as quick as possible to lessen time intensiveness 6

Page 7: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchProcess

Test

We will test our prototype by working with employees at Susie’s Place in order to present them with an easier way to thank their volunteers and donors, and hopefully increase their donor and volunteer relationships, in turn bringing in more donations and volunteers.

We will use the relevant method for each stage of the user-centered design process.

7

Page 8: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchMethods

In this section, our team used the dSchool methods of assuming a beginner’s mindset, interview preparation, interview with empathy, and user-driven prototyping in order to figure out a solution that is best for users. By assuming a beginner’s mindset, it allows us to look at the design and problem from someone who doesn’t have any previous experience with the design. Preparing for our interview helped us out by making sure that the limited time that we had with them was focused and detail-oriented. Without preparing for our interview, we would have wasted valuable time. By interviewing with empathy, it gave us a chance to learn about the staff and their clients. By better understanding them, it allowed us to create a better design more fitted towards their tastes and opinions.

Assuming a Beginner’s Mindset.

Assuming a beginner’s mindset involves observing and engaging users “without the influence of value judgements upon their actions… or decisions(Bootcamp).”

In order to gain a perspective sans bias from the employees, donors, and volunteers at Susie’s Place in the context of this project, we contacted the nonprofit with a description of the project with the brief attached, and let them suggest ways we could help them. Emily Perry, our main contact at the organization, suggested an idea for what became the ThankYou system.

Interview Preparation

Preparing for an interview is important because it allows us to plan out the short amount of time that we have with the user. Without planning out an interview, time would be wasted with them trying to come up with questions, which would reduce the amount of information that we are able to get out of them.

To sufficiently prepare for the interview, we as a group came up with questions that we thought would be effective for finding out how to help out Susie’s Place. We were trying to figure out the best way for her to be able to efficiently thank all of the people that donated to her organization, which means that we have to come up with an attractive “Thank You” design that her and her donors would enjoy. We also conducted research into her company to try and find out what her company’s values are, so that we could include them in the message. 8

Page 9: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchMethods

Interview with Empathy

Interviewing for a user’s empathy allows us to better understand a user’s thoughts, which then allows us to create a better design based around their beliefs.

In order to find out how a user thinks and acts, we would want to have a personal conversation with them, so that we can learn how they act in their natural state. We would ask them “Why?” to try and find out the reasons behind why they believe and act the way they do. This would be key for creating a ThankYou message, because it would allow us to tailor the ThankYou message around their thoughts.

User-Driven Prototyping The main goal behind user-driven prototyping is to allow the user to create their own idea of the design that we are trying to make for them.

Since we are to create a ThankYou page, it would be best for us to give them a piece of paper, and allow them to create a sample ThankYou message. If they were to struggle to come up with ideas, then we could give them one of our early prototypes, and allow them to edit and change it to see how they see fit.

9

Page 10: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchFindings

From our interview and other interactions with Susie’s Place, our team implemented a composite character profile for potential users of our design. This profile includes the person’s name, role, age, location, and also a section about the person.

We believe these user personas are representative of all parties involved in this process. These personas will help us create a design that will improve donor and volunteer relationships with the nonprofit as well as alleviate the stresses of some employees. These personas will help us take steps towards the final design.

10

Page 11: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchFindings

COMPOSITE CHARACTER PROFILES

Name: BertRole: DonorAge: 35Location: Bloomington

Bert is a family man who wishes he could volunteer his time, but his schedule is too busy, so he donates to the cause instead. Being a donor, he does not expect anything extravagant for his contribution. He just does it because he cares.

Name: ClarissaRole: VolunteerAge: 29Location: Bloomington

Clarissa is a married woman with no kids yet, who has some free time on her hands and is happy to help out at Susie’s Place whenever possible. Being a volunteer, what she gets out of her experiences at Susie’s Place depend on what she puts into it. Thank-yous are definitely necessary for her contribution.

Name: AshtonRole: EmployeeAge: 42Location: Ellettsville

About Ashton: Ashton works full-time at Susie’s Place. She is a busy woman and though she is very thankful for all the effort and money the nonprofit receives, sometimes she has more important duties than thanking volunteers and donors individually. She is not tech-savvy.

11

Page 12: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchDesign Brief + Prototype

DESIGN BRIEF

The main aspects we are trying to accomplish through our design are lowering the time and effort it takes to thank volunteers and donors, and improving the volunteer and donor relationship with the nonprofit. These two goals will serve as the parameters for our project.

We plan on bringing in more volunteers and donors by improving the relationship between the nonprofit and the current volunteers and donors. We are doing so in hopes that word of mouth from a positive experience will bring in more help for the organization. We plan on decreasing the time and effort needed to thank volunteers by automating the process, which is also extremely important independent of the positive donor experience.

PROTOTYPE

For the first prototype of our ThankYou system, we drew out simple pages of the system with placeholder images and words which in later iterations were supplemented or replaced with symbols and design metaphors. Though the tests were short and simply to check the flow of the design first, which is one of the things we consider the most important to the purpose of the app, they went smoothly and we took notes and input to improve further iterations of the design.

12

Page 13: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchFirst Prototype

13

Page 14: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchDesign Evolution

14

Page 15: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

Project ResearchDesign Evolution

Through two more iterations, we settled on a design that we felt was aesthetically pleasing and easy to use quickly and efficiently. The design uses colors that are psychologically related to calmness and anxiety reduction. The colors and fonts as well as the fonts’ sizes are intended to present a hierarchy throughout the design. There are four pages of the design shown above: the home page, the unthanked volunteers page, the all volunteers page, and the message customization page.

The home page would be the first thing the user sees of the working app. There are four buttons leading to four different lists of people who are charitable towards the organization. The home button is the only item in the navigation bar because one cannot go backward or forward from that point.

The unthanked volunteers page is where the user lands after pressing the corresponding button. From this page the user can view a scrollable list of volunteers who have yet to be thanked. It lists their name, email, and the hours they have volunteered. The user can choose to either select any number of volunteers and hit send to send them a preset message from the database, or select a single volunteer and hit customize to edit the message.

The customize page is where the user can enter a custom message, either from someone in the company or from a family they helped. The user can also set a date to send the ThankYou if the current day is not the desired send date. This may allow an employee to set the messages for a day’s group of volunteers before that day so as to ease the workload during especially busy times.

The all volunteers page lists all people who have volunteered for the nonprofit with the newest at the top. If any volunteers have not been thanked, in place of the date thanked, there is a button to send a ThankYou.

The all donors and unthanked donors pages operate the same as their volunteer based counterparts, but the ‘hours’ column is labeled as ‘donated’ instead. Each page that is not the home page has back and forward buttons on the navigation bar in addition to the home button. When they are not usable because the user does not have anywhere forward or backward to go, the arrow is dimmed.

15

Page 16: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

ConclusionFinal Thoughts

Over the course of this project we developed a solid understanding of prototyping, what it is, and how it helps. After e-mailing Lynn Clinton of Susie’s Place, she gave us an idea of something that we could help her with, which was creating visual draft of a “Thank You” system for people who have donated time or money towards their organization. The system that we created was designed for aesthetics and functionality, with the main goal in mind to let the donors know they were appreciated, and to ideally encourage them to donate later down the road through positive experience.

The biggest takeaway we had on the project was how important it was to prototype with empathy. Being able to put oneself in others’ shoes when designing something is key to creating a well-rounded design. Since other people are the users interacting with the project, understanding how they think is crucial to developing a successful and user-friendly idea.

If we had to redo this project, there are not many things that we would do differently. For documentation purposes, we would have been sure to take pictures or video of them using the prototypes, so that we would have been able to go back and look at what they were doing, and try to see how they were thinking in order to create a better next prototype. We did find that taking notes as the testing happened helped our process.

16

Page 17: HCI/D I300 Fall 2015 User Centered Designmedia.virbcdn.com/files/a2/dad7222f7ce5d53e-43UserCenteredDesi… · HCI/D I300 Fall 2015. Overview ... Place is a non-profit organization

References

“Stanford D.School .” Stanford Executive Education: Design Thinking Boot Camp: From Insights to Innovation. Stanford University, Web. 21 November 2015.

“Susie’s Place - Avon & Bloomington, Indiana Child Advocacy Center.” Susie’s Place. Web. Retrieved November 21, 2015.

17