Loading...

La Cuponera.

Mobile coupoun cashback application for Procter and Gamble

My Role:
UX ∕ UI Design ∣ Research ∣ UX writing ∣ Workshop facilitator
Tools:
Figma ∣ Miro ∣ Jira ∣ Slack ∣ Notion



In today’s world, everyone is looking for ways to save money. One of the most popular ways to do this is through mobile cashback apps. These apps allow users to earn cashback on their purchases, ultimately helping them save money. This application was designed, build and launched for Procter and Gamble’s Spanish and Portuguese market.

Download it on:

La Cuponera on App Store La Cuponera on Google play


. Background

Coupon marketing is a powerful and versatile strategy that can help businesses attract new customers, increase loyalty, boost sales, and enhance brand awareness.

The client approached us with the challenge of developing a mobile cashback application that could differentiate itself from the existing applications. The primary aim of the client was to address user retention, which had always been a challenge for mobile cashback applications. The client wanted to develop a platform that provided a seamless user experience, incentivized users to use the application frequently, and increased engagement.

I have joined this project in its begining as a remote Product Designer. I started with a concept, and needed to define a design process, which helped me break down this project into smaller, easier to handle steps.

The Challenge was to transfrom concept into MVP and launch it within 2 months.

. Research

Procter and Gamble provided research data from their already extensive customer base which helped speed up the research process and I have gained insights into users behaviors, pain points and preferences.

With my Product manager we have centered our research around competitor analysis in order to understand how other apps are addressing similar issues. Based on our findings we have identified features that were missing in the existing concept, such as refferal, in app and push notification, personalized recommendations.

Some key insights:
  • . Users can earn cashback for Procter and Gamble’s items they buy via scanning receipts.
  • . Design features to keep users engaged with the application and encourage them to make more purchases.
  • . Allow users to view offers without being sign up into application
  • . Cashback flow needs to be as simple as possible
  • . The ability for customers to securely link their bank accounts, allowing them to earn cashback automatically as they spend.
  • . Users can get cashback once they reach 10€.
. Wireframes

I started with sketches, which helped me determined direction, infrastructure and functions for the application and using the information gathered from the previous step and after few explorations of possible solutions and ideation I began to develop the wireframes. All my findings were always presented to and discussed with the stakeholders.

. Styleguide
. Mock ups

Once the wireframes were completed and approved, I moved on to creating more detailed and interactive mockups using a prototyping tool. This allowed me to test and refine the user experience and ensured that all functionalities were working as intended.

After testing the mockups with potentional users and receiving feedback, I moved on to finalizing the designs with detailed documentation for our development team and worked closely with out devs to ensure that the designs were implemented accurately and to troubleshoot any issues that arose during the development process.

Throughout the design process, I made sure to adhere to best practices for usability and accessibility, as well as ensuring that the design reflected the brand’s identity and aligned with the stakeholders’ vision for the application.

Onboarding

Introducing to you La Cuponera. Before signing up, the introductions will let you quickly understand what La Cuponera is and how this application can help you save money on your shopping with trusted PG brands. introduction screen for first time users, it can be utilized for returning users or for when there is an update to the app features.

This is benefits oriented onboarding – an app onboarding process that focuses on the app value, what it can do for the users, and how one achieves its end goal.

Create an account ∣ Log in

Users can choose to create an account with one–click registration or by filling in neccessary information in order to create an account. One click registration provides the user with a quick and efficient process to get registered without going into the hassle of creating a new account and providing all the information from scratch.

Autofocus is automatically activated in the first field in the registration form. In that way, we give a hint to a user where he should start and as a result, significantly boost the whole process. Moreover, you save users from one additional click or tap and a bunch of unwanted speculations.

Easy switching between “create an account ” and “log in ” in the case that someone does click the wrong option, user can switch easy between options located at the bottom.

Opt–ins ∣ Opt–outs

To follow healthy marketing practise mobile marketing opt–ins are an excellent way to proceed as it requires the consent of the user. Mobile opt–ins help brand to directly communicate with the consumer and maintain relationship with its users.

Home page ∣ Product page

The home page screen provides an overview of the hottest Procter and Gamble products for which the user can collect cashback. The homepage is divided into four sections: a category menu, where the user can choose from a desired category of selected products, the hottest products, a navigation section throughout the entire application, and the user’s profile and settings.

If the user opts–in to selected mobile marketing options during registration, the product selection will be specifically customized to their previous searches.

To select a desired product for purchase and receive cashback, the user clicks on the plus button. This action adds the product to the My Promotions page within the application. Alternatively, the user can click on the product to be directed to the specific product page. There, they can find more information and add the product to My Promotions from that page. On the product page, the user can also view how many purchases of the same product are necessary to collect cashback.

My promotions

My promotion page allows users to accumulate all the products they wish to purchase in order to receive cashback. Once the user has made their purchase at an offline shop, they can select the products they bought and upload a scan of the physical receipt which will be stored in the My Receipts page. Additionally, users can view an overview of how much potential cashback they can receive for the selected products.

My receipts

All the scanned receipts are stored in My receipts page. Users can see an information with an actual cashback they will receive and can track or check status of every receipt.

There are four statuses for each receipt:
Contact support − something went wrong with the receipt, the receipt is not valid, or the purchased product is not on the scanned receipt.
Scan me − the receipt might be blurry, was not scanned well, or is incompled.
Processing − everything is in order and receipt is being processed.
Approved − cashback is being added to a wallet.

Wallet

An overview of how much cashback users can receive and withdraw using their preferred method: Bank account, Bizum, or PayPal. The only limitation set by Procter and Gamble is that users can withdraw once they reach a limit of 10€. Before reaching this limit, users will receive notifications indicating how much more cashback they need to withdraw. After reaching 10€, it is up to the user to decide when and how to withdraw their cashback.

In addition, users receive a cashback bonus for every friend they refer to the application. We have created a small informative overview to show users how much cashback they have earned from referrals and how much cashback they can receive for buying products with cashback offers.

Profile

A profile page is a section where users can view and manage their personal information, settings, preferences, and activities within the app. It serves as a central hub for users to access and control their account details.

Notifications

I have opted for both push notifications and in-app notifications. Push notifications can boost conversion rates, stimulate user engagement with special offers or newly added products, and offer the opportunity to gain customer insights, which are important for refining and improving the application.

App reviews