UI/UX DESIGN
Dog Product Shopping App
DOGECART
DOGECART is a dog product mobile app that assists dog owners to purchase goods in a convenient way for their dogs.
Project Overview
The Problem
Some dog owners, particularly new dog owners, struggle to understand the ingredients of various dog foods.
The Goal
Help users understand the benefits of different dog foods for their dogs more easily and directly when purchasing dog food.
Summary
In this project, I conducted my research in a variety of ways. To begin, I search the Internet for relevant information (articles, books, etc.) to gather existing data. Then I interviewed some dog owners in my friends to see if they had any difficulties purchasing dog food.
*Click to see the prototype
My Role
UI/UX Designer
Visual Designer
Responsibilities
Researching, Creating digital wireframe, low and high fidelity prototype, conducting usability studies, accounting for accessibility, and iterating on my design.
Pain Point
-
There isn't much room on dog food packaging to convey enough information to the dog owner. As a result, many dog owners do not understand or learn about the various benefits of different dog foods for their dogs.
-
In many cases, the price of an on-site purchase is different from that of an online purchase. If the dog owners don’t specifically search for price information, they may miss out on saving.
-
Depending on where people live, the dog food they buy may be in the local language. This can result in language issues and inability to select the proper dog food.
Competitive Audit
Persona & Journey Map
Digital Wireframe & User Flow
Low Fidelity Prototype
The main user flow is the simulation of the user from the opening of our software to the successful purchase of the product.
Usability Study
Research Insights
Check out button is difficult to see
-
At the end of the entire purchase process, this critical function button needs to be clearly found by the user rather than having the entire smooth user experience interrupted by not being able to find the button.
The navigation bar does not attract the user's attention
-
The navigation bar is a useful navigational feature that users find useful to save them time, so it should be enhanced in later stages for visualization.
The main page has too many items to dazzle the user
-
At present, some users feel this problem, but do not exclude that it is because this low-fidelity prototype do not put the goods up. This problem needs to be tested again after the product is installed later.
Accessibility Considerations
-
In the visual design of the app, the color scheme has reached the AA or AAA level so that accessibility is considered.
-
Different language systems will be added to the app later
Recommendations
● Make the Check out button obviously.
● The visual design of the navigation bar in the later stage needs to pay attention to the contrast of colors to make it stand out.
● In the later hi-fi prototype, all the products on the home page were visualized, and then the participants were asked to check if there were still too many items that confused them.
-
The alt text is added to the image later to facilitate the detection of the image element by the screen reader.