PROJECT Pet Connect
About
Pet Connect is a design concept for a pet adoption and community event webite that combines user research, competition analysis and intuitive design patterns.
Goal
Design a pet adoption website that improves upon the compeition and impliments interface design best practices to connect pets, adopters and communities.
Deliverables
-
Competition analysis
-
User persona
-
User Journey Map
-
Wireframes
-
High-fidelity prototype
Tools
-
Adobe Illustrator
-
Axure RP
Research
To start the design of a pet adoption website, I interviewed pet adopters and owners at animal shelters and dog parks in San Diego. Through these interviews, I gained an understanding of their concerns, such as the pet's medical history, and motivations for adoption. I found a pattern of respondents commenting on the importance of lifestyle fit and the strong sense of community among pet owners.
Next I researched popular pet adoption websites to analyze their design patterns and web task flows for connecting users with potential pets. My research frequently found interface elements that could be improved upon, such as a simplified search bar, and found inspirations for features that created pet owner communities.
Explore
From my user interviews, I found that there was an important sense of a pet owner community by the owners I talked to. This data lead me to expand the scope of the website beyond just an adoption search to a hub for local communities of pet owners. For example, I included "Local Adoption Events" sections on the homepage and an "Adoption Story" webpage where users could read inspiring testimonials from other pet adopters.
First, outlined the user requirements and sketched the key pages within the user task flow of finding a pet and the user profile page. The user profile page was especially important because it would keep users coming back to the site by saving pet searches, notify users of upcoming events, and keeping them connected with the pet community.
I then used Axure RP to design wireframes based on design pattern best practices.
The footer includes a site map to aide navigation, a sign-up call to action, social media links to stay connected, and affiliated organization to communicate validity and increase user trust.
Prototype
I decided on the name Pet Connect for the website because of it's mission to connect pets up for adoption with potential owners as well as a way to network with other pet owners and community events. I used Axure RP to make a high-fidelity, interactive prototype of the adoption search task flow, and the user profile and "Adoption Stories" pages.
The light blue color gives users a calming website experience. The color palette is simple to ease user interaction with contrasting dark blue buttons with white font signaling to users where to click to quickly achieve their goals on the site.
