Onboarding Forms
Redesigning the Partner Onboarding Experience at Lenus eHealth
Responsibilities
Webflow Development
UI/UX Design
Timeline
6 weeks
2024
Company
Lenus eHealth
Tools
Figma
Webflow
Overview
At Lenus, it's crucial that our partners (health/fitness coaches) get a proper onboarding. This ensures they have a good experience and submit high-quality content, maximizing their website's potential to convert leads.
The existing onboarding forms had critical issues with visual design, validation, and user experience. I redesigned the complete system, creating a cohesive design system and significantly improving the partner experience.
The Challenge
The existing onboarding forms had several critical issues that were frustrating partners and impacting the quality of submissions:
Poor Visual Design
The forms didn't align with Lenus's brand identity and lacked visual consistency across different sections.
Inconsistent Validation
Not all fields were validated properly, and error messages were either missing or unhelpful, causing user frustration.
Limited Interactivity
Static forms provided no real-time feedback or examples to guide partners through the process.
No Progress Tracking
Partners had no way to see their progress through the onboarding process, making it feel endless.
Before: The original onboarding form lacked visual appeal and proper validation.
Design Process
Discovery
Stakeholder interviews and user feedback analysis to identify pain points.
Design
Created multiple design concepts in Figma aligned with Lenus brand guidelines.
System
Built a comprehensive component system for consistency across all forms.
Implementation
Developed the redesigned forms in Webflow with advanced functionality.
The Solution
After: The redesigned brand form with interactivity and live validation.
Comprehensive Form Component System
I created a robust design system of reusable components for all Lenus forms, ensuring consistency and speeding up future development.
Smart Input Fields
Form inputs with real-time character counters, min/max validation, and clear error states.
Multi-Step Navigation
Clear progress indicators with step tracking to help users understand their progress.
Conditional Logic
Dynamic form fields that appear or hide based on user selections, creating a tailored experience.
Interactive Previews
Live preview areas showing how selections would impact the final website design in real-time.
Advanced Input Types
Specialized inputs like range sliders with custom labels, radio buttons with icon indicators.
Embedded Help Content
Lightbox content with examples, PDFs, and explanatory content accessible within the form.
Real-time character counters and clear progress tracking improve user experience.
Design System Impact
Form component system ensuring consistency across all Lenus forms.
Beyond improving onboarding forms, this project established a comprehensive design system now used across all forms, ensuring a consistent partner experience at Lenus.
Results & Impact
Key Outcomes:
- Significantly improved partner experience with modern, intuitive interface.
- Reduced support burden allowing Key Account Managers to focus on strategic relationships.
- Established scalable design system for future form development.
- Increased quality of submitted content leading to more effective partner websites.