Skip to content
All work
Case 01

eGift & Payment Experience System

Designed complex eGift experiences across online redeem, PDF download, eCard transfer, Apple/Google Wallet support, different-currency transfer, partial redeem/payment, physical redemption, voucher payment, and delivery flows.

eGiftB2CB2B2CTransferRedemptionVoucherPayment UXWalletAnimation
Outcome highlights
  • Structured eGift product behavior into clearer, more scalable flows
  • Improved consistency across purchase, delivery, transfer, and redemption
Product type
eGift / Payment / Redemption Experience
Platform
Web, Webview, Mobile
Timeline
2019–2026 · multi-phase product stream
Role
Product UX, UI design, flow design
Team
Designer, PM, payment + frontend engineers
Tools
Figma, FigJam, React prototype
Context

Why this project existed

Multiple eGift-related experiences across B2C and B2B2C scenarios. The product needed to support different user behaviors, payment conditions, redemption methods, transfer options, and delivery formats.
My role

What I owned

  • Product UX
  • UI Design
  • Flow Design
  • Payment Logic Mapping
  • Edge Case Mapping
  • Animation Direction
  • Frontend Collaboration
  • UI Testing
Challenge

What made it hard

  • Multiple redemption methods (online, physical, PDF, wallet, eCard)
  • Different payment and redeem logic, including voucher and partial payment
  • Transfer across different currencies
  • Delivery via email, SMS, or forwarding
  • Edge cases around balance, checkout interruption, and recipient data
  • Balancing consumer clarity with business rules and implementation constraints
Process

How it came together

  1. 1Clarified business rules and scenarios
  2. 2Mapped purchase, transfer, payment, and redemption flows
  3. 3Identified edge cases and missing logic
  4. 4Designed wireframes, UI flows, and states
  5. 5Collaborated on frontend implementation
  6. 6Reviewed, tested, and reported issues
  7. 7Refined visual design and animation
Design decisions

The thinking behind it

Made complex payment and redemption logic feel simple — clear step-by-step behavior, visible status changes, practical error states, and predictable checkout.
Final design

Selected views

Abstract representations — original mockups, not client screenshots.

Outcome / impact

What changed

  • Structured eGift product behavior into clearer, more scalable flows
  • Improved consistency across purchase, delivery, transfer, and redemption
Reflection

What I took away

Strengthened my ability to design around business logic, payment constraints, user clarity, and implementation reality at the same time.
Back to all work