Tajir (YC W20) App UI/UX
I was brought onto the Tajir team to redesign the UI of their app and make it more user-friendly. Since this was a remote project, I had regular meetings with the researchers based in Pakistan who would be gathering insights from field studies. The redesign was tackled systematically, starting from specific item cards to the home page.
Year
2022
Role
UI/UX Design
Tajir was the first wholesale grocery supplier in Pakistan with an app - the challenge this entailed is to break the traditional narrative and make it the norm for grocery stores to use Tajir, rather than a distributors on-site salesman. Tajir needed a redesign to make their app simple, aesthetic, and easy to use in order to become the main supplier for grocery stores across Pakistan and increase customer onboarding.
PROBLEM STATEMENT
Project Goals
Improve app functionality to be a seamless process
Make Tajir the #1 option for grocery stores
Fine-tune parts of the app to make it more curated for our target audience
Become a priority supplier, not an out of stock optionGather insights on current app experience from grocery stores using Tajir and execute a feedback-driven redesign of the app to fulfill core customer needs.
APPROACH
Research Methods
Customer interviews
Prototype testing & feedback
Information Architecture
Market/competitor research
User journey mapping
Field studiesFindings
Customer priority
High-intent clients would usually use the app when they are out of stock on specific items, making us a backup and second priority.
Grocery stores would rather wait a day or two for a company's distributor to show up and buy directly from them. If the scheduled visit is far off, only then will they check the app and place an order.
Culture
Pakistan being a developing country is something we really had to take into account. Technology and use of apps isn’t as prevalent in comparison to U.S., meaning the average user would find it challenging to use the Tajir app.
Keeping this in mind, we had to prioritize information architecture and keep everything as straightforward as possible, so that even a 9 year old child could navigate through it with ease.
Time sensitivity
When we asked stores why they don’t check our app when a distributors salesman is arriving, they said “We don’t have time!”
This is because per-unit prices aren’t displayed neatly and neither are margins. Item cards are difficult to read making it time consuming to re-stock their whole store through an app; users would rather speak to an on-site distributor.
After collecting and evaluating all the initial insights, we pinpointed the areas of the app that required a redesign and tackled each area methodically.
Once an area was redesigned, we would get feedback from customers and staff. If feedback was positive, handoff to developers would be instant and the app would be updated on a bi-weekly basis.
STRATEGY
Phase 1
Before
After
Corrections made: - Quantity & volume icons: color, size, and placement. - Price per unit is now shown. - Image quality.
Item Card - UI
- Users now able to add items to their cart directly from the item card, this was previously a 2-step process. - Added limited stock & OOS variations. - Added a “remind me” feature on OOS items which sends the user a notification when that item is back in stock; we saw in increase in user activity with the integration of such notifications.
Item Card - UX & VariationsPhase 2
Issues:
- Product picture is too small and in a bad location.
- Quantity icon is hidden.
- Page is too cluttered.
- Irrelevant information taking away from what the user needs to see.
Product Page - Pre redesign
Corrections made:
- Product picture and quantity icons can be clearly seen.
- “You might also like” & “Users also bought” sections added. Sale volume increased for items displayed here.
- Favorites & Share icons added.
- Overall UI.
Product Page - RedesignedPhase 3
Issues:
- Customer feedback revealed that a majority of users shop by searching through categories, which was a very disorganized part of the app.
- Not enough items displayed on the home page for users to shop from.
- Users experienced difficulty locating past orders. This is important since our audience is wholesale grocery stores and they typically order the same items when re-stocking.
- Overall UI.
Home Page - Pre redesign
Corrections made:
- Categories displayed as a horizontally scrollable list. Feedback was positive; shopping was easier for users.
- Past and in-progress orders on home page so returning customers see everything they typically need in one place.
- Customers are able to shop from the home page from “Popular Items,” “Recommended For You,” and more.
- ‘Favorites’ and ‘Profile’ sections added to increase app personalization.
- Navigation bar reworked with better UI.
Home Page - RedesignedLearnings
The value of time
I realized that time was the main factor behind our core customer needs; users would be hesitant to use our app initially because of how long it would take them to place an order, so simplifying this process was key to their satisfaction. This was achieved by making the home page a dashboard where users can easily navigate around the app; implementing the option to add an item to your cart directly from the item card also played a role in minimizing the time to order.