Home

Home

About

About

Resume

Resume

Get in Touch

Rocket to Rewards: Rewards Hub

Overview

A new feature that accompanied our latest campaign activity, allowed users to complete tasks and receive rewards all in one place. Our goal was to present the three completion options of tasks engagingly, ensuring clear understanding for users. We had designed this feature to offer a diverse range of opportunities for users to earn rewards and maintain their engagement with the app.

A new feature that accompanied our latest campaign activity, allowed users to complete tasks and receive rewards all in one place. Our goal was to present the three completion options of tasks engagingly, ensuring clear understanding for users. We had designed this feature to offer a diverse range of opportunities for users to earn rewards and maintain their engagement with the app.

My roles

Lead designer — partners with the marketing teams to drive the overall campaign.

Lead designer — partners with the marketing teams to drive the overall campaign.

Team

Me, UX/UI designer
Product owner
Marketing team

Me, UX/UI designer
Product owner
Marketing team

Timeline & Status

8 months
Q2/3 2024 launch

8 months
Q2/3 2024 launch

Opportunity

An incentivized campaign featuring welcome offers, trading rewards, and deposit rewards was designed to boost new sign-ups, deposit volume, and trading activity.

There were three main tasks in this campaign welcome offers, trading rewards, and deposit rewards:

There were three main tasks in this campaign welcome offers, trading rewards, and deposit rewards:

Welcome offer - Bundle task completion

Sign up for a live account, deposit $70, and trade to $100,000 notional value to get $70 trading token.

Trading rewards - Accumulated task completion

Open 10 live trades for $10 rewards
Trade notional value to $200,000 for $10 rewards
Trade notional value to $500,000 for $15 rewards
Trade notional value to $1,000,000 for $35 rewards
Trade notional value to $1,800,000 for $70 and $70 trading token
Trade notional value to $3,000,000 for $70 and unlock the deposit rewards

Deposit rewards - One-off task completion

A one-off deposit of $100- $299 for $5 rewards or
A one-off deposit of $300 - $599 for $10 rewards or
A one-off deposit of $600 - $999 for $20 rewards or
A one-off deposit amount ≥ $1,000 for $40 rewards

Difficulties to implement the above task requirements:

  1. How could we effectively convey the task requirements to users when some tasks are bundled and offer different progress and completion options?

  2. How could we represent clearly the information on the UI regarding rewards amount, trading and deposit amount, claim button, expired rewards date, etc?

  3. How could we minimize the necessity for users to repeatedly consult the activity page for rules, especially considering the complex completion conditions of the tasks?

Difficulties to implement the above task requirements:

  1. How could we effectively convey the task requirements to users when some tasks are bundled and offer different progress and completion options?

  2. How could we represent clearly the information on the UI regarding rewards amount, trading and deposit amount, claim button, expired rewards date, etc?

  3. How could we minimize the necessity for users to repeatedly consult the activity page for rules, especially considering the complex completion conditions of the tasks?

HMW grants users more control of the tasks and reward process so that users can be involved and interested in new campaign missions?

Directions

🧐 A one-stop reward hub that allows users to complete tasks and earn rewards

Eliminated the need for users to navigate through various sections or interfaces. It empowers users to know what exactly they’re participating in, what their rewards include, and how to claim their rewards so that they can make well-informed decisions.

Eliminated the need for users to navigate through various sections or interfaces. It empowers users to know what exactly they’re participating in, what their rewards include, and how to claim their rewards so that they can make well-informed decisions.

🧐 Progress tracking for monitoring

Provided visual representations of progress so users can easily monitor their advancement in the campaign. This helps users commit to achieving their objectives.

Provided visual representations of progress so users can easily monitor their advancement in the campaign. This helps users commit to achieving their objectives.

🧐 Visually appealing design elements and rules to help users to effectively convey the task requirements

Cleared any confusion caused by the various completion options available for tasks in a section while creating a clear and organized interface.

Cleared any confusion caused by the various completion options available for tasks in a section while creating a clear and organized interface.

Userflow

I created user flows for different reward categories (new users, non-KYC users, and active users), which helped facilitate discussions with stakeholders and guide the screen design process—details in the Miro workboard.

I created user flows for different reward categories (new users, non-KYC users, and active users), which helped facilitate discussions with stakeholders and guide the screen design process—details in the Miro workboard.

🔍 Userflow - Welcome offer

🔍 Userflow - Trading rewards

🔍 Userflow - Deposit rewards

Design and refine

I took the initiative to explore wireframes for various reward categories by visualizing three different completion options. Then, I conducted internal user testing to evaluate the effectiveness of the wireframes and their impact on user experience.

I took the initiative to explore wireframes for various reward categories by visualizing three different completion options. Then, I conducted internal user testing to evaluate the effectiveness of the wireframes and their impact on user experience.

🔍 Concept 1 - Card design present three completion options alongside two progress bar forms

I focused on various ways to present the card design of various tasks. The following factors were taken into account:

1. Completion options e.g. bundled task or accumulated task

2. Task name/requirement

3. Rewards amount

4. Different forms of progress bar, including showing the percentage completed or highlighting specific milestones.

5. Claim button

I focused on various ways to present the card design of various tasks. The following factors were taken into account:

