Nicki Stearns | Pawdoptees
portfolio_page-template-default,single,single-portfolio_page,postid-16715,ajax_updown,page_not_loaded,,qode-title-hidden,qode-theme-ver-16.8,qode-theme-bridge,qode_header_in_grid,wpb-js-composer js-comp-ver-5.5.2,vc_responsive


Pet app design challenge for Google.


Millions of animals are currently in shelters and foster homes awaiting adoption. Design an experience that will help connect people looking for a new pet with the right companion for them. Help an adopter find a pet which matches their lifestyle, considering factors including breed, gender, age, temperament, and health status. Provide a high-level flow and supporting wireframes.



Paper, Sketch, Illustrator, Axure


I started my process by identifying the assumptions around the users of this product, which I’ve decided to call, Pawdoptees™. Even though there are two distinct user-types for this project, internal and external, I chose to focus on the external end-user due to time constraints. Here are some of my thoughts:


  • Most animals in shelters are dogs or cats, therefore my exercise will focus on dogs and cats only
  • Most adopters will spend at least 5-10 (or more) minutes to find the right pet match
  • Shelters / Fosters are willing to assess dog or cat using ASPCA’s Canine-ality or Feline-ality assessment (10 minutes)
  • Shelters / Fosters are willing to enter and upload additional information about dog or cat (create profile)
  • Adopters may want an animal outside their questionnaire results or not take the questionnaire, therefore a potential adopter has alternate means to search (For example, adopter can search by location)
  • People love to learn about themselves, personalization is important in all activities including adopting a pet

1.0 › High-level flow chart sketch and notes about audience, assumptions and ideas


I also spent time trying to identity the different types of users that would use this product. I made a list of the most common user types:


  • Families looking for a perfect pet for their lifestyle
  • Individuals looking for a new furry family member
  • Small shelters without their own website, need a way to advertise pets for adoption
  • Large shelters with their own websites, but want to reach a broader market
  • Individual foster families looking to find a forever home for a unique pet personality


Once I had a better idea of the high-level project, I started sketches around screen layouts and the basic features for each step of the user flow.

1.1 › Sketches and ideas for each individual screen

1.2 › Sketches and ideas for each individual screen


After completing my initial sketch wireframes, I refined my concept. I wanted to leverage the idea of personalization. One of my assumptions around users is that they love to learn about themselves. Even though a user was looking for a pet, the experience needed to be personal and custom to them.


This is why I integrated a personality test into the pet adoption experience. Personality tests and knowing oneself are trending right now. By combining a human’s and pet’s personality there can be better adoption matches made and stronger bonds formed. Therefore, resulting in less pets being returned to the shelter and more pets being successfully adopted.


After researching the idea more, I discovered ASPCA’s Canine-ality¹ and Feline-ality¹ system. Similar to both the True Colors² and Myers-Briggs³ personality tests for humans, the ASPCA’s tests provide a personality assessment for pets in shelters. I really wanted to integrate this system into my project.


My next step was to create a digital version of the high-level user flow and wireframes.


Additional notes:

  • (1) ASPCA’s Canine-ality Assessment evaluates each dog’s degree of: friendliness and sociability, playfulness, energy level and ability to focus, motivation (food, people, toys, internal motivations, etc.), “people manners”
  • (1) ASPCA’s Feline-ality Assessment evaluates each cat’s degree of: enjoyment of being petted and held, playfulness, “talkativeness” and activity level, interest in (and level of comfort with) new people and new things
  • (2) True Colors® uses Orange, Gold, Green and Blue colors to differentiate four central personality styles.
  • (3) The Myers-Briggs Type Indicator (MBTI) assessment is a psychometric questionnaire designed to measure psychological preferences in how people perceive the world and make decisions.

2.0 › Refined Flow Chart

2.1 › Refined Annotated Wireframes


Based on the idea of the ASPCA’s Canine-ality and Feline-ality system, I built my style using purple, green and orange for the personality groups. I also added an additional secondary color for non-personality themed areas of the experience.


Even though the experience is flat in style, I tried to keep some personality, like patterns to create texture and big pet photos to break up the space. I used the personality group colors to theme the screen appropriately. For any screen that did not directly tie to a personality group, I used the secondary UI color.


I created iconography to match the sub-categories, like “Couch Potato”, under each personality group. This was to give each sub-category a visual identifier in addition to the name.


Examples of the visual style:


And also, don’t shop… ADOPT! 🙂