Implementing a Point-based Redemption System in the Bewakoof app within 48 hours

Aim to increase retention rate and reduce customer acquisition cost

Hey fashion enthusiast👋I know you’re browsing through your favorite fashion app, seeking that perfect outfit that reflects your style and makes you feel unstoppable. But what if there was more to it than just the thrill of finding the right garment? where each purchase becomes a gateway to endless rewards and discounts.

Say hi to my solution → “Star points” — where the joy of shopping meets the power of rewards🛍️💫

In this project,I have introduced a new feature to the Bewakoof app within 48hours which aims to positively impact business by improving specific business metrics. I did this project under the guidance of my mentor Anudeep Ayyagari

👇🤩Final output🤩👇

Note : The modal displaying the earned Star Points will appear after the completion of the payment process and the purchase details have been shown.

📝Index

[ 💡You can move directly to that section by clicking on the heading💡]

1. Context for my dear readers, that’s you!

• Problem statement
• Why did I choose to work on this feature?

2. A Tale of Two Solutions: The Evolution of Design from Idea to Usability-Tested Solution

• Newly implemented UI designs with reasonings
• Changes made to my proposed designs after testing with real users

3. From scratch to completion (Detailed work process)

• Moving toward clarity
• Understanding what’s best for business
• Is this enough or should I go beyond
• Prioritizing through Divide and conquer
• Understanding patterns through research
• Building a navigation path
• Playing with potential roadblocks
• Bringing life to my ideas
• Is my solution really working

4. Moment of the day🪄

5. Looking Ahead: Lessons Learned and Future Directions

• Scope for Future Improvement
• Key learnings

📍Problem statement

Business metric targeted:

• Increasing retention
• Reducing customer acquisition cost

👉 Increasing retention — By offering rewards that can be redeemed for discounts, free products, or other incentives, Bewakoof can incentivize users to keep coming back to their platform, increasing customer retention rates. Additionally, the rewards offered through the point-based system may encourage users to stick with Bewakoof over other competing brands, potentially increasing their lifetime value.

👉 Reducing cost acquisition — By offering users the opportunity to earn points for each purchase, we can incentivize them to return to our app or website and make more purchases in the future. This can help reduce the need to spend money on acquiring new customers, as we’re able to generate more revenue from our existing customer base. Offering a rewards program can make users feel valued and appreciated, which can increase their loyalty to your brand. This may even lead to word-of-mouth referrals, which can help acquire new customers without spending money on marketing.

📍Why did I choose to work on this idea?

The opportunity to work on gamifying the process was something that always interested me, so when it presented itself this time, I decided to take the chance and see how it could be implemented.

— — — — — — — —

🔝Go back to index🔝

— — — — — — — —

📍Newly implemented UI screens with reasonings

1. Discounted Price with star points
Added a new text below product price showing the discounted price using star points. This feature provides a clear and convenient way for users to see how much they can save on their purchase by using their accumulated star points.

2. No.of star coins earn for this purchase
I have Added a new section on the product details page that displays how many star points can be earned for the current purcahse using clear and straightforward language.

3. Star points details & usage
Upon clicking the info icon, a bottom sheet will open where users can explore the details of how star points are calculated and how they can help users save on future purchases.

4. Applying star points
Upon clicking the info icon, a bottom sheet will open where users can explore the details of how star points are calculated and how they can help users save on future purchases.

5. Star Points Redemption and Calculation Details
When users apply their Star Points for a purchase, the details of the redemption option are displayed in the calculation section on the checkout page. It shows the amount of points used and how much money was saved.I have also showed how much star points they earn for this purchase.

6.Earned Star Points Modal
- The modal appears after completing the purchase process, showing users how many Star Points they have earned for the purchase.

- The modal includes an animation at the top to engage the user and a green color “Congratulations” message to provide positive reinforcement.

- The earned Star Points are displayed prominently in the modal, so the user can easily see how much they have earned.

- The modal encourages users to redeem their points on their next purchase to save money.

- The CTA “Redeem Now” is highlighted to encourage users to take action and redeem their points.

- A cancel button is provided to give the user control over the modal and the option to close it if they choose.

I iterated this modal based on 2 aspects.

1. Usability
2. aesthetics

Each iteration aimed to improve upon the previous version by incorporating valuable elements and addressing potential issues. Here’s a breakdown of the iterations:

👉Initial design (Left card):

I introduced a captivating graphic to engage users and prominently displayed the number of coins earned. A congratulatory message was included to evoke a positive vibe, along with a brief description highlighting the benefits of the earned points. Additionally, I provided an option for users to view their collected points, allowing them to track their progress.

Need for moving on to the next iteration:

1. The graphic and the number of coins earned clashed with each other, causing a potential distraction for the user.
2. The spacing and alignment of elements within the modal felt unbalanced.

