END-TO-END UX — DISCOVERY → FLOWS → HI-FI → PROTOTYPES → HANDOFF
A trust-first system that prevents UPI fraud without slowing payments
Research-led UX for high-stakes flows—risk signals, edge states, and fast handoff.
Metrics: 8 screens • 10 components • iterations • usability checks
ROLE
UX Designer
EXPERTISE
Customer-facing UX • Prototyping • Interaction Design • Design Systems
YEAR
2024
UPI Shield is a lightweight security layer for UPI payments that helps users verify intent, detect risk, and recover safely—without adding friction to everyday transactions. Instead of relying on fear-based warnings, UPI Shield guides users with clear risk cues, safer defaults, and one-tap recovery flows (cancel/hold/report), so payments feel fast and trustworthy.
Timeline
3–5 weeks (discovery → flows → hi-fi → prototype → validation → handoff)
Why this matters
UPI fraud often happens in seconds—users act under pressure (calls, urgency, fake “refunds”). A good solution must reduce cognitive load, explain risk in plain language, and support recovery when mistakes happen.
Partnered with stakeholders to align on problem framing, mapped flows and edge states, and delivered polished UI + specs that engineering could ship confidently.
1) Cross-functional + constraints
Partnered with PM + Engineering to translate [fraud risk + trust constraints] into user flows, edge states, and handoff-ready specs—shipping under real technical constraints.
2) Templates/flows/diagrams
Used templates to rapidly produce process flows, conceptual diagrams, and IA—aligning stakeholders early and reducing rework downstream.
3) Fast iteration
Iterated quickly on flows → wireframes → hi-fi mocks → prototypes, incorporating feedback, usability signals, and feasibility constraints to refine the payments.
Research & Insights
Identified high-risk moments: “Request money” traps, fake support calls, urgency scripts, screen-share manipulation, and misleading merchant names.
Mapped jobs-to-be-done:
“Pay quickly with confidence.”
“Know if this payment is risky before I confirm.”
“Recover fast if I made a mistake.”
UX flows & information architecture
Designed flows around decision moments (not screens):
Intent check (pay vs request vs collect)
Risk check (context + patterns + merchant signals)
Confirm (clear amount/receiver + safer defaults)
Recovery (hold/cancel/report + next steps)
Prototyping & iteration
Rapid iterations on: microcopy, warning hierarchy, confirm screen clarity, and edge states.
Validated with quick usability loops focused on:
Time to detect risk
Error rate on “request vs pay”
Confidence before confirm
Handoff-ready specs
Component + state system: empty/loading/error/recovery, variants for risk levels, and dev-ready interaction notes.
UPI Shield delivers calm, fast payments by making risk understandable and recovery effortless.
1) Design system contribution
Built reusable components + variants (tokens, layout rules, states) and contributed patterns to a scalable design system for consistent UI across features.
5) Prototyping + spec handoff
Delivered clickable hi-fi prototypes + clean specs (redlines, variants, empty/loading/error/recovery) and supported implementation with dev collaboration + QA.
Clarity-first confirmation
A redesigned confirm screen that surfaces who, what, and why—with clear receiver identity cues and readable hierarchy.
Impact → Fewer “I paid the wrong person” mistakes, faster confident confirms.
Safer defaults in high-risk moments
When risk is high, defaults shift to safer actions (review details, verify via alternate method, delay payment).
Impact → Reduced impulsive confirmation under pressure.
Risk cues that don’t panic users
Risk badges (Low/Medium/High) supported by plain-language reasons: unusual amount, new receiver, mismatched name, suspicious request patterns.
Impact → Better decision-making without fear-based UX.
One-tap recovery & reporting
If something feels wrong: Hold / Cancel / Report with next-step guidance (bank support, timeline, what to do now).
Impact → Faster recovery + reduced helplessness after a mistake.
Outcomes from UPI Shield’s end-to-end UX work—focused on reducing payment anxiety, preventing high-cost errors, and enabling fast recovery.
Reduced fraud-prone mistakes
Clear intent cues + confirmation hierarchy prevented “request vs pay” confusion and wrong-recipient sends.
Impact → Fewer wrong actions, higher perceived control.
Faster, more confident confirmations
Risk cues + plain-language reasons helped users decide quickly without overthinking.
Impact → Less hesitation, fewer “what now?” moments.
Stronger recovery when users slip up
Hold/cancel/report flows reduced panic and gave actionable steps immediately.
Impact → Better recovery confidence and fewer dead-ends.
Scalable foundation for shipping
Reusable components + state-driven patterns kept behavior consistent across scenarios and simplified handoff.
Impact → Cleaner specs, faster iteration, easier expansion (new risk rules, new banking flows).
Learning
In high-stakes finance UX, trust isn’t “more warnings”—it’s clear intent, explainable risk, and graceful recovery.