Case study · Loyalty & rewards

TapTap

A loyalty app that makes earning and redeeming points feel like play.

Client

TAPTAP

Product

Mobile loyalty app

Focus

UX, UI, gamification

Engagement

Senior design contractor

TapTap home screen on a phone resting on an orange chair against a mint wall
Overview

TAPTAP lets people earn points with partner brands and redeem them for deals. The goal was to raise product quality, sharpen the core experience and add light gamification for engagement and retention.

Working as a senior contractor alongside the UX, product and engineering teams, we shaped the UX direction and delivered the UI.

Challenge

Make earn, track and redeem obvious at a glance, and make the app feel joyful without looking like another coupon store.

What we did
  • 01Refined user journeys with UX and product
  • 02Put key value and core actions above the fold
  • 03Designed progress, challenge and reward states
  • 04Used mascots and 3D in a controlled way
  • 05Built flexible UI patterns for campaigns
  • 06Kept the app in step with the brand system
Product designUXGamificationVisual design

Points that people actually spend.

Product scale
3.9M+Active users
8M+Transactions
4,500+Partner stores

TAPTAP product figures, as published in the case on phamhuyds.com.

First touchpoint

A welcome that ends with a gift.

Phone number, name, then a choice of four surprise gifts. New users earn their first points before they have read a single rule.

Three onboarding screens: OTP code, your name, and pick one of four surprise gifts
Gift reveal screen saying Wohoo, here's your gift, on a yellow 3D set

Onboarding in three steps, closing on the gift reveal.

Four home and deals screens on a yellow background

Home, nearby stores, offer packages and challenges.

Earn · Track · Redeem

The whole loop, one thumb away.

Deals sorted by what you can afford now. Every card shows the points needed, the deals left and the next step.

Grid of TapTap screens on black: challenges, deals, redemption and profile
Deal detail, store list and how-to-earn screens

From the deal list to the redeem screen.

Brand system

Loud colour, strict rules.

Bright Gold and Light Red Rose for action and reward. Platinum Steel and Casual Black keep the rest calm. Archivo carries every weight.

Hand holding the app next to the colour palette: Bright Gold, Light Red Rose, Platinum Steel, Casual Black
Archivo typeface specimen with weights from thin to black
Deal cards and the Super Food Star mascot badge

Deal cards: one layout for every partner and campaign.

Gamification

Motivation without the clutter.

Challenges, progress bars and reward states sit inside normal screens. They reward attention without adding steps.

Try the pattern
Super Food Star0 VUI
0 of 3 orders+100 VUI
Two more orders to unlock your reward

Browser rebuild of the challenge pattern.

Challenge screen on a phone with floating glass reward cards on a tan leather sofa

Impact

Clearer rewards, more reasons to come back.

What changed for users and for the team running campaigns.

Two phones showing the TapTap deals and home screens on a lavender background
01

More confidence in rewards

Clearer reward flows improved user confidence and engagement.

02

Motivation, not complexity

Gamification raised motivation without adding steps.

03

Faster campaign launches

Reusable UI patterns let the team launch campaigns quicker.

04

Room to grow

Patterns ready for new rewards and gamified features.

Credits

Designed by Huy Pham, founder of PHAXIS Lab, as a senior contractor for TAPTAP.

Product & UI design

Huy Pham

Gamification

Huy Pham

UX & product

TAPTAP team

Engineering

TAPTAP team

Platform

Mobile app

Typeface

Archivo

Running a consumer app?

Get a design team that ships the fun parts too.

Start a subscription Book a 20-min call