Responsive and Local

Role (Group of 4)

User Research, Sketching, Annotated Wireframes, Responsive HTML/CSS, Usability Testing, Documentation

Background

Challenge

The Almost Home Humane Society (AHHS, formerly the Tippecanoe County Humane
Society) was founded in 1939 by a group of local animal lovers in Tippecanoe County.
Since its inception more than 70 years ago, the organization has been dedicated to
improving the lives of animals in our community. They are dedicated to the prevention of cruelty to animals, relief of suffering among animals and the extension of humane
education, and they are governed by a volunteer board of directors. They are not funded by any government or national animal welfare organization.
AHHS operates like a no-kill shelter, but isn’t one. Often, no-kill shelters shelters will
refuse animals they believe will not survive in order to keep up their live release rate (how many animals are adopted) to continue to classify as a no-kill shelter. Unlike these places, AHHS accepts any animal that is left with them.

Problem

Almost Home Humane Society needs vital resources to maintain efficient standards
because animal health and wellness is a fundamental priority, but not many people know about the shelter or what they need.

Solution

Almost Home Humane Society needs vital resources to maintain efficient standards
because animal health and wellness is a fundamental priority, but not many people know about the shelter or what they need.

Research

To better understand our target users

Originally, we brainstormed directions we could go into for the project and came up with
a list of interview questions to ask another local shelter. The questions centered around
adoption and volunteering, areas we thought would be common to most shelters. The
plan was to delve deeper through the kickoff meeting and go more specifically into
problems they were facing.

However, we ran into two problems:
1. Two weeks in, we had not been able to get in contact with Natalie’s Second Chance.
2. What we thought could be potential problems were vastly different from the
problems shelters were actually facing.

Kickoff Meeting (Contextual Inquiry)

  • Volunteer process set – contact Aggie, people care about volunteering, sign in system, everyone knew what they were doing
  • Adoption set after years doing it

Screen Shot 2017-12-10 at 5.30.26 PM

Interviews

We conducted an interview to figure out how to bridge the gap between users
seeing what they can do and actually doing it. While a website can exist to tell them
what’s possible, what will motivate them to take action?

Why don’t people help, even if they want to?
What are users’ barriers?
What’s preventing users from taking action?

Questions
Have you ever donated money or volunteered?
If yes, to whom? Tell me about the process, what made you donate, what helped.
If no, have you ever wanted to donate/volunteer? What prevented you? What
would make it easier?

Insights

  • Rounded up when checking out at Petco when asked to donate money to a shelter dog, based on his previous experience with adopting a shelter dog.
  • Emotional connection to donate

Screen Shot 2017-12-10 at 5.33.56 PM

Survey

Surveying Pet Owners
Our goal surveying pet owners was to learn more about the adoption process and
factors people looked at when looking for a pet. We chose this as our goal because
knowing wants and needs could potentially help us better establish the shelter’s
online presence to predict the information users are looking for.

Questions
What type(s) of pets do you have?
How did you adopt your pet (walk through the process)?
Where did you adopt from?
What were some of the characteristics that you looked for when adopting?
What made you realize it was the right fit?
Did you use any online resources when adopting?
Is there anything you wish you would’ve known before?

Looking back on the survey, we made assumptions about what could be a shelter’s
possible problems. Adoption ended up not being our focus because the process
had been streamlined after decades of being in business, which rendered most of
our survey data irrelevant to the problem. However, we were able to pull some
insights.
Key Insights

  • Emotional/personal connection plays a significant role
  • “They showed us two dogs and we fell in love with one of them.”
  • “Fell in love with cat and parents got her so they could stop taking me the pet store to see her every day. I was 9. I’m 21 now and she’s still my baby.”
  • People are often led to adopt through family, friends, neighbors, etc.

Initial Sketches

Below are a few workflow chart we came up with during the initial ideation. They showed how the conversation between the bot and the user would unfold.

Page 1
Screen Shot 2017-12-10 at 5.37.20 PM

Page 2

Screen Shot 2017-12-10 at 5.39.04 PM.png

Low-fi Prototype

We took our sketches and created low fidelity mockups/wireframes to have an outline
to work from for the high fidelity mockups.

Screen Shot 2017-12-10 at 5.40.06 PMScreen Shot 2017-12-10 at 5.40.15 PM

Screen Shot 2017-12-10 at 5.40.26 PMScreen Shot 2017-12-10 at 5.40.31 PM

High Fidelity Mockups

Screen Shot 2017-12-10 at 5.43.24 PMScreen Shot 2017-12-10 at 5.46.15 PM.png

Final Prototype

Screen Shot 2017-12-10 at 5.48.32 PM

Our final prototype was modeled after the colors Almost Humane’s website. Due to
time constraints, the coded prototype was being created concurrently with ideation,
resulting in a prototype with a slightly different visual design than our final mockup.
We continued to iterate after it was complete. One challenge was that our
unfamiliarity with frameworks caused us to not use one – next steps would be to
organize it with a framework optimized for forms. For our mockups, we used the Material Design style because it provided a variety of resources (icons, UI patterns, components, etc.) that made prototyping rapid. We used Figma because it allowed for real-time collaboration, Sketch to utilize the Material Design component library, and InVision to create an interactive demo. Our high-fidelity interactive mockup is available at https://invis.io/HRDMWVUZ4.

Usability Testing

After ideation and sketching, we tested our low-fidelity prototype made with notecards with a couple of college students.

Scenario
Imagine if you were looking on Facebook and you saw a dog shelter posting with a
donate button and you have extra pet resources lying around. What would you do?
Suppose that you pressed this button, it took you to this page.

1. Read through the scenario (task)
2. Please start filling out the form (task)
3. Enter the resources that you do have and want to donate (task)
4. What would you do next and why? (task)
5. Was there anything confusing? What was it?
6. Is there anything missing that you wish the process could do?
7. Is there anything else you would like to mention about your experience?
8. Would like to see being implemented on Facebook?
9. Do you have any questions for us?

Based on our results from testing, we decided on these key changes to improve our
prototype.

Key Changes

  • Info Copy: added a description about pairing the shelter’s needs with the
    user’s strengths to inform users about the purpose of the form.
  • Contact Info in the footer to improve credibility.
  • Columns to Headings to improve readability.
  • Define Amazonsmile, PDF button, & results.
  • Adjust heading to confirm with user.
  • Collapsing options (google med) to simplify design.

 

Conclusion

Almost Home Humane Society needs vital resources to maintain efficient standards
because animal health and wellness is a fundamental priority, but not many people
know about the shelter or what they need.
Because AHHS needs resources from the community, but this information is difficult for
the community to find, we believe this web experience fills in that gap. Though AHHS
knows what they need, the list of their needs they gave us was not comprehensive or
widely distributed. Our goal was to connect Almost Home to the local community by
showcasing their needs and connecting them to community resources through a
personalized web experience.
Additionally, an insight we learned is there is often problems/projects the shelter has, but
they often do not know who can help unless by pure chance. Aggie recalled the time she
met someone who happened to be a plumber, which addressed her need of fixing problem areas in their plumbing system. Hopefully, our designs can provide a framework to connect projects to people who have the skills to complete those projects.

Leave a comment