SOLO PROJECT
Project Overview
Auggie’s Pet Supplies is a local pet supply store in Fort Lauderdale, FL that is looking to expand their business to more than the brick-and-mortar space. Due to current world events, they find E-commerce as a necessary feature to allow their website to sell their supplies as face-to-face sales are not so stable at the moment. They want to keep their branding small and local as well. This project was a conceptual redesign of their current website and adding mobile-responsive capability.
Auggie's Pet Supplies
My Role
Tools
Project Duration
UX / UI Designer
Figma + Figjam + Canva
2 Weeks
Scope of Work
Create a high-fidelity mobile responsive desktop mockup in 2 weeks
(October 10, 20222 — October 21- 2022)
Process
Double Diamond Method
IInitial Problem Statement: Careful, critical pet owners need to compare item reviews and specifications so they can feel confident they are making the best choice for their pet.
I try to get my biases out of the way and use an initial problem statement to discover whether it is correct or needs adjusting throughout the define phase.
Problem
Research
To validate my problem statement and help define what users would like to see on the website redesign, I used a few methods in research such as a survey, task analysis, competitive and comparative analysis and card sort.
I completed a Task Analysis on 3 users. I found that all of them:
Depended on the product reviews to make decisions for their pets
Used filters to narrow down their results
Typically knew what specifics they were looking for in the product.
I was able to confirm from my survey of 21 participants, that the easiest way to start shopping is by clicking on the type of pet to begin the process.
Events is something that I noticed was on Auggie’s website and I wanted to gauge the importance of that which, seems to be less important than Auggie’s might think (3/21 said they were interested in events).
When asked why they shop online - cost, convenience and selection played a big part in why users shopped online rather than in-store (11/21 convenience, 7/21 product selection).
The below chart and card sorting results helped to inform my information architecture of the website redesign.
Survey
Competitor and Comparator Analysis
Key Takeaways:
Chewy.com was the only one to have a chart to compare side-by-side product options with the ingredients and necessary details. Which I believe target users would love.
None of the competitors did Nutritional Counseling, which Auggie’s mentions a lot about on its site. So that’s a potential strength.
There’s also lots of opportunity for Auggie’s to include reviews and Q&A’s, which almost all the competitors and comparators have.
From the card sort and survey analysis I was able to draw out a site map. I wanted to keep it simple and draw user’s eyes to the "shop" button. I tried to make best use of what card sort results I had, and incorporated the top choices as the sub-categories. From there it drills down into types of dog/ cat food and so on.
The services tab is more simplified, as Auggie's had a separate tab for the pet spa or groomers, previously on their website. So I combined them all here.
The main task I wanted to focus on was to allow users to compare reviews of 5 products, since time is of the essence and Brooke's dog needs to switch food, quick.
Define
With my research data, I created a persona to help me focus on the target user and hone in on the solutions that seemed to remain prevalent in the findings.
Revised Problem Statement
Brooke needs to compare dog food reviews and specifications in an efficient and timely manner so she can feel confident and happy that her dog is living a long and healthy life.
Sketches to High Fidelity
I sketched out some possible solutions to incorporate the above findings in my research and defining process, brought them to high fidelity and proceeded with user testing.
Design
User Testing
I had 5 users test out the first version of my prototype. The general consensus was that it was user friendly and easy to get through the tasks.
One user stated, "It was nice to not have to use the search function while performing the tasks." Another liked the large font size and how obvious it was to get to the checkout screen. A user also mentioned liking the attention to detail like having the different sized bags of dog food on the product page.
There were some dislikes and errors . A user mentioned that most people are accustomed to visual cues; some icons were just circles with labels rather than a graphic or photo to represent the category. The filter checkboxes weren’t functional, so they also couldn’t get the full shopping experience and were a bit confused.
I think a lot of the errors and extra time spent on the tasks can be remedied with more time spent making everything more clickable.
Task 1: Purchase the top rated, chicken-free dog food. You prefer dry dog food because it makes it easier to travel with when you take him places.
Task 2: Leave a review for that dog food you had purchased.
My second iteration of the prototype included an About Us page. I also added a “Welcome message” on the Homepage to make it more apparent that is the home page. Furthermore, I added more visuals on the thumbnails for shopping categories.
Homepage Before and After
Shopping Categories
About Us Page
Recommendations & Next Steps
The next steps include another round of user testing with the high-fidelity mockup.
I would add more functionality like adding the filter buttons being clickable on the product pages. Additionally, I would:
Add a “contact us” form on the about page
Double check the sitemap by trying a closed card sort
Verify if the navigation tabs are the most optimal ones to use
Survey the “Careful Critic Type” — whether Nutritional Counseling is important to them
Add a Q&A section to each product
Auggie's Pet Supplies
Desktop Prototype
Looking for more? See these projects
