Discount Screen: Food Delivery App Redesign
Discount Screen: Food Delivery App Redesign
Project Overview
Project Name: Discount Screen – Redesign for Food Delivery App
Type: Feature/UI Redesign
Role: UI/UX Designer
Tools Used: Figma, Prototyping
Made By:
Ajay
Ajay
Problem Statement
While discounts are a strong motivator for food ordering, many leading food delivery apps present them in a static, text-heavy format. This makes the experience transactional rather than enjoyable. The goal was to redesign the discount screen by adding micro-interactions that make the process engaging, encourage repeat orders, and enhance overall user satisfaction.
Goals & Objectives
Goals:
Make discount browsing and claiming an enjoyable experience.
Use micro-interactions to give feedback, delight users, and encourage engagement.
Increase the likelihood of repeat orders through an emotional, playful touch.
Objectives:
Audit current discount screens of leading food delivery apps to identify improvement opportunities.
Design a visually appealing layout with clear discount categories.
Implement interactive elements for tapping, claiming, and applying offers.
Ensure animations are smooth, fast, and enhance rather than distract.
Test designs with potential users to validate engagement.
Research Process
Methods:
Competitor analysis of food delivery apps (Zomato, Swiggy, Uber Eats).
Quick feedback sessions with 5 frequent food app users.
Key Findings:
Static discount pages feel dull and purely functional.
Users enjoy animations when they are quick and purposeful.
Visual cues and playful interactions can increase offer redemption rates.
Design Thinking Approach
Empathize: Observed how users interact with discount screens.
Define: Static visuals reduce excitement and engagement.
Ideate: Explored ways to gamify the experience with animations and interaction.
Prototype: Designed animated discount cards and clickable elements in Figma with motion prototyping.
Test: Gathered feedback to fine-tune animation speed and style.
User Persona
Name | Rahul Verma |
|---|---|
Age | 24 |
Location | Mumbai, India |
Description | A foodie who frequently orders online and loves finding the best deals. |
User Goals | • Quickly discover relevant discounts • Have a fun, engaging ordering experience • Easily apply offers at checkout |
Frustrations | • Boring, static discount pages • Hard-to-spot offers for favorite cuisines • No sense of excitement when applying a deal |
Ordering Frequency | Weekly |
Tech Comfort | High |
Device Usage | Mobile only |
User Journey Map
Stage 1 – Discovering Discounts
Rahul opens the app and taps on the “Discounts” tab. The playful animated cards catch his eye. “Nice! This looks fun.”
Design Opportunity: Create visually dynamic discount cards with hover/tap animations.
Stage 2 – Exploring Offers
He scrolls through categories with smooth transitions, making the experience feel fluid.
Design Opportunity: Use micro-interactions for swiping and expanding offers.
Stage 3 – Claiming a Discount
Rahul taps “Claim Offer” and gets a quick, satisfying animation with a confirmation pop-up.
Design Opportunity: Provide instant feedback that makes claiming an offer feel rewarding.
Stage 4 – Checkout
He sees the discount applied instantly with a cheerful micro-animation, adding a touch of delight.
Design Opportunity: Reinforce positive emotions at checkout to encourage repeat ordering.
Final Design & Features
Animated discount cards with hover/tap effects.
Smooth category scrolling with visual feedback.
Playful animations when applying discounts at checkout.
Outcomes & Impact
Increased offer engagement in user testing.
Positive emotional response from playful visuals.
Higher intent for repeat ordering due to memorable interactions.
Conclusion
The redesigned discount screen transformed a static, functional space into an engaging, delightful experience. By using micro-interactions strategically, the design added excitement to the ordering process, encouraged repeat engagement, and strengthened the emotional connection between the user and the app.
Recent Designs
Recent Designs
Recent Designs
Let's Connect
Passionate about crafting user experiences.
Ready to join your team
Phone
+91 82876 93428
aajaykrbhandari@gmail.com
Let's Connect
Passionate about crafting user experiences.
Ready to join your team
Phone
+91 82876 93428
aajaykrbhandari@gmail.com
Let's Connect
Passionate about crafting user experiences.
Ready to join your team
Phone
+91 82876 93428
aajaykrbhandari@gmail.com
Discount Screen: Food Delivery App Redesign
Discount Screen: Food Delivery App Redesign
Project Overview
Project Name: Discount Screen – Redesign for Food Delivery App
Type: Feature/UI Redesign
Role: UI/UX Designer
Tools Used: Figma, Prototyping
Made By:
Ajay
Ajay
Problem Statement
While discounts are a strong motivator for food ordering, many leading food delivery apps present them in a static, text-heavy format. This makes the experience transactional rather than enjoyable. The goal was to redesign the discount screen by adding micro-interactions that make the process engaging, encourage repeat orders, and enhance overall user satisfaction.
Goals & Objectives
Goals:
Make discount browsing and claiming an enjoyable experience.
Use micro-interactions to give feedback, delight users, and encourage engagement.
Increase the likelihood of repeat orders through an emotional, playful touch.
Objectives:
Audit current discount screens of leading food delivery apps to identify improvement opportunities.
Design a visually appealing layout with clear discount categories.
Implement interactive elements for tapping, claiming, and applying offers.
Ensure animations are smooth, fast, and enhance rather than distract.
Test designs with potential users to validate engagement.
Research Process
Methods:
Competitor analysis of food delivery apps (Zomato, Swiggy, Uber Eats).
Quick feedback sessions with 5 frequent food app users.
Key Findings:
Static discount pages feel dull and purely functional.
Users enjoy animations when they are quick and purposeful.
Visual cues and playful interactions can increase offer redemption rates.
Design Thinking Approach
Empathize: Observed how users interact with discount screens.
Define: Static visuals reduce excitement and engagement.
Ideate: Explored ways to gamify the experience with animations and interaction.
Prototype: Designed animated discount cards and clickable elements in Figma with motion prototyping.
Test: Gathered feedback to fine-tune animation speed and style.
User Persona
Name | Rahul Verma |
|---|---|
Age | 24 |
Location | Mumbai, India |
Description | A foodie who frequently orders online and loves finding the best deals. |
User Goals | • Quickly discover relevant discounts • Have a fun, engaging ordering experience • Easily apply offers at checkout |
Frustrations | • Boring, static discount pages • Hard-to-spot offers for favorite cuisines • No sense of excitement when applying a deal |
Ordering Frequency | Weekly |
Tech Comfort | High |
Device Usage | Mobile only |
User Journey Map
Stage 1 – Discovering Discounts
Rahul opens the app and taps on the “Discounts” tab. The playful animated cards catch his eye. “Nice! This looks fun.”
Design Opportunity: Create visually dynamic discount cards with hover/tap animations.
Stage 2 – Exploring Offers
He scrolls through categories with smooth transitions, making the experience feel fluid.
Design Opportunity: Use micro-interactions for swiping and expanding offers.
Stage 3 – Claiming a Discount
Rahul taps “Claim Offer” and gets a quick, satisfying animation with a confirmation pop-up.
Design Opportunity: Provide instant feedback that makes claiming an offer feel rewarding.
Stage 4 – Checkout
He sees the discount applied instantly with a cheerful micro-animation, adding a touch of delight.
Design Opportunity: Reinforce positive emotions at checkout to encourage repeat ordering.
Final Design & Features
Animated discount cards with hover/tap effects.
Smooth category scrolling with visual feedback.
Playful animations when applying discounts at checkout.
Outcomes & Impact
Increased offer engagement in user testing.
Positive emotional response from playful visuals.
Higher intent for repeat ordering due to memorable interactions.
Conclusion
The redesigned discount screen transformed a static, functional space into an engaging, delightful experience. By using micro-interactions strategically, the design added excitement to the ordering process, encouraged repeat engagement, and strengthened the emotional connection between the user and the app.
Recent Designs
Recent Designs
Recent Designs
Let's Connect
Passionate about crafting user experiences.
Ready to join your team
Phone
+91 82876 93428
aajaykrbhandari@gmail.com
Let's Connect
Passionate about crafting user experiences.
Ready to join your team
Phone
+91 82876 93428
aajaykrbhandari@gmail.com
Let's Connect
Passionate about crafting user experiences.
Ready to join your team
Phone
+91 82876 93428
aajaykrbhandari@gmail.com