City Pups

 Overview

City-dwellers looking for a dog have many things to consider when looking for their FURever friend. While many potential city adopters focus on a dog’s personality, they also need to consider unique parameters that their suburban counterparts don’t. For example, a dog that fits the city life may potentially require adaptation to a small studio, many neighbors, no yard space, long hours home alone, crowded parks, or outdoor restaurants.

City Pups seeks to increase adoption rates, create happier owners, and have better forever homes for dogs by factoring in these city-specific parameters to the adoption process. While it’s crucial to obtain practical information about a dog, especially when living in confined and shared spaces in a crowded city, most users seem to consider getting a sense of a dog’s personality equally important. They like reading a dog’s bio, but third-party adoption site evaluations aren’t always comprehensive. Potential adopters want to feel a connection with a dog and often make adoption decisions based on instinct. On most existing sites, users don’t get enough information or sense of a dog to confidently move forward in the adoption process. Users would be better able to make a decision that will impact their lives, and the lives of dogs in need if they had more information and a personalized matching experience.

The design sprint tool has one clear goal. The “how might we” problem statement:

“How might we” showcase the adoptable dog’s personality while still providing practical, city-specific information?

While there are other dog finding applications on the market today, none provide a city-specific experience that allow users to get a more organic sense of the dog’s personality, similar to a human dating app.

Why CityPups and Why the Design
Sprint?

CityPups is a special site with unique needs that requires thought and innovation in order to be competitive. While there are other “pet finding” applications on the market today, none are specific to just dogs. In addition, none provide a city-specific experience that allow the user to get an organic sense of the dog’s personality. This design sprint helps to identify crucial details about a dog that are exclusively important for city dwellers. More importantly, the experience should be dominated by videos and photos, so it feels more like a virtual meeting versus a simple dog adoption site.

Who’s Responsible?

The project and research were provided by BitesizeUX. I reviewed the product information and the user interviews on day one as if I was on a team and a team member presented their findings to prepare me for the design sprint. From there, I worked on my own, developing and creating the map, sketch, storyboard, and prototype. I then conducted my own interviews to validate the tool at the end of the week. I created the prototype icons, UI elements, and a modified style guide.

Here’s the Step-by-Step

Step one: Understand/Map

In order to understand the experience and how this tool could better assist users, I reviewed the research provided and realized how impactful imagery was to user experience. Accordingly, I wanted to create something that mimicked a dating app. The important facts/details are provided outright, giving the user a dog’s personality “on paper”, but I wanted to provide videos and images so that they could simulate an in-person “connection”.

Step Two: Sketching the Solution

I started by doing lightning demos, I looked at the most popular adoption site, Petfinder, and then the CityDogs Rescue site to see what worked well. I also wanted to find out how the sites differed since one is popular and widely used, and the other is specific to cities. Then, since our goal was not simply providing practical information on the dog but a sense of their personality – essentially “matching” with a dog with a city-dwelling as well as a city-dweller, I looked at a handful of online dating apps. These are popular and frequently used in urban environments, plus they encourage relationship commitments and facilitate choosing a loved one, much like choosing a pet.

Here are examples of my findings:

Then, I completed a Crazy8s exercise and developed the following:

Finally, I created a 3-panel board solution sketch.

The user can find practical information on the dog in the refined search or “take a quiz” page/screen. However, I felt the individual dog page was most critical in solving the “how might we” question. The layout, supply of videos and pictures, the bio of the dog, and the dog’s critical information are the most important components when creating a better adoption process and ultimately a happy adoption.

Step Three: Create a Storyboard

I selected this solution to immediately immerse the future pup parent with the personality of the pup. As soon as the dog is selected on the prior page, the video submission is displayed largely at the top. There are also multiple thumbnail videos and pictures for diversity. The bio is a secondary component, and although the details are important, I’d consider them tertiary since the users either already took the quiz or refined their search before landing on this page. The third screen takes users to the third-party outreach form to further enquire about their potential FURever friend.

