Overview

Shipped for 20M+ users · 5 user segments including low-vision and foreign residents · Taiwan Ministry of Digital Affairs certified

Scale
20,000,000+ users
Taiwan National Public Service
Mechanisms
24% → 18%
Reducing missed prize redemptions
Client-reported share of missed top-tier prize redemptions: about 24% before ship, 18% one month after launch—directional internal read, not a published MoF figure.
Testing scope
88%
Task success across ages
Moderated prototype usability testing sessions with users 18–70+, including visually impaired participants, on scan, donate, and redemption.
E-invoice app redesign mock — screen 1
E-invoice app redesign mock — screen 2
E-invoice app redesign mock — screen 3
E-invoice app redesign mock — screen 4
01 · The problem

Roughly 20 million people rely on this official app, yet only 2.8★ App Store ratings and broken flows were excluding elders, newcomers, and low-vision users.

Context and design goal

In Taiwan, retail purchases always come with a uniform invoice (統一發票), often paper with a lottery number and QR code. The Ministry of Finance cloud invoice / e-invoice ecosystem (電子發票) lets people store digital copies, bind a mobile carrier barcode (手機條碼) for automatic matching, scan paper receipts into the app, and claim or donate prizes.

Design goal: To redesign the information architecture, flow and UI to make those core jobs obvious and trustworthy for elders, newcomers, foreign residents, and low-vision users.

Paper receipts commonly collected for Taiwan's invoice lottery
Spending insights
Membership cards
Settings overview (1/2)
Settings overview (2/2)
Prize claim info
Donation
Carbon passbook share
Guided setup (biometrics, bank, notifications, cloud backup) (1/4)
Guided setup (biometrics, bank, notifications, cloud backup) (2/4)
Guided setup (biometrics, bank, notifications, cloud backup) (3/4)
Guided setup (biometrics, bank, notifications, cloud backup) (4/4)
Redeem security check
Invoice passbook
Receipt detail
Homepage
Face ID / quick verification
Last-three-digit match
Events & promos
Winning invoices
Paper receipt scan
Notifications
Solution 1

The Homepage

Problem

Users opened the app and couldn't find what they needed — five very different segments, all frustrated for different reasons.

Icon-only controls left foreign residents guessing, and many low-vision users couldn't use the app without a caregiver.
Key insight

Every group shared one first action: scan a paper invoice.

Seniors especially had stacks of paper invoices — cashiers assumed elderly users didn't use the app and handed them paper receipts instead.
Decision

Scan became the primary CTA on open: large tap target, readable text label, fixed placement.

Before: small QR icon, top-right. After: unmissable. One pattern served all groups — labels that don't assume Chinese literacy.
Outcome

Prototype testing with the same participants validated the scan-first direction — strong positive responses across ages, especially seniors.

BeforeAfterAfter redesign: app home with scan invoice as the primary action and barcode module; iOS home screen widget shows carrier barcode for quick access
Cloud Invoice app home — before redesign
Solution 2

Pushback with external stakeholders: promo-first vs. what users actually open the app for

Problem

External stakeholders wanted the sustainability outreach zone to dominate on open.

But interviews showed a consistent priority order: scan action first, then the carrier barcode, then prize/lottery info, then spending analysis. The outreach zone wasn't among the top reasons people launched the app.
Key insight

Same home layout, two incompatible defaults: older and low-vision users wanted fewer modules and strong color for quick recognition; younger users wanted a denser dashboard.

Conflict

I brought interview evidence into government stakeholder meetings — I understood their need to surface carbon-reduction messaging, but the data said job-first ordering had to win the first screen.

Resolution

A customizable home: section visibility toggles in Settings.

Users can hide sections they don't need, so the promo block keeps its space without forcing that default on everyone. Partners accepted the model.
Outcome

Usability sessions across scan, donate, and redemption reached 88% task success — including visually impaired participants.

Solution 3

Login & authentication

Problem

Authentication was secure, but middle-aged and senior users kept forgetting their verification passwords.

Login success hovered around ~68% — verification codes and recovery friction blocked them before any core task.
Decision

Shipped biometric login and in-app password recovery — no more memorizing credentials or hunting one-time codes.

BeforeAfterAfter: Face ID, Touch ID, and pattern unlock options for Cloud Invoice app login
Before: password-only verification modal in system settings
Solution 4

Guided Onboarding Setup

Problem

About 1 in 4 major lottery prizes go unclaimed — people forget to check, miss notifications, or never link a bank account for auto-transfer.

Seniors and foreign residents often didn't complete auto-transfer or biometric setup because they didn't know the features existed.
Decision

Guided onboarding: biometric setup → bank account for auto-transfer → notifications → cloud backup, each step explaining why it mattered.

Plus a full English-language experience for foreign residents.
Outcome

One month post-launch, missed top-tier prize redemptions dropped from ~24% to ~18% (client-reported).

Handoff & engineering alignment

Handoff included three layers:

  • API state matrix — Each flow mapped against account states and timing windows, so engineering knew which endpoint to hit per scenario.
  • Screen reader annotation — VoiceOver focus order marked directly on screens.
  • Component specs — States, empty copy, and error strings per component in the Figma library.
E-invoice design handoff: Figma flows, API state mapping, screen reader annotations, and component specs for engineering alignment

Figma files

Wireflows, page logic, and hi-fi mockups — hi-fi and page flow first, wireframes for IA and early logic.

← Back to home