TFR Revamp
TFR Revamp
Turning Rewards Into Experiences
Turning Rewards Into Experiences
About MPL
About MPL
MPL (Mobile Premier League) is a mobile gaming platform that offers a wide range of skill-based games across genres such as puzzles, sports, arcade, and casual competitions.
MPL (Mobile Premier League) is a mobile gaming platform that offers a wide range of skill-based games across genres such as puzzles, sports, arcade, and casual competitions.
What is TFR?
What is TFR?
TFR stands for Tasks for Rewards. It’s a mission system where users complete tasks to earn rewards. These tasks are tied to different games, encouraging players to spend more time in gameplay and explore a wider variety of games.
TFR stands for Tasks for Rewards. It’s a mission system where users complete tasks to earn rewards. These tasks are tied to different games, encouraging players to spend more time in gameplay and explore a wider variety of games.
Team & Role
Team & Role
Raslan
Raslan
Product Designer
Product Designer
Swaraj
Swaraj
Illustrator
Illustrator
Vishnu
Vishnu
Motion Designer
Motion Designer
Sivam
Sivam
Product Manager
Product Manager
Mahesh
Mahesh
Developer
Developer
Worked end-to-end from user research and behavioral analytics to prototyping and final visual design, collaborating with developers to fine tune motion and feedback timing.
Worked end-to-end from user research and behavioral analytics to prototyping and final visual design, collaborating with developers to fine tune motion and feedback timing.
The Business Problem
The Business Problem
The Product Manager approached me with a request to revamp the TFR UI because it wasn’t performing well.
The Product Manager approached me with a request to revamp the TFR UI because it wasn’t performing well.
However, the real issues surfaced through metrics were:
However, the real issues surfaced through metrics were:
Low Task Completion Rate
Low Task Completion Rate
Low Reward Claim Rate
Low Reward Claim Rate
These numbers suggested a deeper issue than visuals, something in the user journey and motivation loop was broken.
These numbers suggested a deeper issue than visuals, something in the user journey and motivation loop was broken.
Shifting the Question
Shifting the Question
Instead of asking “How do we redesign this screen?”
Instead of asking “How do we redesign this screen?”
I reframed it to:
I reframed it to:
“Why are users not completing tasks or claiming rewards?”
“Why are users not completing tasks or claiming rewards?”
This shifted the project from UI Redesign to Experience Investigation.
This shifted the project from UI Redesign to Experience Investigation.
Research Phase
Research Phase
I evaluated the current flow against usability principles.
I evaluated the current flow against usability principles.
Current Design
Current Design
Entry point to the TFR screen
home screen widget
TFR screen
CTA to play games and complete tasks
Gameplay screen
Game lobby
Findings
When a user clicks Play on the TFR page, the game begins right away. But once the game ends, they come back to the lobby screen and there’s no immediate feedback about task progress. To check the progress, users have to leave the game and go to the home screen to access the TFR screen.
When a user clicks Play on the TFR page, the game begins right away. But once the game ends, they come back to the lobby screen and there’s no immediate feedback about task progress. To check the progress, users have to leave the game and go to the home screen to access the TFR screen.
Users often don’t realize when they’ve actually completed a task. Even when a reward is ready to be claimed, there’s no clear indication, so many miss out on collecting it.
Users often don’t realize when they’ve actually completed a task. Even when a reward is ready to be claimed, there’s no clear indication, so many miss out on collecting it.
They also don’t know where to claim their rewards.
They also don’t know where to claim their rewards.
The TFR screen consists of many filters which makes it overwhelming for the users to navigate.
The TFR screen consists of many filters which makes it overwhelming for the users to navigate.
Sometimes the TFR widget is placed on the bottom of the home screen if some widgets of high priority shows up. This again makes it difficult for the users to find the TFR screen.
Sometimes the TFR widget is placed on the bottom of the home screen if some widgets of high priority shows up. This again makes it difficult for the users to find the TFR screen.
Guided Usability Testing
Guided Usability Testing
I conducted moderated sessions focusing specifically on how users interacted with the reward system.
I conducted moderated sessions focusing specifically on how users interacted with the reward system.
Key Observations
Key Observations
Users felt tasks were overwhelming.
Users felt tasks were overwhelming.
After gameplay, they were redirected to the lobby with no progress feedback.
After gameplay, they were redirected to the lobby with no progress feedback.
Users questioned whether their progress was counted.
Users questioned whether their progress was counted.
Some assumed tasks reset.
Some assumed tasks reset.
There was a disconnect between effort and acknowledgment.
There was a disconnect between effort and acknowledgment.
Discovery — The Experience Gap
Discovery — The Experience Gap
Users couldn’t see progress at the moment it mattered most - immediately after gameplay.
Users couldn’t see progress at the moment it mattered most - immediately after gameplay.
Competitive Research
Competitive Research
To better understand how successful gaming platforms drive engagement through rewards, I conducted a comparative analysis of popular mission and progression systems across the industry. The goal was to identify recurring patterns that encourage users to continue playing and completing tasks.
To better understand how successful gaming platforms drive engagement through rewards, I conducted a comparative analysis of popular mission and progression systems across the industry. The goal was to identify recurring patterns that encourage users to continue playing and completing tasks.
Research Focus
Research Focus
How reward progress is communicated
How reward progress is communicated
Structure of mission and milestone rewards
Structure of mission and milestone rewards
Post-game feedback loops
Post-game feedback loops
Visual hierarchy and task clarity
Visual hierarchy and task clarity
Motivation triggers that encourage repeat gameplay
Motivation triggers that encourage repeat gameplay
Key Patterns Observed
Key Patterns Observed
Immediate Progress Feedback
Immediate Progress Feedback
High-performing games consistently show task or mission progress immediately after a gameplay session. This instant acknowledgment reassures users that their effort counted and reinforces the desire to continue.
High-performing games consistently show task or mission progress immediately after a gameplay session. This instant acknowledgment reassures users that their effort counted and reinforces the desire to continue.
Tiered Reward Structures
Tiered Reward Structures
Most systems provide small rewards for individual task completion and a larger milestone reward for completing the entire set. This balances short-term gratification with long-term goals, creating sustained motivation.
Most systems provide small rewards for individual task completion and a larger milestone reward for completing the entire set. This balances short-term gratification with long-term goals, creating sustained motivation.
Visible Milestones & Progress Bars
Visible Milestones & Progress Bars
Clear visual indicators such as progress bars, checklists, and percentage completion help users quickly understand where they stand and what remains.
Clear visual indicators such as progress bars, checklists, and percentage completion help users quickly understand where they stand and what remains.
Reduced Cognitive Load
Reduced Cognitive Load
Tasks are often broken into smaller, digestible units rather than presented as a large, intimidating list. This makes participation feel achievable rather than overwhelming.
Tasks are often broken into smaller, digestible units rather than presented as a large, intimidating list. This makes participation feel achievable rather than overwhelming.
Persistent Visibility
Persistent Visibility
Reward progress is not buried inside menus. Instead, it is surfaced in primary navigation areas such as dashboards or lobby screens, ensuring constant awareness without extra effort.
Reward progress is not buried inside menus. Instead, it is surfaced in primary navigation areas such as dashboards or lobby screens, ensuring constant awareness without extra effort.
Design Goals
Design Goals
Reinforce motivation with progressive incentives
Reinforce motivation with progressive incentives
Provide instant progress visibility
Provide instant progress visibility
Reduce task overwhelm and simplify the design
Reduce task overwhelm and simplify the design
Increase task completion & reward claims
Increase task completion & reward claims
Solutions - Reward Structure Design
Solutions - Reward Structure Design
Tiered incentive architecture
Tiered incentive architecture
Small rewards for each mission
Small rewards for each mission
Quick dopamine hits
Quick dopamine hits
Large milestone reward for completing all tasks
Large milestone reward for completing all tasks
Delayed gratification
Delayed gratification
TFR screen - OLD
TFR screen - OLD
TFR screen - New
TFR screen - New
We redesigned the interface with a stronger gamified aesthetic to enhance immersion and engagement. In the new design, rewards are structured at two levels. Completing each task grants a reward, while finishing the entire set unlocks a larger chest containing a bigger reward. This structure keeps players engaged through small milestones, while the final big reward serves as the ultimate goal.
We redesigned the interface with a stronger gamified aesthetic to enhance immersion and engagement. In the new design, rewards are structured at two levels. Completing each task grants a reward, while finishing the entire set unlocks a larger chest containing a bigger reward. This structure keeps players engaged through small milestones, while the final big reward serves as the ultimate goal.
This created;
This created;
Immediate gratification
Immediate gratification
Sustained motivation
Sustained motivation
Clear end goal
Clear end goal
Design Challenge — Balancing Visibility and Focus
Design Challenge — Balancing Visibility and Focus
How do you show progress without interrupting play?
How do you show progress without interrupting play?
We explored two directions:
We explored two directions:
Post-match popup on result screen
Post-match popup on result screen
We’re already running experiments like “cross-sell” on the results page. So there won’t be enough space for this and it’ll look cluttered if we add everything. So, this won’t work
We’re already running experiments like “cross-sell” on the results page. So there won’t be enough space for this and it’ll look cluttered if we add everything. So, this won’t work
Lobby-embedded progress tracker
Lobby-embedded progress tracker
This can work as the lobby is where users spent most of their time other than the gameplay itself
This can work as the lobby is where users spent most of their time other than the gameplay itself
Solutions - Progress Visibilty
Solutions - Progress Visibilty
Design Principles
Design Principles
Proximity
Proximity
Keep rewards in the player’s active zone (the lobby)
Keep rewards in the player’s active zone (the lobby)
Clarity
Clarity
Make task progress visible at a glance
Make task progress visible at a glance
Delight
Delight
Turn claiming into an emotional payoff
Turn claiming into an emotional payoff
How do we achieve these?
How do we achieve these?
We tried many designs like...
We tried many designs like...
There are a few other reward systems in the app as well, and they might go unnoticed by users in the same way TFR does. So we thought, why not create a dedicated space on the lobby page where all reward types can be shown, along with their progress for that game?
There are a few other reward systems in the app as well, and they might go unnoticed by users in the same way TFR does. So we thought, why not create a dedicated space on the lobby page where all reward types can be shown, along with their progress for that game?
We called the section - Reward surfacing in lobby.
We called the section - Reward surfacing in lobby.
New section
Game lobby - previous
Game lobby - new
How does this work for TFR?
How does this work for TFR?
Whenever there is a new task for a game, it appears in the reward surfacing section of that game. Users can click on it to expand the widget and see the details of tasks. If they click on it again, they will be redirected to the TFR page.
Whenever there is a new task for a game, it appears in the reward surfacing section of that game. Users can click on it to expand the widget and see the details of tasks. If they click on it again, they will be redirected to the TFR page.
The widget will always be showing the progress of the tasks so that users are aware of how close they are to their reward.
The widget will always be showing the progress of the tasks so that users are aware of how close they are to their reward.
Game lobby
lobby - TFR expanded
TFR screen
You can ask - why expand? Why not take them to TFR page directly?
You can ask - why expand? Why not take them to TFR page directly?
My logic is - I'm trying to make them stay at the lobby page itself. I don't want to break the experience here. Once they understands the widget, they'll be able to perceive information without even expanding the widget.
My logic is - I'm trying to make them stay at the lobby page itself. I don't want to break the experience here. Once they understands the widget, they'll be able to perceive information without even expanding the widget.
When a task is completed, the circle changes to show a Claim button. Once users tap it, the reward amount is credited directly to their wallet. They can also choose to claim the reward from the TFR page
When a task is completed, the circle changes to show a Claim button. Once users tap it, the reward amount is credited directly to their wallet. They can also choose to claim the reward from the TFR page
lobby - TFR claim
TFR screen - claim
TFR - after claim
TFR - after claim
Once all tasks are completed, the chest becomes ready to open. Users can unlock it either from the TFR page or directly from the lobby page
Once all tasks are completed, the chest becomes ready to open. Users can unlock it either from the TFR page or directly from the lobby page
home - chest claim
lobby - chest claim
TFR - chest claim
Chest Opening Experience
chest - yet to open
chest - opened
reward summary
After the chest is opened and the reward is claimed, a new set of tasks appears. Along with it, a chest of a higher value is unlocked for the user to work toward.
After the chest is opened and the reward is claimed, a new set of tasks appears. Along with it, a chest of a higher value is unlocked for the user to work toward.
Chest claimed
Chest claimed
New chest & tasks
New chest & tasks
prototype
prototype
I made a prototype of the reward claim experience in Figma
I made a prototype of the reward claim experience in Figma
Validation
Validation
Post-prototype testing showed:
Post-prototype testing showed:
Users found progress within seconds.
Users found progress within seconds.
Confusion about progress reduced significantly.
Confusion about progress reduced significantly.
Users described the system as motivating.
Users described the system as motivating.
Increased willingness to continue gameplay.
Increased willingness to continue gameplay.
Behavioral Principles Applied
Behavioral Principles Applied
Goal Gradient Effect - effort increases near reward
Goal Gradient Effect - effort increases near reward
Progress Principle - visible progress boosts motivation
Progress Principle - visible progress boosts motivation
Operant Conditioning - rewards reinforce behavior
Operant Conditioning - rewards reinforce behavior
Chunking Theory - smaller tasks reduce overwhelm
Chunking Theory - smaller tasks reduce overwhelm
Impact - What Changed
Impact - What Changed
The redesign transformed both behavior and sentiment.
The redesign transformed both behavior and sentiment.
5% boost in milestone reward claim rate
5% boost in milestone reward claim rate
4–9% increase across other reward types
4–9% increase across other reward types
Lower drop-off between task completion and reward claim
Lower drop-off between task completion and reward claim
Rewards stopped being a menu action — they became a moment of celebration.
Rewards stopped being a menu action — they became a moment of celebration.
What I Learned
What I Learned
Motivation isn’t about adding more coins, it’s about showing progress at the right time.
Motivation isn’t about adding more coins, it’s about showing progress at the right time.
I learned that small UX shifts like moving a widget into the right context can profoundly change player behavior.
I learned that small UX shifts like moving a widget into the right context can profoundly change player behavior.
Designing for games taught me to balance clarity with emotion, to make every tap feel meaningful.
Designing for games taught me to balance clarity with emotion, to make every tap feel meaningful.
Get in touch
Get in touch
Phone: +91 9645707012
Phone: +91 9645707012