Urban Alagbo: Online Store For Medicinal Herbs And Teas

About Urban Alagbo
Urban Alagbo is a mobile store where people can order different kinds of medicinal herbs and teas.
Problem Statement
Pure herbal products are known to be of great medicinal value; but when not properly packaged and measured, they could have adverse effects on human health. Having access to neatly packed products delivered to consumers’ doorstep is a big issue.
My Role
UX Design
UX Strategist
Research
Deliverables
Prototype
Analysis
UI Mockups
Wireframes
The Challenge

Create an easy-to-use Mobile App for Urban Herbal Products

Our target was to create a strong business foundation that embraces a rapidly evolving environment and a more diverse user base.
Project goals
1. Create a fast and easy-to-use product for everyone, anywhere.
2. Give buyers more control over their choices and time.
3. Create a platform for seamless and better engagement.
Problems and Goals
1. Easy to use digital product
2. Give buyers choices
3. Carve out a strong customer base
Key Metrics
1. Is the product easy to use?
2. Do buyers have choices?
3. What is the acceptance rate?
Tools used
1. Figma
2. Lookback
3. Zeplin
4. Google Doc.
5. Google Form
Design Process

The Discovery Phase

Qualitative Research
I interviewed 10 potential users via video calls to understand the challenges they face when trying to buy herbal products/herbs from local stores and when ordering items online.
Key Insights from the Interviews

Many people consume herbs for (health reasons) and they want neat and well-packaged products with a professional feel rather than patronizing local stores.

Many people are interested in local herbal products, especially for their medical purposes but they are sometimes reluctant to go to local/traditional sellers who are considered backward and primitive in their handling of herbs and other related products. But after some thinking, it became clearer that (prospective) users/buyers want to have a digital platform that they can use with minimal effort. As we discussed further with them about our readiness to meet their needs, their expectations rose.
We discovered an opportunity to provide a great ordering experience for everyone, anywhere.
Quantitative Research
In order to observe what the behaviors of our potential users, questionnaire was sent out and a total of 32 people responded. This helped us to better decide what their needs are and to also proffer adequate solutions.
Key insights from the survey
1. People are willing to make use of a digital product rather than visiting shops.
2. A good number of herbal consumers are not entirely comfortable with physical shopping.
3. An online store would be beneficial to a lot of people.

Brainstorming

Based on the user interviews and online survey, we started brainstorming on some of the features that we can offer in the product.
Define phase
User Persona
With the data collected from the interviews and surveys, I created a persona representing an ideal user of the digital product. The persona helped us arrive at better solutions as it gave an in-depth understanding of the users' goals and frustrations and the overall personality.
Empathy Map
This process was carried out in order to define the target audience with more clarity, as well as illustrate their needs, pains, frustrations and actions. Empathy mapping helped us understand clearly what their thoughts and feelings are. The data I presented in the empathy map is based on the insights gotten from the user interviews.
User Journey
I made a visual representation of the user journey across all the touch-points of the digital product. This was done to help my team understand where we can improve the user experience.

Ideation phase

I created a flow on Miro board. This was done to illustrate how the users will navigate their ways while using the product.
Card sorting
Card sorting was done in order to categorize the most important features under different sections. This would further help in the arrangement of our information architecture.
Information Architecture
The card sorting results were further refined to match the goal of the product. Some of these features were then categorized further to make them easily accessible for the users.
Style Guide
It was important for us to use a style guide because we were two designers that worked on the project. It helped us maintain uniformity throughout the design process.RationaleI decided we use green as the primary color because it is associated with nature (vegetation) where herbs are gotten from. The selected shade of brownish yellow was also chosen because many herbs come in that form. The other chosen colors were there to complement the primary colors in data visualisation.We chose Muli for our text because we wanted it to be slightly bold so as to calm and thrustworthy.

Design Phase

I sketched the low fidelity prototypes on paper first. I then transferred them into digital designs after making some adjustments. After further testing, I designed the high fidelity prototypes. All these were done using Figma.
Testing Phase
After the completion of the visual designs, we tested them with various users from carefully selected locations. I tested them with FIVE participants adopting the use of unmoderated testing via a digital testing platform called Lookback. The users were implored to enable their front cameras so that their facial expressions could also be captured as they navigate through the application.
They were given the following tasks to perform:
1. Sign up
2. Select items from categories
3. Add to cart
4. Place order.
5. Select delivery option
6. Checkout

All the participants were able to navigate through the application fairly easily. They appreciated the cleanliness of the interface and also gave the following observations:

Implementing feedback

The suggestions from the usability testing were duly considered and I made some adjustments and inclusions in the new designs.

Other screens

Check Prototype Video Here
I have also provided the links for testing the prototypes. Please click the links to check them out.
Flow 1Flow 2
Reflection
Designing to solve users’ problems is an intriguing and a very interesting task to be part of.
My entire experience in this project is highlighted here as I had a great time exploring the empathetic mindset of a UX designer. I also had the opportunity to learn more about the processes involved. As a designer who already had a background in research, the experience also came in handy at some point and I was able to add more to my toolkit. I also learnt how to create a meaningful relationship with product users as this ultimately shapes the performance of any product. Overall, it was an interesting adventure!

Want us to work together?

Please get in touch by tapping on my email address below!