EasyPay
One-Tap Access to Local Deals and Effortless Merchant Transactions
Duration
5 months
June 2022 - November 2022
Stakeholders
Founder, CTO, Product Manager
Team
Tejasvi Shiv (me)
2 App Developer
My Role
In this pivotal project, I was the sole designer, spearheading the ideation and refinement of key app features alongside stakeholders. My responsibilities spanned the entire design spectrum, from developing the information architecture to crafting intricate micro-interactions. I single-handedly executed sketches, wireframes, wireflows, and a comprehensive design system, culminating in a polished, high-fidelity prototype for both customer and vendor interfaces.
Skills
Information Architecture
Competitive Analysis
Contextual Inquiry
User Flows
Wireframes
Design System
UI Design
Interaction Design
Hi-Fidelity Prototype
Tools
Figma
FigJam
Illustrator
Google Docs
Google Sheets
Overview
About
This UX case study explores a dynamic shopping rewards app to enrich customer and vendor experiences. Customers enjoy cashback rewards by paying through the app at affiliated shops, enhancing their buying power. Vendors gain access to a comprehensive CRM dashboard, transaction tracking, and a customizable discount system, fostering a unique ecosystem where both parties thrive through mutual engagement and benefits.
Product Vision
Our vision is to revolutionize the shopping experience by intertwining convenience, rewards, and business insights. The app aims to create a seamless transaction ecosystem by bridging the gap between customers and vendors. Enhanced by rewards and discounts, it aspires to cultivate loyalty, increase vendor visibility, and promote a sustainable cycle of growth and customer satisfaction.
Context
In this project, I was presented with a rudimentary low-fidelity design that was the cornerstone for understanding a nascent startup's vision. Tasked with transforming this preliminary concept into a structured and compelling app proposal, my journey began by meticulously refining and expanding the initial ideas to create a well-defined feature set aimed at captivating potential investors.
Here's the DOCUMENT I received at the beginning of the project.
Problem
UNRAVELING THE KNOTS OF CORE CHALLENGES
Shoppers today grapple with a disjointed and time-consuming process to locate and engage with local deals due to the absence of a unified platform. This scattered approach dilutes the shopping experience and complicates transaction handling. Simultaneously, local merchants contend with the cumbersome task of transaction management, business promotion, and customer engagement tracking without a cohesive support system.
CHALLENGE
How might we craft an app that boosts shopping rewards and vendor insights, revolutionizing customer and business experiences?
Objectives
CHARTING THE HORIZON BY DEFINING GOALS
Solution
SCULPTING PATHWAYS THROUGH INNOVATIVE SOLUTIONS
Frictionless Payments and Instant Rewards
"Easy Pay" revolutionizes deal-hunting with its unified discovery engine. By consolidating deals and loyalty programs from numerous merchants into one intuitive platform, it eradicates the clutter of navigating through multiple apps. Customers now have a singular destination for personalized offers, making finding the best deals effortless and enhancing their shopping journey.
Dynamic Transaction Dashboard
Addressing merchants' need for efficient transaction management, "Easy Pay" introduces a real-time dashboard. This tool illuminates every transaction, offering functionalities like transaction flagging to spotlight priority sales. It’s a game-changer for merchants aiming to streamline operations and elevate customer service.
How did I reach here?
User Interviews
In the quest to truly understand the heartbeat of our potential users, I conducted 5 semi-structured interviews with both customers and vendors. My aim was to understand their needs, frustrations, and what they look for in a payment app. This helped me gather real insights to guide the design process for "Easy Pay,"
Some of the questions I asked...
-
"How do you currently discover and interact with merchants for your shopping needs?"
-
"Can you describe a recent experience where you felt frustrated during an online payment?"
-
"What features do you look for in a digital payment platform to consider it beneficial?"
-
"As a merchant, how do you manage promotions and interact with your customers digitally?"
-
"Have you faced any challenges in maintaining loyalty among your customers? If so, how?"
-
"What improvements would make your shopping/payment experience more satisfying?"
"Finding deals feels like a treasure hunt without a map. It's overwhelming and time-consuming."
"As a merchant, I struggle to keep track of promotions and which ones actually bring in customers."
"I just want a simple way to pay and get rewarded without jumping through hoops."
"I've stopped using some apps because I couldn't figure out their reward system. It felt pointless."
1. Simple and Rewarding Shopping
We wanted to make earning rewards feel like a breeze for our users. The idea was to design a system where every purchase through the app felt like a win, encouraging users to keep coming back.
2. Powerful Tools for Vendors
My goal was to give our vendors everything they needed right at their fingertips. From tracking sales to handling customer issues, I aimed to make managing their business as straightforward as possible, enabling them to focus on what they do best.
Competitive Analysis
IDENTIFYING OPPORTUNITIES AND CHALLENGES IN THE REWARD BASED PAYMENT ECOSYSTEM
Top User Needs
Rewarding Loyalty Programs
Tailored loyalty programs for individual preferences.
Intuitive Deal Navigation
Quick and personalized deal navigation.
Assured Transaction Security
Transparent and secure transaction processes.
Easy tools for creating and tracking promotions.
Simplified Promotion Management
Direct Customer Feedback
Direct access to customer insights and feedback.
Enhanced Visibility and Discovery
Features to enhance shop and deal discoverability.
User Personas
UNDERSTANDING OUR DIGITAL USERS
Information Architecture
CRAFTING THE DIGITAL BLUEPRINTS
We explored the competitive landscape to identify market gaps and opportunities, shaping a unique value proposition that differentiates us in the competitive market.
Takeaways & Insights
1. Expand on the cashback feature by offering broader applicability beyond the app, including direct bank credit options.
2. Create a more inclusive rewards system that caters to a wider audience, not just credit card users, and offers flexibility in reward redemption.
3. Simplify the rewards and cashback experience, ensuring users can easily track and redeem their earnings without being overwhelmed.
4. Balance the value proposition for both merchants and consumers by offering compelling rewards for payments and purchases, enhancing the overall ecosystem appeal.
High - Fidelity Prototype
BRINGING CLARITY TO LIFE
Customer Side
Merchant Side
Reflection
WHAT I WOULD HAVE DONE DIFFERENTLY?
1. Consistent Updates Matter
Keep stakeholders informed with regular updates. Transparency builds trust; avoid going silent.
2. Rationale Over Assumption
Never assume understanding. Clearly articulate your design decisions to maintain alignment with stakeholders.
3. Flexibility Is Key
Stay open to the design process's unexpected turns. Adaptability in the face of new insights and stakeholder feedback is crucial.
4. Design as a Team Sport
Engage non-designers in the design rationale, fostering a shared understanding and collaborative environment.
Sketches
THE FIRST STROKES OF IMAGINATION
Customer Side
Click HERE to view the Information Architecture
Vendor Side
Sketching breathed the first spark of life into our concepts, transforming abstract ideas into tangible visuals. These initial drafts were instrumental in garnering early feedback from the core team, aligning everyone’s vision for the product. It was a collaborative effort that set the stage for more detailed design work, ensuring we were all moving in harmony towards a common goal.
Merchant Side
#1 Onboarding (First time users/Existing users)
User lands on the Home Page
Clicks on "Get Started"
Completes Onboarding
Lands on Home Page
Clicks on "View Verification Status"
Representative comes over to the shop to verify
Merchant recieves the Verification ID
Shop is verified & listed in the app
Wireflows
MAPPING THE USER JOURNEY
Thank You!
Customer Side
#1 Onboarding (First time users/Existing users)
User lands on the Splash Screen
Clicks on “Get Started”
Fill the basic needs
A pop-up appears to allow "Location Detection"
Lands on the Home Page
3. Extra Perks for Dual Users
Recognizing that some of our vendors also shop on the platform, we thought, why not reward them twice? So, we integrated additional discounts for vendors when they shop, aiming to create a sense of community and mutual support.
4. Minimalist Yet Engaging Design
We strove to strike the perfect balance between simplicity and engagement. It was important to us that our app didn't just look good but felt intuitive and fun to use, ensuring that every interaction was smooth and enjoyable.
User needs by User Testing
CRAFTING CONSISTENCY: BUILDING THE DESIGN SYSTEM FROM THE GROUND UP
Visual Design
NAVIGATING EASYPAY'S AESTHETIC JOURNEY FROM FIRST TOUCH TO LASTING EGAGEMENT
Interactions
CRAFTING DELIGHTFUL MOMENTS
#2 Existing User Views Transaction of his/her Shop
User lands on the Home Page
Switches from shop X to Y
Goes to Transaction page
Applies filter
Views filtered results
1. Added Favorites action in the Bottom Navigation Bar
Initially the favorites action was in my profile section, but after user testing, we observed that users were finding it difficult to find the favorite section. That was a section a user preferred to go frequently since that is where they had added shops they liked/trusted/visited frequently.
2. Added progressive disclosure for “About the Merchant” and “Reviews”
The users were overwhelmed with so much information about the shop and were getting confused. So I designed a progressive disclosure for “About the Merchant” and “Reviews” to reduce cognitive overload and increase white space in the design.
Business needs by stakeholders
CRAFTING CONSISTENCY: BUILDING THE DESIGN SYSTEM FROM THE GROUND UP
1. Removed Quick Filters
Quick filters were removed so the users attention would go to Featured Merchants, thereby increasing the profit
2. Added extra layer of onboarding for merchants
I added a link at the bottom saying “Have a business account? Verify” for existing merchants to get verified before using the app as a Customer for making the login/signup efficient.
The development of the design system from the ground up was a labor of love. It was about more than just aesthetics; it was about creating a consistent language that could seamlessly bridge the gap between design and development. This system became the cornerstone of our collaboration, enhancing efficiency and ensuring that no matter the scale of our team, our app’s design would remain cohesive and recognizable.
Design System
CRAFTING CONSISTENCY: BUILDING THE DESIGN SYSTEM FROM THE GROUND UP
Click HERE to view the entire Design System
Effortless Onboarding
Embarking on the Easy Pay voyage begins with simplicity itself. A user's entry into the world of Easy Pay is as straightforward as entering a mobile number. Our system intelligently discerns between new voyagers and returning travelers, guiding them through a streamlined login or sign-up process. This first touchpoint sets the tone for the simplicity and efficiency that defines the entire app experience.
Brainstorming
UNLEASHING CREATIVITY WITHOUT BOUNDS
Dynamic Rewards Customization/Community Support Through Discounts/Enhanced Security for Reward Updates
Easy Pay empowers merchants to craft and adapt their rewards system with ease, offering the ability to set spending brackets and tailor rewards accordingly. This feature is enriched with a unique capability for merchants to support one another through exclusive discounts, fostering a thriving business community. Ensuring utmost security, changes to rewards require OTP verification, exclusively allowing the business owner to make updates, thus protecting the integrity of each shop from potential internal scams.
Intuitive Search
Discoverability is key in "Easy Pay." Our search isn't just a feature; it's a guide, offering keyword suggestions to help you find exactly what you need without the guesswork.
Seamless Location Change
Exploring new shopping locales is as easy as a swipe. Change your shopping location with a card that slides up, then dismiss it with a downward flick, inviting exploration with every swipe.
Prioritizing with Flags
Important transactions shouldn’t get lost in the crowd. Flagging a transaction elevates it to the top, ensuring that your most crucial dealings are always in sight, thanks to a smooth card transition that’s both functional and visually pleasing.
Prioritizing with Flags
Important transactions shouldn’t get lost in the crowd. Flagging a transaction elevates it to the top, ensuring that your most crucial dealings are always in sight, thanks to a smooth card transition that’s both functional and visually pleasing.
Favoriting Merchants
Tap a heart to favorite a merchant, turning a simple selection into a gesture of preference, making your favorite spots stand out in the crowd.
#2 Explore from Homepage
User lands on the Home Page
Changes the location
Looks at the "Top Deals" in that area
Clicks on "View All" to view other shops
Selects one shop and views details
Takes you to "Merchant" Screen
Likes the deal and adds it to favorite
#3 View Credits
User lands on the Home Page
Clicks on the "Credits" widget
Realizes that he has many credits in X shop
Goes to that shop on the weekend to buy groceries
Uses all the credits available and pays the remaining amount by debit card
Earns Y credits from the purchase made
Views the transaction & downloads the receipt
#4 Finding Merchants from Categories
User lands on the Home Page
Search/Selects a category/view list of merchants
Views a shop
Pays via UPI/Wallet Money
Earns 10% cashback
#5 Add Payment Methods
User lands on the Home Page
Goes to Account Screen
Selects "payments"
Adds a new card
Views newly added card
#3 Editing the discount of a shop
User lands on the Home Page
Goes to "My Account Page
Edits the current discount
Enters OTP to verify
The creation of the high-fidelity prototype culminated our design journey, transforming static UI designs into a dynamic, interactive experience. It served a dual purpose: to captivate potential investors and provide a tangible feel of the app’s functionality without needing code. This prototype was not just a pitch tool; it was our vision made real, a peek into the future of how our app could change the lives of its users.
Reviews & Iterations
Celebratory Payment Success
After a successful payment, a cheerful animation brings joy, marking the moment. Then, as users share their experience, a quick snack bar thanks them, making feedback feel valued and effortless.
1. Deeper User Engagement
Prioritize contextual inquiries and user interviews for richer insights.
2. Early Validation
Implement quick user testing post-wireframe to validate designs sooner.
3. Quantitative Analysis Post-Prototype
Conduct user testing after high-fidelity prototyping to gather SUS and Likert scores for precise improvement areas.
A Search Odyssey
The quest for the perfect deal or merchant is redefined in Easy Pay with a search experience that anticipates and assists. With illustrative examples and proactive suggestions that spring to life after just four letters, our search journey is a testament to efficiency. Coupled with quick filters that sharpen the focus, we ensure that what you seek is easily found and discovered.
The Rewarding Conclusion
The climax of the Easy Pay narrative is a transaction experience that's as satisfying as the culmination of a well-told story. Users navigate through various payment avenues, each leading to immediate rewards. It's here, in the moment of transaction, that users see the tangible value of their journey—credits earned and spent within a vibrant ecosystem of shops and services.
In the digital tapestry of Easy Pay, every thread is woven with the user at its core, creating a seamless blend of functionality and aesthetics. Our journey through the app's design landscape unveils a story of intuitive interactions and meaningful engagements, designed to make financial transactions not just easier but also more rewarding.