We developed a user-friendly, modular sign-up flow in Framer that minimised the need for lengthy forms and improved usability with more interactive elements.
Within just two days of A/B testing, the new design outperformed the older version, with users in the variation group experiencing faster sign-ups and smoother onboarding.
Sign-ups were 10% quicker in the variation group, leading to a faster transition to onboarding compared to the control group, resulting in a more efficient overall user experience.
TEAM
Collaborated in a Cross-Functional Agile Team
As a Senior Designer assuming lead duties, I was part of a 22-member multidisciplinary team operating in an agile environment, using Scrum and Lean methodologies to optimize workflow and reduce waste. I worked closely with developers, a product manager, a data insight specialist, and another designer, driving design strategy and improving the product experience. Additionally, I participated in weekly leadership meetings, contributing to cross-team alignment and design decision-making.
Credits: Michela Hugo (Product Designer)
SCENARIO
Optimizing ID Verification for a Seamless Experience
I developed a user-friendly, modular sign-up flow in Framer that minimized the need for lengthy forms and improved usability with more interactive elements.
Within just two days of A/B testing, the new design outperformed the older version, with users in the variation group experiencing faster sign-ups and smoother onboarding.
Sign-ups were 10% quicker in the variation group, leading to a faster transition to onboarding compared to the control group, resulting in a more efficient overall user experience.
Challenge & Constraints
Onboarding, similar to the verification process in the banking system, is crucial for merchants to access funds after signing up. However, many merchants were unaware that they still needed to complete onboarding before funds could be released, leading to significant drop-off.
We faced two key constraints: code limitations and time pressure. Despite these, we aimed to streamline the process and ensure merchants understood the need for further verification, ultimately improving conversion and reducing friction.
TASK
Optimizing ID Verification for a Seamless Experience
We were tasked with investigating the reasons behind user drop-off and creating a more seamless experience for future users, while also making minor UI adjustments to the current design as an interim solution.
ACTION
Optimizing ID Verification for a Seamless Experience
To address user drop-off and create a more seamless onboarding experience, we adopted the User-Centered Design (UCD) approach. I started by conducting research through competitor analysis and usability testing on the current flow to identify pain points and opportunities for improvement.
Research & Collaboration
Following the research, I created a service blueprint to map out the entire user journey. To ensure we were addressing key areas across the process, I collaborated with teams from multiple departments (support, communication, business, data analysis, risk, and fraud). Each team was invited to add sticky notes to the service blueprint, indicating areas with pain points and potential opportunities for improvement.
Design Process
Through mapping and collaboration, we outlined three types of flows and ultimately chose the modular flow. This design breaks the process into smaller, manageable tasks, giving users a sense of control and reducing overwhelm. A modular flow, presented in a wizard-style format, is particularly effective for once-off tasks like onboarding, where simplicity and clarity are key.
Tools Used
- Framer: For designing the sign-up flow
- Miro: For mapping the service blueprint and collaborating across teams
- Figma: For UI design and prototyping
- Notion: For project management and documentation
By combining insights from research, collaboration, and design, we aimed to create an experience that was both user-friendly and efficient, addressing pain points while laying the foundation for a more seamless future experience.
Interim solution
We improved the banking details screen copy, implemented minor UI enhancements and added a progress stepper.
Success: In our experiment metrics we saw that the variation group (our design) had an 10.49% improvement over the control group, for companies submitting their bank details.
