CityPups Design Sprint
Case Study
Day 1: Mapping
CityPups is a company dedicated to helping users find a dog to adopt that is right for them by what their needs are and what type of dog fits their lifestyle. The company is not a shelter but uses other adoption entities to aggregate their selections.
Users feel it is important to be able to understand the dog in terms of size, age, breed, personality, temperament towards variables, location, cost and life requirements. Videos attached to profiles help users understand dogs better since they can actively see the dog moving and can get an intuitive sense for how the dog behaves and interacts with the world. Pictures of the animal are usually noticed first but ultimately is not what drives a person to decide to adopt over knowing what the dog is like.
I generated a simple user flow to see what the process of adopting a dog would be at its simplest level and found that I felt the most important area was in the requested info and browse profile areas of the flow.
Day 2: Sketches
Looking at this basic flow I feel that the most important area of all is choosing the dog. It is the main driving force behind why users are here and has the most complexity. We’ve already spoken about how our users value understanding the dog when they look to adopt and that videos are very helpful in this regard. A lot of adopters also prefer to adopt something closer to their location than worrying about logistics of shipping the dog.
I started performing lightning demos based on the idea of adoption and visited the following sites for my inspiration
Youtube: videos were found to be helpful and youtube is the go to for almost everybody for short video content. Their video previews on hover would be a great addition.
Pinterest: The initial interview on pinterest really helps narrow the search on a HUGE variety of topics and can help pinpoint a person's likes and needs into a much more curated feed that fits what they are looking for. The user interface also has a great flow for people who will bee clicking in and out of multiple things quickly or find something that is close to what they want but not quite exact.
The titleless cards bring people instinctively to the things that they are interested in the most first and bring up a title once hovered over and lead to a more indepth blurb once clicked that will take the user back to where they just were when they click on the outside of that blurb. If the user decides that that blurb was close to what they wanted but wasn't quite the right thing there are links to other similar items underneath by simply scrolling down.
Glassdoor: The idea of getting to know the dog led me to thinking of glassdoor, a site about getting to know a business before working for them. Glassdoor’s comment and reviews style could possibly lend a great avenue to learning the personality of a dog from people who have been in its presence.
Apartments.com: Users also expressed that sometimes they want a dog who is physically very close to them so they can meet it before adopting. This reminded me alot of apartment hunting and how that search can be. Apartments.com has a great interface for that and allows for a great visual of where these things are located.
After the lightning demos I went on to a session of crazy 8’s, a design technique where you draw eight possible solutions in a minute per design.
With the crazy eights activity finished I took a look at my drawings and evaluated them so I could choose a design direction. The one that fit my idea for the site the best was the top right corner. I felt that this design had the opportunity to fit the best and really carry the prototype forward to match what I felt about the site.
Day 3: Decisions
Work on the prototype then began with a small storyboard sketch outlining the ideas I had for the site based off of the chosen section of the crazy eights drawings
These Sketches helped me visualize and lay out the plan for prototyping. I took a lot of inspiration from the lightning demos like pintrest’s introductory interest filters and popup profiles, and apartments.com’s map next to profiles (listings). The interest filters would work to help people to find a dog that fit what they were looking for by learning more about what they like first rather than the more common list of dog profiles that people have to click on and read to establish interest. The map and profile screen with the dogs that match best attempts to make the experience more effective by showing the user the dogs that fit the filtered choices the best with other dogs in the area being shown as expanded choices.
Dog profiles would also include videos of the dog as you hover over each collapsed profile and extras in the expanded profile allowing users to rapidly gain understanding of the dogs beyond what people type up for each dog's description. The profiles would also contain personality traits listed for people to easily peruse to give users another way to understand what the dog is like.
Day 4: Prototyping
I began making a low fidelity mockup using premade elements to give a more finished feel to the site. The important elements to making the site feel functional were a search bar, the interest filters and the map and profile popups.
I felt it was important that the site had clickable checklists and a map that felt interactive. My goal is to find out if the interest filters helped the user feel as though it helped them find the dogs they were looking for.
Day 5: Testing
For testing I recruited some of my friends and neighbors who are all dog owners or have been owners in the past. My users were:
Kelly: An electrician who owns a poodle and has very good knowledge of training dogs
Scott: A Homemaker whos has owned dogs in the past and is open to getting another one
Aislyn: A Medical lab tech who owns a corgi and is looking for a second one
Fonda: Retired 70 year old that takes care of her daughter's dog while they are at work.
Cameron: Another medical lab tech and friend of Aislyn who is looking for their first dog.
Once recruited I introduced them to the prototype and presented them with a few tasks within the scenario that they were looking for a smaller dog near our closest large city. Interjecting with questions about how they liked certain elements along the way.
My tasks were as follows:
Search for a small dog in portland or
Look at a few dog profiles.
Choose one of the dogs you think fits best for your situation.
After using the prototype I would ask them if they had any feedback or irritations while they were using the prototype.
Aislyn
Immediately used the search bar and moved on to the filter questionnaire.
Noted the search bar up top but preferred to use the picture filters provided.
Felt like the checklist showed some things she might desire but didn't want to select because they might make her miss out on some things. She is open to different life stages in the adopted dog and filtering potty trained might stop her from seeing puppies.
Felt the housing situation page felt out of place
She liked the map interface and distance away from her for a dog didn't matter much but would not be ok with shipping a dog.
Felt like the video hover idea would have significantly helped her in choosing a dog
Suggestions:
Felt like the map could be bigger or more centered and then adding categories to show search results below it. ( ex top results, a little further away, small dogs, large dogs, etc.)
Graded matches to search parameters (ex 80% match) and add an explanation to filters including outliers to the checklist?
Categories listed in style similar to netflix to conserve space and allow for deeper search if the category fits well.
Fonda
Felt search bar and visual elements helped with non-tech users and hard of vision users.
Wanted a small dog because of her medical abilities/age and felt the picture and checklist filters helped her feel in control of finding the smaller dogs.
Did feel like the videos would have helped her choose especially if they played without having to put in much input.
Heavily influenced by the personality peaks shown on profile cards
Felt none of the top dogs would fit what she wanted but didnt know to scroll to look for more.
Suggestions: None given
Scott
Liked the breed search on the front page but said it felt hidden.
Clickable pictures page on intro filtering felt out of place but would still like it later on
Disliked the housing filter, said it felt limiting
Top dogs cards made sense but felt like they were the only choices without an explanation
Expressed an interest in knowing how filters came into play in the final showings.
Disliked that profiles were just overlayed over the map screen without much change.
Suggestions:
Darken the background when opening profiles slightly to give a sense of change.
Remove the housing filters
Add some sort of explanation during the search to say how it will affect things.
Kelly
Liked the business blurbs in the center of the page, felt they made him trust the site more and were comprehensive. Wished they were clickable to do research on city pups.
Felt the search by breed area was smart but only if the list was comprehensive. Suggested sorting by categories of dogs (herding, water dogs, short tall, etc.)
Liked the dog education area.
Felt like the introduction filter system was well done.
Liked how checklist filters functioned but wondered what the goal was after the input.
Felt the personality peeks were great.
Suggestions:
Felt the current flow was good but could use further refinement in search parameter areas.
Cameron
Liked the website Look but felt the main search bar was too big leading it to feel like the only choice, would like more options at the top of the screen
Search by breed is good because it lets you see the dog's look and style even if you aren’t familiar with the breed's name.
On the what dogs do you like page she felt it was too sparse, how would someone who wasn't aware of a specific dog breed know what to search for? And does it exclude all dogs that don't fit that selection?
The checklist page could use a search function or some categories to make it feel less overwhelming.
The housing section felt wrong, almost stalkery.
Map and cards looked nice but were too big and made it feel like the only choices they had.
Felt the video idea would have made a big difference in their confidence of choice
Suggestions:
Add more sections to the top of the screen so it doesn't feel like a bunch of wasted space
Size down elements of the screens so that others can peek up from the bottom and imply more content below.
Conclusions
Our users seemed to like the basic premise but had some recurring problems with the design:
The homepage needed more on there to help in the search of specific dogs past the point of location and that certain elements took up more attention than others.
Visual elements helped more than text based elements because of the broad subject that most people aren't experts in, seeing the dog helps in identification.
The filters felt like they did a good job but left users feeling like they didn't know how their choices would affect the outcome.
The housing situation filters while well intentioned to help users find a dog good for their space, it still felt uncomfortable for most users
The personality peeks on the dog profiles had a large impact on users and could be added to to include costs of adoption and vaccination status peeks.
Adding video to profile cards on hover sounded to users like it would have helped with their choices.
Users desired more categorization of info and insight as to how their choices would effect the filtering process.
The biggest insights are based around categorization, searchability and insight. I would start with insight by changing the intro filter to be a preference profile setup and include explanations that choices don't eliminate choices from appearing in their search but instead try to bring the best matches to the top while showing less compatible dogs second.
Searchability was hindered by the size of some elements and a lack of site sections at the top of the page. So I would change up how big those elements are and show some more of the site elements underneath them so that users know instinctively that there is more to look at on the site and add some site sections to allow users more access to different types of searches.
Lastly for categorization I would look at large organizations such as the AKC for their categorization structure and try to use that to assist in how I structured information about breeds on CityPups.
