Optum Bank: HSA Reimbursement Redesign
Transformed a 98.9% abandonment rate into a streamlined experience for 450,000 users.
Project Overview
Before the redesign, users struggled with a complex reimbursement process that was manual, error-prone, and inflexible. As Lead UX Designer, I worked with cross-functional teams to design an automated, intelligent system that reduced abandonment by 75% and support calls by 52%.
The Challenge
The HSA platform processes $450M annually, but the reimbursement feature was failing with a 98.9% abandonment rate—only 1 in 90 users completed submissions.
Key Problems:
- • Scattered forms across multiple screens
- • Generic error messages with no guidance
- • Inconsistent mobile/desktop experiences
User Impact:
- • 18-minute average completion time
- • 22% of support calls were reimbursement-related
- • "I gave up after it lost my receipt again"
Complexity & Constraints
Multi-User Challenge
Four distinct user types with conflicting needs—from digital natives to assisted users
Technical Constraints
Legacy systems, OCR processing, and mobile network reliability issues
Regulatory Requirements
IRS compliance, HIPAA restrictions, and mandatory audit trails
Cross-device reality: 67% started on mobile, 38% switched to desktop after failures—revealing device choice was context-dependent.
Research Strategy
I needed to understand both user behavior and system constraints without being able to conduct traditional usability testing due to healthcare privacy restrictions. This required creative research approaches and multiple data triangulation methods.
Research Methods
7-week research phase combining data analysis and user research
Data Analysis
- • 6 months of analytics data identifying 12 drop-off points
- • 800+ customer service transcripts categorized by issue type
- • Technical system mapping across 3 backend systems
- • Heuristic evaluation using healthcare UX principles
User Research
- • 12 internal stakeholder interviews to understand user workflows and pain points
- • Process mapping sessions with customer service representatives
- • Analysis of recorded support call patterns and common issues
- • Cross-functional workshops with product, engineering, and compliance teams
Key Research Insights
User Mental Models vs. System Logic
Users thought of expenses by event ("my dentist visit") while system organized by tax category ("preventive care")
System Logic
Organized by:
Tax categories (e.g., "preventive care")
Processing:
24-48 hour validation required
Documentation:
Detailed regulatory requirements
👤 User Mental Model
Thinks by:
Events (e.g., "my dentist visit")
Expects:
Immediate feedback and approval
Wants:
Simple yes/no answers
Four Primary User Types Emerged
Digital Natives
Expected instant mobile experience
BEHAVIOR
Abandoned after first failure, expected app-like experience
Traditional Planners
Preferred desktop with detailed forms
BEHAVIOR
Wanted documentation and thorough review process
Assisted Users
Required customer service help
BEHAVIOR
Needed simplified workflows and guided assistance
Bulk Processors
Business owners with multiple claims
BEHAVIOR
Needed batch processing and CSV upload capabilities
Cross-Device Behavior Pattern
Started on Mobile
Switched After Failure
Completed on Desktop
Typical User Journey
Mobile Start
Upload Fails
Desktop Switch
Mobile Context
- • Quick receipt capture on-the-go
- • Expected instant processing
- • Limited time for complex forms
- • Camera quality and lighting issues
💻 Desktop Switch Reasons
- • Better file management capabilities
- • Easier form completion
- • More reliable upload experience
- • Ability to scan documents properly
Key Insight: Device choice was context-dependent—users needed connected experiences across platforms, not identical interfaces. The system needed to maintain state and progress across devices.
Technical Failure Analysis
Upload Failures
File size limit (40%)
Files over 10MB rejected
Network timeout (35%)
Mobile network interruptions
Format issues (25%)
HEIC photos not supported
Validation Errors
Missing receipt date (45%)
OCR couldn't detect date
Amount mismatch (30%)
Manual entry vs. receipt
Invalid category (25%)
Non-HSA eligible expense
User Confusion
Form complexity (50%)
Too many required fields
Process unclear (30%)
No progress indicators
Help unavailable (20%)
No contextual guidance
Common Error Messages (Before Redesign)
"Upload failed. Error code: 413"
❌ User has no idea what this means
✅ Should say: "File too large (max 10MB)"
"Invalid file format"
❌ No guidance on accepted formats
✅ Should say: "Use JPG, PNG, or PDF files"
"Validation failed"
❌ Doesn't specify which field
✅ Should highlight specific errors
"Request timeout"
❌ No recovery suggestion
✅ Should offer retry option
Avg. time lost per failure
Retry attempts before giving up
Called support after failure
Annual cost of failures
Design Process: From Research to Solution
Design Methodology
Research → Ideation → Prototyping → Testing → Iteration
Three Design Approaches Evaluated
| Approach | Decision | Timeline | Rationale |
|---|---|---|---|
| Complete Rebuild | ❌ Rejected | 18 months | Too risky for critical healthcare system |
| Progressive Enhancement | ✅ Selected | 6 months | Balanced risk with faster delivery |
| Parallel Systems | 🔄 Pilot only | 12 months | Good for A/B testing, high maintenance |
Interactive Design Evolution
Progression from existing design to V3 through interactive prototypes.
Mobile Design Evolution
98.9% abandonment to 76% completion rate progression
Desktop Design Evolution
Traditional multi-column forms to intelligent progressive disclosure
Key Evolution Insights
- • 8+ overwhelming fields
- • Confusing medical codes
- • Generic errors
- • No upload guidance
- • No cross-device sync
- • 3-step guided process
- • Smart auto-detection
- • Real-time eligibility
- • Progressive disclosure
- • Cross-device sync
Key Design Decisions
Prototyping Timeline
Design Principles
Four core principles guiding all design decisions:
Progressive Confidence
Build trust through transparent feedback, time estimates, and recovery paths.
Context-Aware Guidance
Intelligent help based on receipt type, user history, and experience level.
Graceful Degradation
Functionality across varying network speeds, devices, and scenarios.
Regulatory Transparency
Make compliance requirements helpful by explaining why information is needed.
Smart Receipt Capture Solution
Interactive Mobile Prototype
Redesigned Smart Receipt Capture solution demonstrating the transformation from98.9% abandonment rate to streamlined, user-friendly experience.
Interactive Prototype Features:
- •Guided Receipt Capture: Real-time camera interface with visual frame overlay
- •Smart Form Assistance: Intelligent categorization and pre-populated fields
- •Transparent Status Tracking: Live timeline showing each approval step
- •Optum Bank Design System: Authentic branding and mobile-first interface
User Journey:
- 1Start at the HSA Dashboard ($1,671.65 available balance)
- 2Tap "Reimburse yourself" to begin
- 3Capture receipt with guided camera interface
- 4Review with automatic quality validation
- 5Complete smart form with detected information
- 6Submit and track real-time approval status
*Interactive prototype - Click and interact with the interface above*
Challenge: Photo quality, file formats, upload failures.
Solution: Multi-path capture: mobile camera guidance, document scanner, desktop drag-and-drop, email forwarding.
Technical Implementation Strategy
Mobile Optimization
- • Progressive image compression pipeline
- • Client-side validation with immediate feedback
- • Automatic retry logic for failed uploads
- • Fallback to smaller image sizes when original fails
Desktop Enhancement
- • Drag-and-drop upload zone with clear file requirements
- • Side-by-side layout showing receipt preview and form completion
- • Detailed help content accessible without leaving the main flow
- • Batch processing support for bulk users
Receipt Quality Guidance System
Real-time camera overlay with receipt boundaries, progressive upload with visual feedback, thumb-friendly targets for one-handed use.
Intelligent Form Assistance
Previous issues: Long intimidating forms, confusing terminology, poor error handling
New approach: OCR pre-population, smart suggestions, plain-language explanations, progressive disclosure
Example: Smart Recognition in Action
When user uploads receipt from "Dr. Smith Family Practice":
Try the Interactive Form Intelligence
Intelligent form assistance transforms complex medical forms into guided experience withsmart categorization, OCR pre-population, and plain language explanations.
Prototype Features:
- •OCR Detection: Extracts text from receipt images
- •Smart Categories: Rule-based expense classification
- •Plain Language Help: Medical terms explained simply
- •Smart Validation: Real-time field validation
Flow:
- 1Start with a receipt from "Dr. Smith Family Practice"
- 2OCR extracts provider name, date, and amount
- 3System suggests category based on provider type
- 4Get plain language eligibility confirmation
- 5Review pre-filled form with validation
*Interactive prototype - Click to experience intelligent form assistance*
Status Communication System
Previous issues: Generic "under review" messages buried in dashboard
New system: Multi-channel updates with progress tracking, time estimates, clear explanations
Specific Status Messaging
Instead of: "Under review" → Now: "Verifying receipt details (typically 24 hours)"
Instead of: "Processing" → Now: "Checking HSA eligibility rules (may take 2-3 days for complex cases)"
Instead of: "Complete" → Now: "Processing reimbursement to your account (1-2 business days)"
Cross-Device Design Strategy
Research Finding
78% of users started on mobile but 45% switched to desktop after failures.Device choice was context-dependent, not preference-based.
Platform-Specific Design Adaptations
Each platform leverages its unique strengths while maintaining seamless continuity for device switching.
Mobile-First Approach
Camera-Native Receipt Capture
Real-time receipt boundary detection with guided photo assistance
Touch-Optimized Interactions
Large touch targets, swipe gestures, and thumb-friendly navigation
Offline-First Design
Works without connectivity, syncs when reconnected
Optimized For:
Desktop Enhancement
Bulk Upload & Processing
Drag-and-drop multiple receipts with batch validation
Side-by-Side Layout
Receipt preview alongside form completion for efficiency
Advanced History & Search
Detailed filtering, sorting, and transaction management
Optimized For:
Desktop Cross-Device Experience
Desktop interface supports cross-device workflows with draft detection, mobile upload integration, state restoration.
Before vs After: Desktop Cross-Device Transformation
Compare original desktop experience with V3 cross-device solution. Prototype shows existing fragmented interface vs new integrated design.
Cross-Device Features:
- •Mobile Receipt Integration: Photos taken on mobile appear automatically
- •Draft Restoration: Incomplete mobile submissions resume seamlessly
- •Desktop Enhancements: Drag-and-drop, side-by-side preview
- •Smart Form Fields: OCR data from mobile auto-populates desktop form
Comparison Guide:
- 1Toggle between "Existing" and "V3" to see the transformation
- 2Notice how V3 shows mobile drafts and cross-device continuity
- 3Compare the cluttered existing form vs streamlined V3 layout
- 4Test the V3 drag-and-drop and smart form pre-population
Impact: V3 cross-device desktop increased completion rates from 12% to 78%, demonstrating how seamless handoffs improve user success.
Cross-Device User Scenarios
Real User Journey: Sarah's Prescription Reimbursement
1. Mobile Capture
At pharmacy: Quick photo of $127 prescription receipt
2. Auto-Sync
Receipt and OCR data automatically saved to cloud
3. Desktop Completion
Opens laptop, finds draft, completes medical details
4. Submission
Form auto-populated, validated, and submitted successfully
Result: 4-minute total time (vs. 18 minutes), no errors, $127 reimbursement in 2 days.
Technical Cross-Device Architecture
State Management & Sync
- •Real-time synchronization: Redux-persist with WebSocket updates
- •Conflict resolution: Last-write-wins with user confirmation
- •Offline support: Local storage with queue-based sync
- •Session management: JWT tokens with device fingerprinting
Responsive Design Strategy
- •Adaptive breakpoints: 320px, 768px, 1024px, 1440px
- •Progressive enhancement: Core functionality first, enhanced features layer up
- •Touch detection: Automatically adjusts UI density and interactions
- •Network awareness: Reduces image quality on slow connections
Shared Progress
Mobile submissions completed on desktop
Context Preservation
Form data, receipts, status auto-synced
Platform Optimization
Each platform leverages unique strengths vs identical experiences
Cross-Device Impact Metrics
Device-Specific Completion Rates
User Satisfaction by Platform
Working with Engineering Constraints
Collaborated with engineering to redesign system architecture supporting UX goals while maintaining regulatory compliance and reliability.
File Upload Architecture Challenges
❌Previous Monolithic Approach
- • Single API handled processing, validation, approval routing
- • Multiple failures, no granular feedback
- • Large file uploads caused timeouts
- • No recovery options for failures
✅New Collaborative Solution
- • Chunked upload system for large files
- • Async processing with transparent feedback
- • Compression maintaining OCR readability
- • Offline receipt capture
- • Transparent retry logic
Technical Implementation Details
Upload Process Improvements
- • Progressive image compression
- • Client-side validation with feedback
- • Background retry with backoff
- • Size fallback on failure
Performance Optimizations
- • Lazy loading by receipt type
- • CDN implementation for static resources
- • Database optimization (60% improvement)
- • Client-side preference caching
API Design Collaboration
🤝 Collaborative Design Philosophy
Worked with backend team to create endpoints enabling better UX while maintaining system integrity. Weekly technical sessions balanced UX goals with system constraints.
Key insight: Best UX emerges when design and engineering collaborate early in architecture phase.
API Architecture Evolution
❌Legacy Monolithic API
✅New Microservices API
Cross-Device API Strategy
🔄Device State Synchronization
Technical Implementation Details:
- • Session Management: JWT tokens with device fingerprinting
- • Conflict Resolution: Last-write-wins with user confirmation
- • Offline Support: Local storage with queue-based sync
- • Real-time Updates: WebSocket for instant synchronization
Human-Centered API Response Design
📝Error Response Evolution
Legacy Response:
{
"error": "Upload failed",
"status": 500
}❌ No actionable information for users
New UX-Informed Response:
{
"error": "file_too_large",
"user_message": "Photo is too large for upload",
"action_suggestion": "Try taking a closer photo of just the receipt",
"technical_details": {
"max_size": "10MB",
"received_size": "15.2MB",
"alternative_formats": ["JPEG", "PNG"]
},
"retry_options": {
"auto_compress": true,
"manual_crop": "/help/crop-receipt"
}
}✅ Clear guidance and recovery options
📊Progress Tracking API
Real-time Status Updates:
{
"status": "processing",
"progress": 65,
"stage": "ocr_extraction",
"stage_description": "Reading receipt details...",
"estimated_completion": "15 seconds",
"extracted_data": {
"provider": "Dr. Smith Family Practice",
"amount": "$125.00",
"confidence": 0.94
}
}✅ Transparent progress with extracted data preview
Collaborative Design Process
👥Weekly Design-Engineering Sessions
Key Collaboration Outcomes:
- • Error Classification System: 23 specific error types with user-friendly messages
- • Progressive Enhancement: Core functionality works on slow connections
- • Intelligent Retry Logic: Automatic recovery for 80% of temporary failures
- • Performance Budgets: 2-second response time SLA for critical operations
Technical Trade-offs & Decisions
⚖️Performance vs. Security
🔄Real-time vs. Battery Life
📈API Performance Impact
Key Learning: Design and engineering collaboration on API architecture from start improves both UX and system performance. Collaborative sessions reduced development time and improved outcomes.
Security and Compliance Integration
Healthcare Financial Data Requirements
Healthcare financial data required special handling beyond typical web security. Design decisions balanced user convenience with regulatory compliance.
Security Measures
- • End-to-end encryption for uploads
- • User-visible security indicators
- • Session management balancing security/convenience
- • Privacy controls for user data agency
Compliance Features
- • Comprehensive audit trails
- • Transparent retention policies
- • Regulatory explanations
- • Understandable compliance processes
Cross-Functional Collaboration
Product Management
- • Prioritized mobile based on data
- • Defined metrics balancing satisfaction + efficiency
- • Created rollout minimizing disruption
Compliance Team
- • Designed audit trails
- • Created educational content for regulations
- • Implemented transparent retention policies
🎧Customer Service
- • Built tools showing user experience
- • Created escalation for complex cases
- • Designed self-service reducing requests
Performance Impact
Technical Innovation Through Constraints
Working within technical limitations—legacy systems, API constraints, processing delays—forced creative solutions providing better UX than unlimited resources might have enabled. Constraints, when properly understood, often lead to more robust and user-friendly solutions than greenfield development.
User Experience Improvements
Business Impact
🏢 Operational Efficiency
Automated workflows dramatically reduced manual processing and support burden, allowing teams to focus on higher-value activities.
😊 Customer Satisfaction
Improved self-service capabilities led to higher platform engagement and reduced customer frustration.
Scalability
The redesigned system now handles increased transaction volume without requiring additional support resources.
Compliance
Enhanced documentation and audit trails improved regulatory adherence and reduced compliance risks.
Key Learnings and Design Insights
Long-term Impact & Future Directions
"The redesign transformed our support model and became our blueprint for improving other complex workflows."
Looking for more?
Check out my other projects