PocketHealth.com
Project Overview
Table of Contents
Executive Summary
Key Metrics & Achievements
Impact Overview
As a Design Engineer on the Growth Team at PocketHealth (Series B), I led patient-centered UX optimization initiatives that transformed the platform's conversion funnel. Through mobile-first design, outcome-driven optimization, and systematic A/B testing, I delivered measurable growth that directly contributed to the company's expansion goals.
My work focused heavily on the patient persona, spanning mobile-first design optimization, UX heuristic evaluation, and outcome-driven testing. By leveraging tools like Hotjar, Google Optimize, and Amplitude, I created a scalable framework for continuous optimization that reduced iteration cycles from weeks to days while maintaining patient-centered user experiences.
Problem Statement
PocketHealth faced significant growth challenges with conversion optimization, technical performance, and data-driven decision making that were limiting their ability to scale user acquisition effectively.
Key Challenges
Conversion Bottlenecks
Sign-up conversion rates were plateauing at 650K with declining month-over-month growth
Technical Debt
Legacy landing pages with poor performance, slow load times, and SEO issues
Lack of Data-Driven Insights
Limited A/B testing infrastructure and analytics tracking across 300+ pages
User Personas & Pain Points
Patients (Primary Focus)
Individuals seeking easy access to their medical imaging and health records
Pain Points
- Complex mobile navigation
- Confusing sign-up process
- Poor mobile experience
- Lack of clear value proposition
Goals
- Simple mobile registration
- Easy record access
- Trust and security
- Mobile-friendly interface
Healthcare Providers
Medical practices and clinics wanting to onboard PocketHealth for their patients
Pain Points
- Complex onboarding process
- Integration challenges
- Staff training requirements
Goals
- Streamlined onboarding
- Easy patient enrollment
- Reliable platform integration
Technical Debt Impact
- • Slow page load times
- • Poor mobile experience
- • Unoptimized JavaScript
- • 500+ broken links
- • Poor metadata
- • 184 language issues
- • Limited tracking
- • No A/B testing
- • Poor data insights
Design Process
A systematic approach to design engineering combining patient-centered research, mobile-first optimization, and outcome-driven experimentation to improve healthcare accessibility and user experience.
Design Engineering Methodology
Research & Insights
User research, analytics analysis, and competitive benchmarking
Key Activities
- Hotjar heatmap analysis of 300+ pages
- User interview sessions with healthcare professionals
- Conversion funnel analysis using Google Analytics
- Competitive analysis of healthcare platforms
Outcomes
- Identified 3 key conversion bottlenecks
- Mapped user journey pain points
- Established baseline metrics
A/B Testing Strategy
Systematic experimentation framework using Google Optimize
Key Activities
- Multivariate test design for landing pages
- Redirect tests for user flow optimization
- Statistical significance planning
- Test prioritization matrix creation
Outcomes
- 17% monthly conversion rate improvement
- 6-14% increase across test variants
- Data-driven decision framework
Iterative Design
Rapid prototyping and testing cycles in Figma
Key Activities
- Wireframe to high-fidelity prototype pipeline
- Mobile-first responsive design system
- Cross-functional feedback integration
- Design handoff optimization
Outcomes
- Reduced design iterations from 4-5 to 1-2
- Timeline reduction from weeks to days
- 100+ reusable component library
Implementation
Performance optimization and analytics integration
Key Activities
- JavaScript deferring for performance
- Google Tag Manager implementation
- Amplitude analytics setup
- SEO optimization using Ahrefs
Outcomes
- 30% Google Lighthouse score improvement
- 55% page speed increase
- 92% SEO score achievement
A/B Testing Results
- • 14% conversion improvement
- • Mobile-first design wins
- • Simplified form fields
- • 6-12% uplift across variants
- • CTA button optimization
- • Value proposition clarity
- • User flow optimization
- • Reduced drop-off rates
- • Improved sign-up completion
Tools & Technologies
Research & Analytics
Testing & Optimization
Key Learnings & Insights
Data-Driven Decision Making:Implementing comprehensive analytics tracking across 300+ pages enabled evidence-based optimization decisions, resulting in consistent month-over-month improvements.
Mobile-First Approach:Healthcare professionals primarily accessed the platform on mobile devices, making responsive design and mobile optimization critical for conversion success.
Iterative Improvement:Reducing design iteration cycles from weeks to days through streamlined Figma-to-code workflows enabled rapid testing and optimization of user experiences.
User Flows & Optimization
Systematic optimization of user journeys through data-driven design decisions, A/B testing, and mobile-first approaches to maximize conversion rates.
Landing Page Optimization
Patient-focused conversion optimization with mobile-first approach
Value Proposition
Clear patient-centered messaging and benefits
Key Improvements
- Simplified healthcare language
- Trust indicators
- Patient testimonials
Mobile Layout
Optimized for 61% mobile user base
Key Improvements
- Touch-friendly CTAs
- Readable typography
- Fast loading
Social Proof
Healthcare provider endorsements and patient reviews
Key Improvements
- Provider logos
- Patient success stories
- Security badges
Call-to-Action
Clear next steps for patient registration
Key Improvements
- Prominent CTA buttons
- Progress indicators
- Benefit reinforcement
Landing Page Templates
100+ responsive templates for high-traffic campaigns
Template System
Modular component-based landing page architecture
Key Improvements
- Reusable components
- Dynamic content
- A/B test variants
Content Strategy
Data-driven content optimization for different audiences
Key Improvements
- Persona-specific messaging
- Dynamic CTAs
- Localized content
Performance
Optimized for speed and SEO across all templates
Key Improvements
- Lazy loading
- Critical CSS
- Image optimization
Analytics
Comprehensive tracking for all template variations
Key Improvements
- Event tracking
- Conversion funnels
- Heatmap integration
Mobile Experience Design
Mobile-first design optimization for 61% mobile user base
Bottom Navigation
Experimented with bottom navigation for better mobile UX
Key Improvements
- Thumb-zone optimization
- Quick access to key features
- Reduced cognitive load
Touch Optimization
Optimized for mobile touch interactions
Key Improvements
- 44px minimum touch targets
- Gesture-friendly design
- Haptic feedback
Performance
Fast loading for mobile networks and devices
Key Improvements
- Compressed assets
- Lazy loading
- Progressive enhancement
Mobile Testing
Comprehensive testing across mobile devices
Key Improvements
- Real device testing
- Network simulation
- Mobile accessibility
Before vs After Comparison
Sign-up Conversion
Before Optimization
- 7-field registration form
- No social proof elements
- Generic messaging
- Poor mobile experience
- No progress indicators
After Optimization
- 3-field simplified form
- Trust badges and testimonials
- Persona-specific messaging
- Mobile-first design
- Clear progress indicators
Page Performance
Before Optimization
- 5.2s average load time
- Large unoptimized images
- Blocking JavaScript
- No caching strategy
- Poor mobile performance
After Optimization
- 2.1s average load time
- WebP image format
- Deferred JavaScript loading
- Aggressive caching
- Mobile-optimized assets
SEO Performance
Before Optimization
- 500+ broken links
- 184 language issues
- Missing meta descriptions
- Poor internal linking
- No structured data
After Optimization
- All broken links fixed
- Multilingual optimization
- Complete meta data
- Strategic internal linking
- Rich snippets implemented
A/B Testing
Before Testing
- No systematic testing
- Assumption-based decisions
- Limited data collection
- No variant tracking
- Manual optimization
After Testing
- Continuous A/B testing
- Data-driven decisions
- Comprehensive analytics
- Automated variant tracking
- Systematic optimization
Flow Optimization Results
UX Laws & Heuristic Evaluation
Applied fundamental UX laws and conducted systematic heuristic evaluation to improve PocketHealth's usability and patient experience.
UX Laws Applied
Jakob's Law
Users spend most of their time on other sites, so they prefer your site to work the same way
Application
Implemented familiar healthcare portal patterns and standard navigation conventions
Miller's Law
The average person can only keep 7±2 items in their working memory
Application
Simplified navigation to 5 main sections and chunked information into digestible pieces
Hick's Law
The time it takes to make a decision increases with the number of alternatives
Application
Streamlined patient onboarding with progressive disclosure and clear primary actions
Fitts's Law
The time to acquire a target is a function of the distance to and size of the target
Application
Optimized mobile touch targets to 44px minimum and positioned CTAs in thumb-friendly zones
Heuristic Evaluation Results
Visibility of System Status
Before
No loading indicators or progress feedback
After
Clear loading states and progress indicators throughout
Match Between System and Real World
Before
Technical medical jargon and complex terminology
After
Patient-friendly language and familiar healthcare concepts
User Control and Freedom
Before
Limited navigation options and no clear exit paths
After
Clear breadcrumbs, back buttons, and escape routes
Consistency and Standards
Before
Inconsistent button styles and navigation patterns
After
Unified design system with consistent interactions
Overall UX Improvements
- • 92% SUS (System Usability Scale) score
- • 35% reduction in task completion time
- • 40% decrease in user errors
- • 25% improvement in user satisfaction
- • Simplified medical record access
- • Mobile-optimized patient portal
- • Clear healthcare terminology
- • Improved accessibility compliance
UX Principles & Outcome-Driven Design
Applied fundamental UX laws and outcome-driven design principles to create patient-centered experiences that prioritize measurable results over interface aesthetics.
Fundamental UX Laws Applied
Jakob's Law
Users spend most of their time on other sites, so they prefer your site to work the same way as all the other sites they already know.
PocketHealth Application
Implemented familiar healthcare portal patterns and standard navigation conventions to reduce learning curve.
Miller's Law
The average person can only keep 7±2 items in their working memory at one time.
PocketHealth Application
Simplified navigation to 5 main sections and chunked information into digestible pieces to reduce cognitive load.
Hick's Law
The time it takes to make a decision increases with the number and complexity of choices.
PocketHealth Application
Streamlined patient onboarding with progressive disclosure and clear primary actions to speed decision-making.
Fitts's Law
The time to acquire a target is a function of the distance to and size of the target.
PocketHealth Application
Optimized mobile touch targets to 44px minimum and positioned CTAs in thumb-friendly zones for better usability.
Outcome-Driven Design Approach
My approach at PocketHealth aligned with outcome-driven design principles, focusing on measurable patient outcomes rather than just interface aesthetics. This methodology prioritizes user goals and business results through systematic experimentation and data-driven optimization.
Similar to Netflix's approach described in Navin Iyengar's “Design Like a Scientist” methodology, I used outcome-based testing to drive design decisions by experimenting with multiple variations and measuring their impact on patient conversion and engagement metrics.
- • Patient sign-up conversion rates
- • Mobile engagement metrics
- • Task completion times
- • User satisfaction scores
- • A/B test results and statistical significance
- • User behavior analytics and heatmaps
- • Patient feedback and usability testing
- • Business impact and ROI metrics
References & Further Reading
Generative UI & Outcome-Oriented Design
Nielsen Norman Group's comprehensive guide on outcome-oriented design and the future of generative user interfaces that prioritize user goals over interface elements.
Read NN/g ArticleDesign Like a Scientist
Navin Iyengar's Netflix talk on outcome-based testing and experimental design methodology that inspired my conversion-driven design approach at PocketHealth.
Watch Netflix TalkTech Stack & Tools
A comprehensive toolkit for growth engineering, combining analytics, testing, and design tools to enable data-driven optimization and rapid experimentation.
Analytics Tools
Data tracking and user behavior analysis
Google Analytics
Conversion funnel analysis and user journey tracking
Amplitude
Advanced user behavior analytics and cohort analysis
Hotjar
Heatmaps, session recordings, and user feedback
Google Tag Manager
Event tracking and analytics implementation
Testing Platforms
A/B testing and experimentation framework
Google Optimize
A/B testing, multivariate testing, and redirect tests
Figma
Design prototyping and user testing
Ahrefs
SEO testing and optimization
Google Lighthouse
Performance testing and optimization
Design Tools
Design system and prototyping tools
Figma
End-to-end design process and collaboration
Notion
Kanban project management and documentation
Miro
Collaborative whiteboarding and user journey mapping
Material Design
Google's design system for consistent UI patterns
Performance Impact
Performance Metrics
SEO Metrics
Conversion Metrics
Technical Implementation Highlights
- • Cross-domain tracking setup
- • Custom event taxonomy design
- • Real-time dashboard creation
- • Automated reporting workflows
- • JavaScript code splitting
- • Image optimization pipeline
- • CDN implementation
- • Critical CSS inlining
Results & Impact
Measurable outcomes from systematic growth engineering, demonstrating the impact of data-driven optimization and user-centered design on business metrics.
Key Achievements
Conversion Growth
Sign-up conversions increased by 69% through systematic optimization
Performance Optimization
Google Lighthouse score improvement through technical optimization
SEO Excellence
SEO health score improvement using Ahrefs optimization
Analytics Implementation
Pages with comprehensive analytics tracking and event monitoring
Performance Metrics
Conversion Metrics
Performance Gains
SEO Improvements
Project Timeline & Milestones
Research & Analysis
Testing & Optimization
Scale & Results
Team Feedback
Business Impact Summary