Breederfinder Website

Duration: March 2020 to May 2020

Role: Solo Project, Project Plan, Research, User Testing, UX/Ul Design

Tool: Figma, Adobe Illustrator, Zeplin

Deliverables: research analysis, hi-fi mockup

Prototype: https://www.figma.com/proto/nDnBvD6zXZHwuY6vDTkZUi/Breeder-search-website?node-id=131%3A13490&scaling=min-zoom

Overview

In the US, when people are trying to get a new dog/cat, they can’t find a well-developed, comprehensive, and easy-using website to look for breeders. I decided to create such a digital product for people to easily look up breeders near them.

The Problem

1. Currently, users need to spend a lot of energy and time searching for breeders and look at their website/information one by one. 
2. The current communication method between users and breeders is inefficient.
3. Users can’t easily find important information (next litter’s availability)about a breeder on their website.

User Research

Research goalI wanted to learn what information users are looking for?  What functions do they need to use during the process? What pain points do they have in current searching methods? 

Method: 20-mins video semi-structured interview to gather in-depth qualitative data.

Affinity diagram:

research report-interview notes.jpg

Insights: 

User Needs

  • Participants need breeders to update their litter status timely using the application.

  • Participants need fast and easy ways to contact breeders.

Information Users Want to See

  • Participants want to see high-quality pictures with different angles of a pet.

  • Breeder’s certification status is important to participants.

  • Litter’s available dates are important pieces of information for participants to know.

  • Breeder’s location, payment method, and shipping method are useful for participants.

Competitive Analysis

I did a competitive analysis of two types of related breeder websites to study how the current website is trying to solve such problems.

Image 1.png

1. Independent breeder websites

Long texts to read

Not sure how long time to wait

Website quality depends on the breeder

Wouldn't hear back quickly
 

Image 5.png

2. Puppy finder websites

Get multiple results as once ✅

Show useful info (location, availability, health guarantee) ✅

Still lead to the breeder website or email/phone ❌

Can't provide an efficient communication method ❌

Image 2.png
Image 3.png

Product Ideation

Discovered and prioritized feature ideations from user research and competitive analysis.

feature ideation 1.JPG
feature ideation 2.JPG

Brainstorming using Crazy-8s:

crazy 8s.JPG

Feature ideation: 

feature ideation 3.JPG

Feature priority: 

feature priority.JPG

Product Design

Sketches

Wireframes

1.JPG
3.JPG
2.JPG

Optimize User Workflow

 After I created the wireframe, I did usability tests and updated the user workflow based on participants' feedback.

Users searching for breeder

user search workflow.JPG

Breeders signing up and signing in

signup%20and%20signin%20flow_edited.jpg

Breeder update info

Iterative Design

Accessibility: A good design is for everyone. I used WebAIM to test my prototype and made adjustments to make sure it passes the highest WCAG level.

A/B test: I used Unbounce to do A/B test, analyzed the test result, and adjustment the prototype according to the result.

Usability Tests

This is a repeated process that I used in different stages of designing this web application. I conducted face-to-face tests, used Lookback to do self-tests, and used Zoom for video tests.

Prototype

To address user needs:

Icons are used to show the breeder's certification status and shipping methods.

Users can contact the breeder easily and get a timely response on the breeder info display page.

Only important information including litter availability is displayed.

homepage.png
listpage.png
detailpage.png
Desktop+HD+In+Situ+Mockup3.png

Takeaways

As I understood more about the two main users of this type of website (1. people who need breeders and 2. Breeders), I realized the importance of communication, as well as the importance of the designer. The communication between me and type 1 users allows me to understand their needs, while type 2 users may not aware of them. The designer of the website is the bridge that connects these two types of users. By requiring type 2 users to provide information that type 1 users need, and adding features that can facilitate the communication between them,  both types of users can benefit more from using the website.

A good design should benefit more than one group of people. 

Next Steps

There are successful intermediate websites on the market. I would do more research on their marketing and business strategies. I always believe that designers need to think about the business's success besides users' needs. I would work on both aspects of this platform to provide a better user experience as well as stable user growth.

© 2021 by Feiyang Xu.

  • Instagram
  • LinkedIn