UX case study: Shopclues consumer app redesign

Brief: Shopclues is an online marketplace in India that provides low prices & original-like quality products to customers. Its customers are largely from Tier 3 & 4 cities following Tier 2 &1.

Let’s start with the most common question asked when it comes to redesigning the app:

A design is an iterative process by its nature. Every product has its unique personality and it should fulfill its purpose.

Every product has a life just like humans and they upgrade themselves continuously. For ex, We change our clothes, we change our shoes, or most importantly we change our wardrobe to stay in trend while fulfilling our basic needs. This gives us satisfaction and joy, decreases the mental load, and helps us look different in the crowd.

And most importantly, with the unpredictable changes in the dynamics of the market, every business wants to increase its user base and revenue, and in this situation, the feature set tends to get bigger and more complex.

My goals for the redesign:

• To provide a personalized experience and intuitive user interface to the users
• Propose a more engaging and seamless shopping experience so that users purchase the desired product in

My personal goals:

• Take full ownership of the various roles involved in designing a product such as a User Researcher, User Experience Designer, and UI Designer.
• Enhancing my learning experience by challenging some design decisions and addressing their solutions.

I started this project voluntarily back in early 2021 because I always felt that the existing app seriously needs a redesign to raise the bar & experience and improve business metrics.

Soon after my joining, whenever I meet any person in the organization, everyone complained about the design and experience of the app. This pushed me and reminded my role and duty.

A good aesthetically pleasing design is the core principle of any product experience that the existing design was lacking. Good-looking products & user interfaces are perceived as more valuable and have more qualities.

And moreover, I wanted that experience design should get a seat on the table and build a design-driven culture.

Evaluate the end-to-end flow of the Shopclues app, which includes Storefront, search, product listing page, product detail page, filter page, cart-checkout, and payment, and redesign the experience while identifying opportunities to make usability better for the users which will lead to increase in conversion rate, decrease in bounce rate and increase user acquisition & retention.

Convincing the business and tech stakeholders for a complete redesign is a big challenge when there is significant cost involved. I struggled with this problem for almost 1 year.

During that period, I presented almost every prototype iteration to every person in the company whom I know or I were passing by them. They clearly saw the improvements in the new design. This activity informed them of the value of good design and increased my strength in convincing the stakeholders for the redesign.

In early 2022, when the design was taking final shape and after rigorous testing, I presented it to Anuraag — Managing Director of the business, and Ajay — VP of Technology, they quickly reviewed the designs and suggested a few changes. I compared the existing and new designs to them. After numerous meetings with them, they finally gave good to go for this.

Since I am responsible for the UX of the shopclues products pool and use it every day, I decided to do an in-depth analysis of the app first. I wanted to understand the functionalities, overall architecture, and navigation.

Every e-commerce app has a common flow like Home > Search > Listing page > Product Detail Page > Cart > Payment > Order placed. The only differentiator among the e-commerce platforms is good design.

Through the analysis, I was able to identify some clear issues and pain points:

1. Information architecture is broken
2. UI & Visual design are inconsistent & out of trend
3. Poor typography & colors
4. Accessibility & Usability issues
5. Improper use of icons and colors
6. Wrong interactions

Conducting user interviews:

I listed down some of the user research methods and chose to conduct telephonic interviews. Personal interviews were not possible due to the covid situation at that time.

I arranged a list of users who had placed an order in the last month and started calling them. But no one was actually responding and tried to cooperate. Almost every user cut the phone after hearing the call. I felt stuck here. This continued for at least 1 month.

Questions asked to know user behavior and perspective:

• Please introduce yourself such as name, age, occupation, etc.
• How was your experience in purchasing an item on the shopclues app?
• Why do you purchase online?
• Any other apps you use for online shopping and why?

Although 3 users responded out of around 60 calls, Some behavior insights from the interview-

Going through the App reviews:

I started looking for reviews on the Play Store. I reviewed the last 3 months’ reviews with below 3 stars to know the pain points of the existing users. They were mostly related to Tech, seller, and fraud issues.

Users mostly complained about login issues, seller fraud, wrong product issues, and delivery delay issues.

Nothing concrete came out from the reviews which might be helpful in the redesign.

Although I took these reviews seriously and ran a separate project over them to inform the responsible team and fix these issues. Many of the seller and refund-related problems were solved with this activity.