The storyboard begins in a small studio apartment in the city. The user searches for dog adoptions and CityPups is displayed as an option. The homepage welcomes the user and provides an overview of the site. The page is very simple in order to not overwhelm the user, displaying just the location search criteria. The next page shows all the available dogs within the designated area. The user can browse through the dogs immediately or they can refine their search by selecting certain criteria. Unique to CityPups, these criteria are specific not only to just general pet care, but also to the needs of city life, such as dog size and temperament. Conversely, the user can take a quiz to help them refine their criteria if they need adoption guidance. Once the user selects a dog (Rosco), they will immediately “meet” him when the page opens to a video at the top. They’re also presented with thumbnail pictures to click on. After the user finds all the information they need or if they want to inquire further, they can click on “ask about me” where they are directed to an email page and/or the third party site.

Step Four: Build a Prototype

https://www.figma.com/proto/K4dKKC4JDX4s9Y7S6CMuBq/CityPups?scaling=min-zoom&node-id=2%3A2

During prototyping, I created an experience intended to be easy and intuitive for the user. I wanted it to feel simplistic, and I wanted the user to get an immediate understanding of a dog’s personality. Like a dating app, I was hoping the user would appreciate seeing photos along with a detailed description specific to city dwellers and their needs when adopting dogs.
I used Illustrator to create some icons and design elements, but then built out the prototype in Figma.

Step Five: Test/Validate

When testing the prototype, I asked the users about their feelings about the site. Is it usable? Will they feel more equipped to decide about a dog with these added parameters? Is the site layout helpful for them to quickly understand a dog’s temperament, personality, and potential fit? My hope is that they’ll be able to quickly access information in order to have more confidence about their potential dog matches.

Users: I interviewed five users, many of which lived in a city, some of which did not. Some had adopted dogs in the past, some had not, but were interested in adopting a dog at some point. All of which, however, were interested in acquiring a dog at some point in their life. In addition, each had between 2-5 hours of screentime per day. So, the users were very comfortable with both the mobile and web environments.

Experience: Due to the existing COVID-19 restrictions, I did three out of five interviews virtually. Fortunately, I did two in-person at a safe distance. Virtually, I sent participants the link to the Figma protoype and asked them to share their experience as they walked themselves through the prototype task assigned (inquiring about Betty – small dog). In person, I had the protype open on a laptop while the users performed the same task. All experiences were similar, since I gained my findings via verbal feedback.

Findings:

The users had relatively similar experiences. Initially, they all understood what to do and what parts of the site were clickable. When they went to the “dogs in the area” page, some were interesed in understanding how pets were sorted. In addition, one person liked that there were three dogs displayed per line, which allowed them to give the right amount of attention to each dog.

Another user liked the way the dogs were layed out but she would have prefered it if the dog was originally displayed with their actual age – that seemed to be an important parameter in her dog search. The last user said the size dropdown menu made sense, but he felt unsure about how to select dogs of multiple sizes. He seemed to think that it was only possible to choose one size of dogs instead of multiple.

In conclusion, everybody I interviewed seemed to understand how to use the site. They were also clear on how to navigate the site. Unclear features included the range in minutes of exercise needed in the details section, and the level of noise (how loud the dog was). This is likely because these were new categories not typically included on dog adoption sites. However, users were most excited about the ability to immediately see the dogs. Four out of five users shared that the videos and images were their favorite part, giving them the best sense of a dog immediately when they visited their page.

Conclusion

Through usability testing, I discovered that the design did in fact encourage potential pup owners to enquire about a specific dog more than on other sites for the following reasons:

They all had an audible reaction when they viewed the dog profile to see a video playing. It made them have a feeling versus thinking.
The details provided were important to city dwellers. They thought those details were important in their decision-making process.
This combination allows the user to use both the heart and head, which made their decision to move forward more obvious.

I also discovered common themes that were unclear to the users:

The ability to select multiple things within the dropdown menus.
It was initially confusing how the dogs were sorted.
Some detail descriptions were not clear to the more novice dog owner.

Outside of these updates and findings, I tried to keep things simple. This tool should be fun, informative, easy to use, and get more dogs in need into homes for good.

Case Study | Prototype