1. Completion options e.g. bundled task or accumulated task

2. Task name/requirement

3. Rewards amount

4. Different forms of progress bar, including showing the percentage completed or highlighting specific milestones.

5. Claim button

Expected 1

In the trading rewards with a milestone progress bar design, users had the option to claim rewards individually as they reached specific targets or claimed all rewards at once when they met the highest required trading amount.

In the trading rewards with a milestone progress bar design, users had the option to claim rewards individually as they reached specific targets or claimed all rewards at once when they met the highest required trading amount.

Actual 1

Due to the design of the milestone system with the claim button, they mistakenly believed that they could only claim rewards once and were unsure about how to claim the remaining rewards for the same task.

Due to the design of the milestone system with the claim button, they mistakenly believed that they could only claim rewards once and were unsure about how to claim the remaining rewards for the same task.

Expected 2

In the deposit rewards, users can one-off deposits to specific targets of amount.

In the deposit rewards, users can one-off deposits to specific targets of amount.

Actual 2

They mistakenly believed that they could accumulate the deposit amount (deposit times >1) by the display of the milestones design.

They mistakenly believed that they could accumulate the deposit amount (deposit times >1) by the display of the milestones design.

🔍 Concept 2 - card design presents three completion options alongside one progress bar form

After the first few attempts, I went back to a conservative design with one form of progress bar only. With several grooming and testing, I found the following for improvement:

  1. The display of reward amount was not dominant enough.

  2. The checkmark could be replaced by the progress bar.

  3. Gamify factors could be added to the progress bar design to attract users for task completion.

  4. The one-off factor was still not adequately represented in the UI for the deposit rewards card.

After the first few attempts, I went back to a conservative design with one form of progress bar only. With several grooming and testing, I found the following for improvement:

  1. The display of reward amount was not dominant enough.

  2. The checkmark could be replaced by the progress bar.

  3. Gamify factors could be added to the progress bar design to attract users for task completion.

  4. The one-off factor was still not adequately represented in the UI for the deposit rewards card.

🔍 Concept 3 trading rewards - card design focused on three variations of the progress bar

To differentiate the reward amount from the task requirement, I have removed the checkmark and relocated the reward amount to the left.

The designs transition from a horizontal progress bar to a ring-like progress bar, to present the progress clearly without interfering with the display of rewards amount and trading amount.

To differentiate the reward amount from the task requirement, I have removed the checkmark and relocated the reward amount to the left.

The designs transition from a horizontal progress bar to a ring-like progress bar, to present the progress clearly without interfering with the display of rewards amount and trading amount.

🔍 Concept 3 deposit rewards - card design focused on the one-off factor

To display the one-time factor, I initially added an "or" in the UI. However, I later discovered that incorporating only one claim button in a card and a checkmark on each item could enhance the feeling of “or” condition.

To display the one-time factor, I initially added an "or" in the UI. However, I later discovered that incorporating only one claim button in a card and a checkmark on each item could enhance the feeling of “or” condition.

User testing methodology

To create an optimal testing environment, I developed testing cards that present users with specific situations and tasks, enabling them to take precise actions. This approach aims to stimulate realistic scenarios and gather valuable feedback.

To create an optimal testing environment, I developed testing cards that present users with specific situations and tasks, enabling them to take precise actions. This approach aims to stimulate realistic scenarios and gather valuable feedback.

Solution

🤩 Manage your tasks and rewards in one place

Users can now conveniently gather all their tasks and manage rewards in a single location without the need to navigate through multiple pages.

Each task now includes a detailed set of rules so that users know what they’re participating in and how to claim their rewards.

Users can now conveniently gather all their tasks and manage rewards in a single location without the need to navigate through multiple pages.

Each task now includes a detailed set of rules so that users know what they’re participating in and how to claim their rewards.

🤩 Make tracking of tasks and rewards effortless

Welcome offer - Bundle task completion:

A single CTA button present on a reward card implies that all three tasks must be fulfilled to unlock the reward.

Welcome offer - Bundle task completion:

A single CTA button present on a reward card implies that all three tasks must be fulfilled to unlock the reward.

Trading rewards - Accumulated task completion

Break down the large amount of accumulated trading value into five smaller sub-tasks.
-> Enhance accessibility to individual trading values with dedicated reward amounts and CTA buttons for each sub-task.
-> Keep track of the remaining value for each target.

Trading rewards - Accumulated task completion

Break down the large amount of accumulated trading value into five smaller sub-tasks.
-> Enhance accessibility to individual trading values with dedicated reward amounts and CTA buttons for each sub-task.
-> Keep track of the remaining value for each target.

With a clearly defined one-time condition, users were able to exercise greater control over the amount they deposited, minimizing the risk of any further misunderstandings.

With a clearly defined one-time condition, users were able to exercise greater control over the amount they deposited, minimizing the risk of any further misunderstandings.

Other Projects

UX Design, Motion @Pocket Trader

Campaign: Lottery Event

UX Deisgn, Trading Logic @Pocket Trader

CFDs Trading

@2025 Leo Lau

Let's Chat

@2025 Leo Lau

Let's Chat

@2025 Leo Lau

Let's Chat