📌Why I started the design challenge
UX Designing is a creative field where we can turn our ideas into reality. Learning new things and exploring new tech insights have always been very interesting and motivating for me to do. This was my first workshop session with UX Anudeep , so i was really excited when i finally got the opportunity to attend his workshop and working on my skills.
My Journey started with Anudeep’s 2-week Kickstarted Workshop that I joined to learn UX Design. In this workshop, I learned a lot of concepts like Fundamental Principles, Heuristics, How to build UI using Figma, Using animation. He made it easy to learn the ux principles in the best “non-boring” way possible.
With our introductory learning from the 2-week workshop, Anudeep gave us the confidence to start understanding existing designs of apps and solving a design problem.
This is how I started the UX Design challenge where I evaluated and improved the Search History Experience of the Meesho app.
📌My final redesign of Meesho’s Search History Experience
Before finalizing screen, Here is the comparison of the original screen and the Redesign. I will be talking about how I got to the solution in the later part of the article.
What is the solution and How does it help the users
In the final solution, I gave the option to filter the search history with the help of categories so that users can find the particular type of search item for ex: men, kids, women, electronic items ,etc.
I also gave an option of filtering things based on the time duration like 15–20 days old, and 30–60 days old so that the user is able to filter out things based on when they searched for them.
What Business Metric Does it affect
This helps reduce the time it takes for the user to go and look for a search from all the previous searches and hence reducing the Session Length and Drop-Offs in searching making it easy for users to search the desired items.
— 📍📍 How I Reached the Final Solution 📍📍 —
👉Reason I picked the App and the Flow
During the activities in the “Learning From Existing Design” workbook, I looked at various apps and tried to understand their design and updation needed.
Using the same method I narrowed it down to Meesho for this activity. Also, I felt it is widely used and has a very huge user base (includes seller as well as buyers)and any impact I will be able to make will impact a lot of people. And also it will be very easy to find users for user testing.
During the activities in the “Business Impact of UX Design” workbook, I looked at various apps to understand the Business impact designs are making. The workbook gave me a good understanding of how to impact not only the usability but also the Business.
I have picked the search flow because improving search flow would make searching efficient for the users which could have a great impact on the business metrics drastically.
Meesho is a popular Indian Online reselling platform . The platform has carved a niche for itself and has gained popularity among consumers and retailers alike by making online reselling and shopping hassle-free and affordable. Meesho provides secure and timely transactions, as well as low-cost returns and shipping. More than 2.6 million resellers throughout India
👉How I Understood and found areas for improvement in the Existing Design
With the learnings of the workshop’s “User Center Design” Workbook, I started to list down common sense questions and common sense answers on the Search Flow of Meesho and tried connecting it with the heuristic.
Heuristic principles are a set of rules of thumb that are based on common user behavior. They help to measure the usability of user interfaces.
Here are some of the questions and the answers I came up with:
🟢Heuristic principles applied
🔴Heuristic problems found
🟢Q — Why are the recent searches given
A — The recent searches help us quickly see what users recently looked for instead of having to remember what it was.
Heuristic — Recognition Rather Than Recall
🔴Q — How will users delete a search history or their mistyped items
A — It gives the user the control to delete a search history if the user likes to.
Heuristic — Control and Freedom , Error Prevention
🔴Q — How will the user find specific things in the search history to narrow down the search
A — It is difficult for users to find specific things because they have to scroll a lot to find specific things.
Heuristic — Flexibility and Efficiency of Use
👉Brainstorming for Ideas to Solve the Problems I Identified
From the problems defined in the evaluation stage, I came up with a few ideas which are listed in the image.
I had a discussion with my group to help me narrow down all the ideas.
The suggestions from the group were as follows:
- Idea 1: Sort/filter option at the top so the user can choose from the list of options
Suggestion: If both sort and filter options are kept together the user will find it difficult to identify which option is for sort and which is for the filter. - Idea 2: All the categories can be shown on the top, so users can choose these categories to narrow down their searches.
Suggestion: The Concept of categorization is already present on other screens of Instagram Search Flow so implementing this idea will maintain consistency inside Meesho. - Idea 3: There could be a search option, where users can search based on the category type which is provided as input.
Suggestions: The user might not remember the particular search keyword that was searched earlier
Based on the discussion I had with my group, I decided to proceed with Idea 2: All the categories can be shown on the top, so users can choose these categories to narrow down their searches. I chose Idea 2 because the categorization concept is already present in Meesho and the user need not learn how to use it in recent searches. This will also impact to decrease the session length and drop-off while performing a search.
👉How I Started Turning my Idea Into a Prototype (Low-Fidelity)
I felt very excited to draw my idea on paper and make my idea turn into a feature. I drew various screens with respect to the idea and defined the functionality of the various features introduced on the screen. I also defined the possible ways the categories will appear on top.
It felt even more exciting when making a prototype in the Marvel app. I used my learning from the “Low-Fidelity Prototype” Workbook to create a link and connect the screens.
It felt very unreal when I was able to see my app in action and was able to navigate from one screen to another using marvel.
I was able to navigate from one category to another and also was able to come back with the help of the prototype.
👉Making High-Fidelity Prototype
I used my learning from Anudeep about UI elements, how to replicate screens, and the “High-fidelity prototyping” workbook to create navigation from one screen to another and to use smart animation to make animation in an easy and attractive manner.
Then to make my designs look like real app designs I redesigned the basic elements of the Screen like the back button, profile image with text and deleting option on the right, a text button to clear the searches, and other header and subtitle text of the screen and placed everything according to the current layout.
After that, I created the category tab section which contains kid section, mens section, electronics section, etc and made different versions to show how they would look when they are selected and not selected. And also made a text button (Clear all) for each category which will delete everything in that category only. I have also given a cross button for every item present in the history so that users can remove a specific item or errors too.
I learned to use Figma’s prototyping tools and created the prototype where in the “Recent Category Tab” the user will see all the searches related to that category with recent ones on the top and oldest ones at the bottom. When clicking on the “Category Tab” the user will be navigated to the category of the variety of shopping items and will be able to see the search history related to category.
👉Validating if My Solutions Will Work through Usability Testing
Now that I have completed my designs as per the problem identified during the heuristic evaluation. I will be testing the design with the users to make sure they work and improve what does not work.
Since Meesho is a very known application and almost everyone uses it,
I went to random people at a mall to do the usability testing.
In usability testing, I went to the users and asked them to do the tasks to understand whether my design is understandable by the users and are the users able to use these.
Tasks are given to the user:
- Go to the search history?
- Can you select a category?
- Can you view the search history of a particular category?
- Can you clear all the history?
- Can you remove only a desired history?
Observation points I wanted to look at when the user was performing the tasks.
- Is the user able to understand the categeorisation?
- Is the user able to understand navigate properly b/w the categories?
- Is the user able to find that particular item ?
- Is the user able to find toys that he searched a month ago?
- Understand whether the user is able to understand the wordings of the top categories?
Insights got from Usability Testing:
- The user is able to understand the names given to the categories.
- The user is able to navigate b/w the categories and find the “history” for a particular category.
- Found it very difficult to find “saree” which was searched for a month ago. He had to scroll a lot to find the “saree” option even after navigating to the “category” as the “category” contained a lot of other searches during the past month.
📝Key Learnings
I had a lot of learning throughout my 2-week Kickstarter workshop that helped me to complete this challenge in such a short time
Learning from Existing Design:
One of the biggest perspectives Anudeep gave us was to appreciate and understand how things have been designed in a certain way from the user’s point of view.
Keeping this perspective in mind We did a lot of activities to practically learn about Heuristics and Fundamental UX principles. This non-textbook approach helped me to apply everything in a practical manner for this challenge.
This exercise helped me finding designs in every elements we are surrounded with and understanding its user experience.
Learning about UI elements:
I was able to create the screens for this challenge using my learning from the 2-week workshop. Anudeep taught us the basics about how screen sizes are decided for designs, what are the common elements that many app screens contain, and how elements are spaced. We learned several principles.
Learning in Usability testing:
To learn whether my designs are working as I am intending and understand what is working and what is not, I went to real users to learn the usability of the new design.
- I learned that the tasks I made should not bias the users.
- Also, the tasks should not lead the user, instead, the user should be able to understand by himself.
Anudeep showed us how the testing can be done and how we can observe the user’s behavior.
How the workshop has changed me:
The learnings that I have doing this 2 weeks workshop has been enormous. I had so many realizations.
Earlier I was following every process in a linear manner, but here after doing the workshop I got the realization that it does not matter if you follow the process, it should make sense to do the process and not the other way around.
There was a lot of time when I was stuck while doing the project and other participants of the workshop community helped me in unblocking my thoughts.
Anytime I was stuck with either the heuristics or the business metrics Anudeep was always there to clarify those things and help me in moving forward. And he helped to clear so many more perspectives regarding not just UX but UI, Job selection, and a lot more.
I not only feel more confident with UX concepts but I have also learned to collaborate, manage time, prioritize using reasons that made sense for UX and make good decisions.
Had a great learning experience !!
:)
