Product Overview
Claimit is a hyper-local rewards platform where customers discover nearby businesses, scan bills, earn reward points, receive cashback, and use points as discounts on future purchases.
Project Goals
The design goal was to make Claimit’s reward journey feel clear, trustworthy, and repeatable for customers while supporting local business discovery.
Communicate rewards, discounts, and 1% cashback without confusion.
Help users shop normally, scan bills, earn points, and redeem later.
Surface nearby deals, brand deals, promo content, and local services.
Make Reward Zone earning and Redeem Zone discounts easy to compare.
User Pain Points & Solutions
Useful nearby offers are difficult to discover.
Offers reflect location, interests, and preferences.
Unclear steps make rewards difficult to use.
Simple steps create a hassle-free experience.
Users wait too long for points or cashback.
Approved value appears clearly in the wallet.
Too many alerts reduce attention and trust.
Users see timely updates for offers they value.
User Groups
Students and young adults looking for deals, cashback, and smarter daily spending.
People who spend regularly on groceries, dining, and essentials and expect value every time.
Users who enjoy discovering nearby cafés, stores, and hidden local deals.
Local shop owners who want repeat customers, simple campaigns, and better visibility.
User Personas
I love finding good deals and getting cashback on everyday spending.
Student shopper looking for clear, useful savings on daily spending.
I want to support local businesses and get rewarded for everyday purchases.
Regular shopper who wants simple local rewards and quick redemption.
User Personas
I want an easy way to attract more customers and reward them without raising my costs.
Local merchant who needs simple promotions without extra complexity.
I want to grow my business locally and build strong customer relationships.
Café owner who wants simple campaigns and stronger local loyalty.
Paper Sketches
Before moving to digital wireframes, we explored the core ClaimIt screens on paper to validate structure, navigation, and reward actions quickly.
Paper sketches helped us focus on layout, hierarchy, and user decisions before spending time on visual styling. This made it easier to compare ideas, remove weak flows, and align the team around the simplest experience.
We mapped the main actions users need: discover nearby deals, scan bills, redeem offers, and track cashback.
Each sketch tested where search, categories, offer cards, wallet balance, and redemption details should appear.
The strongest layouts were selected and refined into digital wireframes with clearer spacing, states, and navigation.
Digital Wireframes
The selected paper sketches were converted into digital wireframes to refine hierarchy, spacing, navigation, and key reward states before visual design.
Digital wireframes helped us turn rough ideas into a clearer product blueprint. We used them to test layout consistency, check screen transitions, and make sure the core reward journey was simple before adding color and branding.
Home, deals, offer detail, redemption success, and wallet were structured as the core user journey.
Search, categories, offer cards, CTA placement, and bottom navigation were adjusted for better scanning.
The wireframes became the foundation for UI styling, design system components, and prototype screens.
Visual Design
Strong hierarchy, rounded surfaces, clear actions, and consistent reward states support discovery, earning, and redemption.
Interactive Prototype
We used the prototype to validate the experience before development and align stakeholders around real user flows.
Design System Components
The ClaimIt component library defined repeatable UI patterns for buttons, chips, headers, cards, navigation, filters, icons, and featured zones.
Components turn repeated interface patterns into reusable building blocks. They keep screens visually consistent, reduce redesign work, and make every new feature easier to assemble.
Buttons, cards, tabs, headers, and filters behave the same across discovery, redemption, wallet, and profile flows.
We created master components with variants for active, inactive, primary, secondary, selected, and default states.
Reusable components helped developers inspect spacing, states, colors, and usage rules from one organized source.
Color & Typography
Color, typography, spacing, and mobile grid rules were documented so every screen could feel aligned, readable, and easy to scale.
Foundations define the visual rules behind every interface decision. They make the product feel intentional instead of screen-by-screen, and they give the team a shared reference for future updates.
Blue builds trust and anchors actions, yellow highlights rewards, and neutral colors keep content readable.
Poppins was used with clear heading and body sizes so titles, labels, and descriptions stay easy to scan.
A consistent mobile spacing system helped align cards, buttons, lists, and screen layouts across the app.
Building Landing Pages
Landing pages explain the reward model to shoppers and merchants while maintaining the same visual language.
After Launch Support
After the app experience was designed, the same visual system was used to support acquisition, merchant adoption, and long-term brand consistency.
Social Media Creatives Support
Social creatives helped explain the app value quickly across customer and merchant channels while keeping the message recognizable.
Brand Identity Support
The brand identity document gave the team rules for logo usage, colors, typography, layouts, and promotional assets after launch.