A. Requirement (or User story to be redesigned)
Improving the user on-boarding experience for first time user and the repeat user for an online meat ordering application.
B. Understanding the product story
Before solving for the part of the story it’s important to understand the entire product story holistically hence we dedicated the first set of meetings to take the complete dump from the product manager of the progress so far.
1. Target user
Non-vegetarian floating population in cities who love to eat home cooked food and also who are specific about the quality and hygiene of the meat
2. Positioning of the product and Market fit
The combination of the following three value propositions provides the product a unique position in the market where the closest competitor is far second position:
- The product positions itself away from the typical wet-market experience and helps meat eaters procure meat that’s hygienic and fresh.
- Not only that, the product also provides specificity of cuts uniquely tied to a meat loving user.
- Above all the product also promises a 120 minute door delivery
3. Reason for the redesigning the digital experience
The digital experience division of the product team conducted a series of user interviews among the existing user base and derived insights from the data which are as follows:
- The product’s digital experience team identified various points in the existing flow where there are avoidable and unnecessary drop-offs.
- The conversions on mobile and web are lower than the expected as user seem to be spending a lot of time in browsing. Means there is an intent to buy still the user ends up not adding items to the cart.
The reasons attributed to above two problems were poor product cataloging and incorrect information hierarchy at various levels (navigation, card design and flow design etc)
- One of the secondary revelations from the product research that emerged was users buying raw meat from app should be having a recipe in their mind. It’s very unlikely that the user do not have recipe in mind while ordering. Also any user (excluding the professional cooks and exceptions) will know only one or two recipes at any given time.
Hence, the product experience could be reimagined with recipes as central element. This was the new product feature around the recipe.
4. New features to the product
The new features envisioned by the product team were as follows:
- Take inputs from the user about their ethnicity, meat eating habits and recipes they know to cook etc through a chat like conversational interface.
- Suggesting recipes related to the cooking enthusiasts to motivate the user to buy more meat products outside their regular purchase list
NOTE: Since the number of recipes enlisted in the system is too low the product decided not to show recipe suggestions until a sizeable number is achieved.
C. Analysis of existing design solution
The internal design team had already worked on the solution which was in development. However, the product team wanted another take on the onboarding experience. We went through the design made in sketch and here is what we found:
1. User flow
Following is the existing design proposed by the internal team and two major observations from the user flow point of view.
One was a positive one which we continued to retain and the second one was a mistake which we removed.
1.1. Unnecessary permission for personalisation settings
The problem was delaying the user to the home page by unnecessarily asking for permission to personalise the homepage or not. This is one user flow node which is asking for drop-offs to happen.
Recommended solution
The solution proposed was to allow the user to the home page directly and on the homepage show a persuasively designed empty state which will be shown in final design
1.2. Retaining the decision to keep the address picker & value proposition combined but with some changes
There was a silver-lining decision in the design which was about combining address picker with the value proposition screen. It still needed a big makeover at various levels. The transformation is shown below:
2. Product writing
Good product writing has immense benefits to the product as follows:
- Builds the product image in the customer’s mind
- Creating bond with the customer
- Persuade the customer to convert
- Communicate the message with clarity
For more details please check the following link.
Following are the product writing recommendations we have for the redesign:
Above are major examples of product writing recommendations, however, there are many smaller improvements throughout the new design.
3. Information Design
One of the critical piece in any e-commerce platform is the cataloging and nomenclature of the products. It solves half of the searchability and findability issues.
We did a simple dissection of the names of the different category items and sorted them with the help of the category manager and the product team and we came up with the below which later helped in the nomenclature of the item which forms a part of the card design described later.
The card sorting exercise helped us to weed out the unwanted elements cluttering the names which are shown in black highlight
4. Interaction design
Three major problems identified in-terms of interaction design are
4.1. There was no primary CTA button leading to conversions
4.2. Over usage of the horizontal scroll browse in the home page, however, there we also included a new UI interaction that will help the user to skip to another block without scrolling
4.3. Too many interactions on a single card
4.4. Two unintuitive interactions leading to nowhere solving the problem hence we removed it from the design
5. Visual design
One of the fundamental aspects of visual design apart from color palette and typography is grid structure. The existing design didn’t use any grid structure. The basic visual design was improved by 50% with just fixing the grid structure as shown below
The color palette we retained the but change the gradient style a bit to make the light orientation from left to right instead of right to left
D. Conclusion
Following is the complete video of the click through prototype of the project to improve the on-boarding experience which looks something like this
You can find the complete summary of the project’s design decisions from start to end in the below table
Finally the product team had some concerns about the size of the image in the card, hence, we gave one more variation of the same and recommended to do an A/B Testing of the same
Following is the final presentation of the project presentation to the client