👉Improved design (Middle card):

In the next iteration, I took the good stuff from the first design. I kept the “See Your Points” button and added a cancel button for user control. I moved the congratulatory message below the graphic, making it green to give a positive reinforcement. I also ditched the unnecessary heading because the text was easy to understand.

Need for moving on to the next iteration:

1. When I shared this version with my peers, they suggested changing the “See Your Points” button to “Redeem Now.” It made sense because it would take users directly to the product page, where they might be more likely to make another purchase.

— — — — — — — — —

👇👇👇 Use the below playground to play with the prototype👇👇👇

➡️Changes made to my proposed designs after testing with real users

Feedback insight : When the user using their star points for their purchase, despite providing a clear visual cue that the points had been applied, This confusion persisted until users scrolled down to the final price structure. users may feel uncertain about the feedback/outcome for their action.

Changes made : I decided to move the element near the payment details at the bottom. Since users typically review pricing calculations before proceeding to checkout, placing the element near the pricing structure would provide more effective feedback. By seeing the impact of the star points before payment, users can make an informed decision. Additionally, this new placement makes it easier for users to identify the option to use their star points.

Feedback insight : Users were confused when they clicked on the “i” icon, which opened a bottom sheet modal. Confusion arose from the presentation of the star points calculation and information about how much they would earn for the amount they spent.

Changes made : To address this problem, I focused on providing clear communication about the point-based system in a simple and visually engaging manner. I made sure to draw attention to the star point section by using a bold heading and an easily recognizable icon. For the calculations and benefits, I presented them as easy-to-read bullet points. Overall, my goal was to simplify the information and make it easy for users to grasp.

👇👇👇 Use the below playground to play with the prototype👇👇👇

— — — — — — — —

🔝Go back to index🔝

— — — — — — — —

💡Moving toward clarity

To move from ambiguity to clarity I used the powerful tools I have. i.e Pencil and paper.

Sounds old school, right?

But trust me, it’s still a powerful tool. I used these tools for two main purposes,

1. Brain dumping
2. Wireframing

Brain dumping: After getting the problem statement, I had a lot of thoughts and ideas swirling around in my mind. To make sense of them, I wrote them down on paper and analyzed and prioritized them to determine what to implement in the timeline to achieve the best results.

Wireframing: I used pencil and paper to draw wireframes of the feature I was working on to gain a better understanding of the flow and to plan how it would be implemented in the app.

Note : In the upcoming topics, I will discuss the use cases, ideas, and how I prioritized the information I brain-dumped onto paper.

⚡Understanding what’s best for business

In this point-based system, users have multiple ways to earn their points, including :

1. For purchases
2. Referrals
3. Leaving reviews
4. Sharing on social media
5. Completing surveys

and redeem for,

1. Discounts for future purchases
2. free product
3. Early access to sales

However, to increase sales and revenue, I chose to focus primarily on the purchase earning & redemption option. While users can earn points through referrals, reviews, and social media sharing, these options may not lead to a significant increase in sales. By allowing users to earn points for their purchases, it not only rewards them but also increases the chances of repeat business. This is because users will need to make purchases to burn their points, which ultimately leads to increased revenue for the business in the long run.

🤔Is this enough or should I go beyond

While the point-based system for redeeming purchases is effective, I wanted to explore ways to make the process even more enticing for users to burn their coins more often. One idea I had was to gamify the process and tie it to a premium membership program.

Essentially, users progress through three levels by earning and burning a certain number of coins. Each level offers different benefits, and we can even link the levels to membership tiers to incentivize users to keep coming back and making more purchases.

🎯Prioritizing through Divide and Conquer

After considering different ideas and possibilities, I need to decide on what to implement and how to implement it. To prioritize my work, I divided the project into three phases:

1. The main path: This is the primary feature that I need to introduce within the given time and is what the users will be using.
2. Discoverability: This includes how the user discovers this feature and what additional features and details need to be displayed. There are two parts to it: one with easy-to-understand about what is these star points and how they benefit them and FAQ and the other with a section dedicated to this feature, displaying information on how much the user has earned and spent, as well as additional details they should know.
3. Increase revenue by connecting the feature to membership: This involves gamifying the process and linking it to a premium membership program. Users progress through three levels by earning and burning a certain number of coins, with each level offering different benefits. We can even tie the levels to membership tiers to incentivize users to keep coming back and making more purchases.

Given the time constraints, I prioritized designing the main path for the users to use the feature first. Then, I will work on improving discoverability and connecting the feature to membership, depending on the time available.

🔍Understanding patterns through research