I decided to go with a UX audit & heuristic evaluation of the app. This approach is useful when you don’t have concrete data and bandwidth. This can solve most of the UX problems without going into the market.

I made some hypotheses also while doing the evaluation, let’s start screen by screen from Home to checkout:

After doing a UX audit & heuristic evaluation, I listed down the problems and iterated over them until reaching a final solution. I continuously tested the designs with random users after every iteration. This gave me validation of the solution.

1. Visuals and UI are not appealing
2. Shortened rating (4.5*) in the Product listing is not intuitive, users found a full star rating (****) more intuitive, quickly scannable, and understandable
3. Product listing information is still disorganized and cluttered, taking too much cognitive load to scan
4. Product detail page is still cluttered and taking too much cognitive load to scan
5. Discounted price section — (get this for as low as Rs.xxx) is difficult to understand and overwhelming
6. Cart page — too much information made it hard to scan and increased mental load, all upfront payment options increased visibility but increased decision-making time at the same time

1. Visuals and UI are still not appealing
2. Fixed shortened rating (4.5*) in the Product listing and converted it into a full star rating (****)
3. Product listing information is still disorganized and cluttered, added frequently used filters which the users find helpful while filtering
4. Product detail page is still cluttered and taking too much cognitive load to scan
5. Discounted price section — (get this for as low as Rs.xxx) simplified as compared to the previous iteration but 2/5 users still got overwhelmed
6. Cart page — collapsing all payments lead to a simplified payment screen but the screen is still overloaded with other elements and users are continuously tapping on the place order button after applying coupon and CB+, didn’t realize the payment option needs to be selected

So, I decided to change the font and color palette, and icons completely into a new theme

For Font:

I chose “MADA” After analyzing various google fonts:
• Free google font that is legible, and clean with a modernist and simplistic feeling
• Character differentiation, for example, a very common problem between “I” in large caps vs “L” in small caps.
• More characters can be adjusted within the same width as compared to other fonts I analyzed, which means more info with looking cluttered and beautiful at the same time.

For Colors: I chose to go with subtle and fresh colors which are soothing to our eyes yet communicate the emotion and fulfilling the purpose. After testing a lot of variations, finally came up with a fresh and new palette.

Icons:

Due to bandwidth and time constraints, I preferred to go with open-source icons from feather icons. It is a beautiful library of well-designed icons. It was perfectly suited to my requirements. Although I used almost 50% icons from the library and 50% custom designed.

I prepared an end-to-end prototype with the above screens so that the users can test them with as much control as possible. I gave them a task to purchase a cheap black t-shirt for me.

I tested the prototype with 4 users with the old vs new flow.

Insights from usability testing

The story has not ended here. This is the most important flow in the shopclues business that I tried to crack with a good design. Due to some high-level business changes, this redesign project is stuck in the early development plans. I am trying to redesign the rest of the flows as well when I get some clarity in the business plans.

Convincing stakeholders for a complete redesign is the hardest challenge in every organization. I also faced the same issue but overcame it by continuously:

• Keeping in touch with the stakeholders
• Talking to them about how design can influence business metrics, educating them about good design by giving some proven experiments
• Last but not the least, talk every day with the developers about the UX problems, because they are the ones who give life to the designs

Gathering user insights was very hard for me in that phase. Without knowing your users, you cannot empathize with them, you don’t know their pain paints. You cannot do everything alone. You need a team. I realized this when I was talking to the users alone. Although I aligned a CS agent to capture user insights that were also not helpful.

In the beginning, I was a bit nervous as I knew this would be a lot of work for me as the only designer. But, despite my fear and nervousness, I knew this was the perfect opportunity to hone my design skills.

I learned a lot while doing this, how to convince the stakeholders, and how to design a product from start to end. I learned about figuring out what works & what doesn’t and implementing them. The learning process is continuous.

I feel this is step 1 that I have initiated, a lot more is on the table.

Understanding user better
Thorough user research
Design can be much better

And that’s a wrap. I end my case study and hope that you found some great insights. I am always open to feedback, so do drop a comment for any feedback/ suggestions/ discussions, drop me a message at iampixelyoda@gmail.com, or connect on LinkedIn.

Thank you for reading!