Rivers & Reefs Pet Center
Rivers & Reefs Pet Center is a family owned and operated pet store in Austin, TX. They carry well known pet food brands and offer supplies for dogs, cats, birds, reptiles, and small animals. Through the process of researching, understanding the target user, and designing the user interface, I created a responsive e-commerce site that would meet the goals of Rivers & Reefs Pet Center and their customers.
Project Overview
Challenge
Rivers & Reefs Pet Center is a small, family-owned, and operated pet store. They currently prioritize face-to-face contact with their customers. Although, in current times, it has been difficult. They want to showcase their products while maintaining a "small shop" appeal and excellent customer servicer.
Objective
-
Redesign Rivers & Reefs Pet Centers' website
-
Design an e-commerce experience that reflects the brick & mortar experience that Rivers & Reefs Pet Center has curated.
Role
UX/UI Designer
Task
Responsive Website
Time
2 weeks
Tools
Figma, KardSort, Adobe Color
Design Process
Discover
Market Research
Competitive Analysis
Comparative Analysis
Target User
Define
User Persona
Problem Statement
HMW Questions
Site Map
Design
Task Flow
User Flow
Wireframes
Deliver
Mid-Fidelity Prototype
Usability Testing
​
Discover
Market Research
In order to gain a full understanding of Rivers & Reefs market I decided to start by researching market trends, consumer trends, and customer demographics.
Competitive Analysis
I researched Rivers & Reefs Pet Centers' competitors so I could evaluate their strengths and weaknesses. The insights gained here provided key information in terms of the strenghts I wanted to build upon and the weaknesses I wanted to avoid while keeping Rivers & Reefs Pet Centers' specific goals in mind.
Comperative Analysis
I assessed Rivers & Reefs Pet Center current website to gain knowledge of their present web presence and their existing user experience. Allowing me to gain an idea of how I could improve the website and incorporate e-commerce.
Target User
For this project, I choose a target use, the "Deal Driver" a user who cares about cost. This ideal target will help me generate an ideal persona.
Define
User Persona
Using the insights gained from research, I created a persona that would accurately represent Rivers & Reefs Pet Centers' target user. This persona continued to guide my decisions moving forward, making sure my design was centered around them.​
Problem Statement
Once I identified our target user, Karen, It was time to identify the actual problem I was solving for based on what I had learned about our user.
"Karen needs to be able to purchase natural grain free cat food online at a discounted price and delivered at a low cost."
How Might We...
Once I identified our target user, Karen, It was time to identify the actual problem I was solving for based on what I had learned about our user.
HMW help Karen with advanced purchases?
HMW provide monetary savings to Karen?
HMW deliver products to Karen at a low cost?
Site Map
After defining the problem and deciding what features to include, I wanted to continue building up the structure of the e-commers website using a sitemap. Using KardSort I was able to keep sitemap simple and straightforward, which will make maintenence easier in the future.
Design
Task Flow
In order to understand the ideal user path, I built a task flow of the e-commerce process.
User Flow
I identified the path users could take to achieve a complete transaction.
Wireframes
I adapted elements from sketches to create wireframes for Rivers & Reefs e-commerce website.
Deliver
Prototype
With the completed mid-fidelity wireframes, I built a limited functioning, desktop prototype on Figma which I used to test my design with users.
Usability Testing
I recruited participants and conducted usability testing in order to see how users interacted with my design and identify where improvements could be made.
Tasks
-
Show me how you would search for cat food.
-
Show me how you would purchase a bundle deal.
Objective
-
User will be able to find cat food in less than a minute with only one error.
-
User should be able to add bundle deal with no errors.
Summary
I conducted testing with five participants to make observations on how they interacted with the prototype and completed the tasks.
-
Method: Remote
-
Participants: 5
-
Age: 24-32
-
Average Time: 5 mintues
-
Error Rate: 60%
-
Task Completion Rate: 100%
Final Thoughts + Next Steps
Final Thoughts
With the prototype I have created, I believe I have met the goals that I outlined in the beginning of the design process. I designed an e-commerce website for Rivers & Reefs Pet Center that meet their needs along with their customers.
Next Steps
I recommend Rivers & Reefs Pet Center to develop a mobile native app and create a reward system in order to stay competitive.