I assume that many of my users are already familiar with other fashion-related apps and using them. As a result, they may be accustomed to certain patterns. If I use patterns that my users are already familiar with, it’ll make my business less risky and more likely to succeed. So I checked out some of the other fashion apps out there to see what they were up to.

🛣️Building a navigation path

I worked on creating a user flow to get more clarity about how I’m going to implement and how the flow is going to look (Using wireframes)

Brief flow : Product Page -> Add to Cart -> Checkout Page -> Apply Points -> Updated Price -> Complete Purchase -> Earned star points

Detailed flow:

1. User browses the product page and selects an item they want to purchase.
2. The product page displays the price of the item and the number of points the user can earn and redeem for purchasing it.
3. The user adds the item to their cart and proceeds to checkout.
4. The user can choose to apply their available points to the purchase by selecting the option to use their points.
5. The system updates the purchase price to reflect the discount from the applied points.
6. The user completes the purchase and the system deducts the used points from their points balance and displays gained points.

🚧Playing with potential roadblocks

Now that I have a clear understanding of what I am implementing and how I am going to implement it, I have taken a closer look at the potential use cases, error cases, and edge cases that may arise while designing this feature.

Use Cases:

• What information can the user view about the points they can earn for making a purchase?
• What information can the user view about the points they can use to make a purchase?
• How does the user apply their available points to the purchase and receive a discount?

Edge Cases:

• What happens if the user is not signed in, and cannot view their available points or earn new points?
• What happens if the user has not earned enough points to make a purchase and is unable to use their points towards the purchase?
• What happens if the user has more points than the total amount of the purchase, and is unable to use all of their points towards the purchase?

Error Cases:

• What happens if the system fails to display the correct amount of points that can be earned or used?
• What happens if the user’s points balance is not updated correctly after making a purchase?
• What happens if the user receives an error message when attempting to apply their available points to the purchase?

💟 Bringing life to my ideas

Once I got enough clarity on what and how i am going to implement my idea through brainstorming, research, and wireframing I started designing the UI screens.

I am attaching an image with some of the components I created for the UI that I am designing

— — — — — — — —

🔝Newly implemented UI screens with reasonings🔝

— — — — — — — —

🤔 Is my solution really working?

Now it’s time to test whether my solution is working or not. I conducted usability testing to understand and increase layer of Probability that my solution would actually work for users.

Major insights got from research,

1. When the user used their star points for their purchase, despite providing a clear visual cue that the points had been applied, This confusion persisted until users scrolled down to the final price structure. users may feel uncertain about the feedback/outcome of their actions.
2. Users were confused when they clicked on the “i” icon, which opened a bottom sheet modal. Confusion arose from the presentation of the star points calculation and information about how much they would earn for the amount they spent.
3. New users who are unfamiliar with the point-based system are confused about whether the points shown on the product detail page with the price represent the actual amount that will be deducted from their wallet or if they will be credited with additional points.

After falling behind on my timeline , At around 6.30 pm on Sunday 30th of April, I started redesigning the UI based the insights i analysed from the feedback.

👏👏A big thanks to my teammate Hariharan. Ko for helping me while designing and brainstorming ideas👏👏

— — — — — — — —

🔝Changes made to my proposed designs after testing with real users🔝

🔝Go back to index🔝

— — — — — — — —

🪄Moment of the day

🕑 Halfway through the 48-hour sprint. Just when I thought I had everything under control, my laptop decided to crash on me! 💻💥. I tried everything I could to fix it, but nothing seemed to work. Thankfully, I was at my sister’s place and used my brother-in-law’s office laptop.

As I frantically opened Chrome and signed in to Figma, I prayed for a miracle. 🙏 And guess what? Chrome decided to behave like a BFF and allowed me to access Figma! 🤩 It was like a scene out of a movie where the hero gets a lucky break at the last minute🎬

🚀Scope for future improvement

I would like to work on the following area in the future,

1. My priority is to enhance the discoverability of this feature which includes how the user discovers this feature, what additional feature details need to be displayed, and details of previous transactions using star points.
2. Working towards win-win: In addition to encouraging users to make a purchase, I plan to work on connecting this feature to three priority levels (diamond, gold, platinum) to incentivize them to become loyal subscribers. This will increase revenue for the business and provide benefits for users who are loyal to our brand.

🎁Key learnings from the journey

1. Harnessing the power of prioritization and execution is essential for achieving project success. Throughout my journey, I discovered the profound impact of strategic planning and effective task management
2. Recognizing and leveraging your strengths is pivotal in time-sensitive projects. It’s an invaluable lesson I’ve learned.

Thank you for reading, I hope you enjoyed my 48 hours of problem-solving journey. Feel free to share your feedback.

You can reach me through the following mediums,

Email — madhan2067@gmail.com
Linkedin — www.linkedin.com/in/madhan--kumar/