πŸ¦Ήβ€β™‚οΈUser onboarding

🎁 Opening Chests & Claiming Rewards

Chests are at the heart of the BKINDNESS gamified experience. They encourage exploration, reward engagement, and strengthen partnerships with local businesses. This section explains how users interact with chests and redeem rewards, including how QR validation works.

πŸ“ Chest Types & Map Interaction

Users explore a GPS-based map with different chest types:

β€’ 🟑 Common Chests – Accessible to all, small daily rewards.

β€’ πŸ”΅ Business Chests – Located at partner business locations.

β€’ 🟣 Event Chests – Special limited-time or sponsored experiences.

β€’ 🟠 Secret Chests – Only visible after completing specific actions or challenges.

πŸ’‘ Each chest is geofenced and requires user proximity to interact.

πŸ”“ Opening a Chest

1. Approach the chest location

β€’ Map updates based on GPS data.

β€’ Once within interaction radius, chest becomes tappable.

2. Tap to Open

β€’ Engaging animation plays (custom to chest type).

β€’ A randomized reward system determines the outcome:

β€’ 🎫 Digital coupons

β€’ 🧩 Collectible badges

β€’ 🧠 XP / Progress boosts

β€’ 🎁 Instant prizes (sponsored items, NFTs in future)

3. View Reward

β€’ Results are shown in a dynamic pop-up card.

β€’ Users can tap Save or Use Now if it’s redeemable.

🧾 Claiming Business Rewards via QR

Many chests are sponsored by businesses and offer real-world perks like discounts, gifts, or experiences. These require in-store verification.

Flow:

1. User opens a Business Chest.

2. Reward card contains a QR code and instructions.

3. User visits the location and shows the QR to the merchant.

4. Merchant scans the QR using the BKINDNESS business app or scanner.

5. Once verified:

β€’ Reward status changes to β€œClaimed”.

β€’ User receives confirmation and XP.

β€’ Business sees analytics on their dashboard.

βœ… QRs are time-limited and single-use for security.

πŸŒ’ Light & Dark Variants

β€’ Every screen has full support for light and dark modes.

β€’ Claim UI elements are designed with accessibility contrast in mind.

β€’ Real-time theme toggle supported from system settings.

🧠 UX Highlights

Feature Description

πŸ“ Smart proximity check Prevents false openings or misuse

🧲 Reward stack system Unclaimed rewards go into β€œBackpack” for future use

πŸ“… Expiration reminder Push notifications and visual countdown for time-limited rewards

πŸ“Έ Visual scanning cues Helps merchant easily scan QR even in low light

πŸ”’ Reward Security

β€’ Rewards are tied to user ID & device.

β€’ QR codes expire after a set window (configurable per campaign).

β€’ Users cannot duplicate active QR codes.

πŸ“² Screens from Figma (suggested GitBook embeds)

Screen Title Suggested Placement

Chest Interaction (map view) Under Chest Types & Map

Chest Opening Animation Under Tap to Open

Reward Pop-Up Under View Reward

QR Code Interface Under Claiming Business Rewards

Backpack / Reward Inventory Under UX Highlights

Last updated