Task #1
Design a user-friendly 2FA experience for both B2C and B2B users.
Enhancing Security Through Two-Factor Authentication
See Jotform 2FA
Enhancing Security Through Two-Factor Authentication
Designing a secure and frictionless 2FA experience for 25M Jotform users
My Roles
Product Designer
UX Researcher
Team
1 Back-end Dev
1 Front-end Dev
1 Product Manager
2 QA Engineers
Timeline
February - June 2023
Toolstack
Figma
UserTesting
FullStory
As a product designer in Jotform's Enterprise Division, I led the design and rollout of a platform-wide Two-Factor Authentication (2FA) feature—addressing 2,000+ user requests and fulfilling enterprise-grade security needs without compromising usability.
The Challenge
Our goal was to improve account security with an additional layer of authentication—without creating friction or drop-off in user experience. We needed a solution that served both our individual (B2C) users and our enterprise clients with scalable and customizable options.
Tasks I worked on
My Contributions
I got chance to work on a wide range of tasks, from research to design to development to launch and growth.
- Spearheaded UX design from concept to launch across Web, Mobile App, and Enterprise Servers
- Conducted competitive and user research to align security practices with user expectations
- Defined user flows and edge cases including account recovery and enforcement scenarios
- Collaborated with engineering and QA teams to ensure a smooth, bug-free rollout
- Monitored usage, defined event tracking, and iterated on experience post-launch
- Initiated a growth strategy to boost adoption after initial release
Research
Analysis
Design
User Testing
Quality Assurance
Growth
Support
Research & Strategy
I explored authentication practices used by industry leaders (GitHub, Google, etc.) and internalized concepts such as MFA, SSO, and recovery mechanisms. I analyzed:
- Authentication Methods: Authenticator App, SMS, Security Keys, Passkeys, GitHub Mobile, Recovery Codes
- UX Pitfalls: QR code confusion, device recovery, friction points in sign-in flows
- User Personas: From casual form builders to healthcare, legal, and fintech professionals requiring HIPAA and SOC 2 compliance
I proposed a phased implementation plan prioritizing:
- Authenticator App
- Recovery Codes
- SMS and mobile app methods as future considerations
User Flows
I designed a user-friendly 2FA experience for both B2C and B2B users.
B2C - Regular User Flow
- Users enable 2FA via Account → Settings
- Authentication starts with password or social login re-verification
- Users scan a QR code or enter a secret key manually
- Users receive Recovery Codes and a confirmation email
B2B - Enterprise User Flow
- Enterprise Admins can enforce or disable 2FA at a team or user level
- Dedicated UI built into the Admin Console
- Users are prompted to set up 2FA upon login if enforcement is active
- Custom UI developed for white-labeled Enterprise Servers
High Fidelity Designs
Flow: Enabling 2FA
Both regular and enterprise users can enable 2FA via their account settings
Flow: Login with 2FA
After typing credentials or prompting a social login, users are prompted to enter a 2FA code. Users can choose to use an authenticator app or recovery code.
Event Tracking & Monitoring
To improve performance and usability, I worked with developers to define 29 unique eventListeners for 2FA-specific interactions. A few examples are shown below:
In FullStory, I implemented 24 CSS selectors to monitor behavior within:
- Security Settings
- Modals & QR Screens
- Recovery & Error States
- Email Verification Screens
This allowed us to detect issues like QR code mis-scanning and drop-offs during setup.
Launch & Communication
To drive adoption, I created a cross-platform launch strategy:
- Announcement Modal on user dashboard
- Email Campaign to all users
- Feature Inclusion in the April Newsletter
- FullStory Dashboard to monitor usage in real-time
- BDM Training and Support for Enterprise Clients
Enterprise Customization
Enterprise users demanded more advanced controls:
- Admin toggle for 2FA enforcement
- Per-user config for enable / disable / reset
- Custom login interfaces and error handling
- Special request flow for 2FA reset (in collaboration with Legal & Support teams)
All of these were scoped and designed with compliance and scalability in mind.
After Launch: User Feedback & Iteration
I tracked ~15K 2FA enablements post-launch, with 10K users continuing use. We uncovered two key UX issues:
- Lost Devices → Created secure, verifiable recovery process
- QR Confusion → Redesigned QR screens to guide users to open the Authenticator App before scanning
Driving Adoption: Action-Based Triggers
After noticing a decline in 2FA activations, I hypothesized that security-conscious users would respond better to timely nudges. I defined a set of Action-Based Email Triggers to promote 2FA:
- isPasswordChanged → Triggered when a user changes their password
- hasGeneratedAPIKey → Triggered when a user generates an API key
- isBackupEmailVerified → Triggered when a user verifies their backup email
- isPhoneVerified → Triggered when a user verifies their phone number
- hasEncryptedAsset → Triggered when a user encrypts their form
- hasExportedData → Triggered when a user exports their data
Summary & Impact
- Rolled out Jotform's first 2FA system across Web, Mobile, and Enterprise
- 10,000+ active 2FA users post-launch within first months
- Adopted by 40+ Enterprise clients
- 95% retention rate for 2FA users
- Launched a scalable recovery system and admin control interface
- Increased security usage through targeted growth emails
This story ends here yet the journey continues...
🎉 Thanks for Reading!
Thanks for taking the time to explore this project. I hope you enjoyed the deep dive into the process, challenges, and learnings behind it.
