Baningo Cards
Early Dropout Reduction Through Preliminary Refinements
Implementing stopgap measures to address usability issues of a core product functionality.
About
The Product
Baningo Cards is a web-based SaaS digital business cards solution, tailored for businesses and teams. It offers an platform to create, customise, and share digital business cards.
The Project
During the initial product analysis, I observed usability issues with the card setup process requiring comprehensive product adjustments. To balance design efforts with immediate development needs, we prioritised fast-track improvements over comprehensive changes.
Time Frame
March 2023 - May 2023
My Role
UX / UI Designer
Team
Problem Statement
How do I enter the details? How do I enter the phone number? I am confused.
It's more effort than I thought, so I haven't had the chance to finish it yet.
Time-consuming micro-flows impact overall user productivity.
Card Setup Process at Glance
Typical card setup flow
After the card design and profile creation, the admin user has the option to either fill personal elements for each profile or delegate the task to cardholders, allowing them to fill their own personal elements.
While acknowledging the overall process as the root cause of usability issues, the fast-track improvements focused on optimising user experience without altering the process itself.
User Roles
Designs the cards
Manages the team
Can edit all the profiles
Admin is also a cardholder
Can only edit their own profile
Can preview and share their own card
Elements
Visual components displaying information on digital business cards.
Element data is the same across all team cards
Only admins can input data on the 'Design and link' page
Element data can differ from card to card
Cardholders can input their own data on the "Edit profile" page
Admins can input data via the "Team management" page for all the profiles
Product Improvements
Before
Element creation presented a significant hurdle in the card setup process, leading to user errors, confusion, and frustration.
The lack of guidance and feedback after creating a personal element was observed as the single biggest issue.
After
Consolidated steps in a single modal improve process visibility and help users retain context.
Reordered and numbered steps for a more intuitive sequence.
The new element highlights the inability to input personal element data within the modal and provides guidance.
Refined copy concisely explains the distinction between personal and company elements.
Before
The lack of distinction between element types on the "Design and link" page.
After
The indicator icon identifies personal elements, reducing cognitive load, and eliminating unnecessary clicks.
The tooltip additionally guides users where to input personal element data.
Before
Users had trouble finding where to upload logo and set the card colour.
After
The logo upload and the colour picker displayed prominently on the page ensure they are easily accessible.
Before
The design of the page made the task of editing profiles cumbersome and inefficient, especially for admin users editing multiple profiles.
After
Displayed and clustered element data offer a comprehensive overview.
Simplified data input enhances efficiency.
The mobile preview provides real-time feedback in the most commonly used format.
The new page appearance ensures a clear distinction from the “Design and link” page.
Before
Upon skipping the onboarding admin users landed on their 'Edit Profile' page. They had difficulty locating options to add elements and change the card's appearance.
After
The new prompt directs admin users to the page where they can start their card setup process and helps them assume their admin role.
Before
The lack of basic functionalities made it difficult for admin users to manage a bigger number of profiles.
After
Search and sort functionalities for an efficient way to navigate and manage profiles.
The visually enhanced ellipsis button resolves the challenge of admin users locating profile actions.
Outcome
180% decrease in early user dropout rate
Product monitoring and user tests revealed smoother user interactions, reduced confusion, minimized errors, and quicker task completion times. These qualitative insights underscore the project's success in delivering a more intuitive and efficient user experience.
Alongside these positive results, the process of implementing fast-track improvements also provided additional insights into user interactions and some underlying issues, informing potential comprehensive improvements to the product.
Ready to Dive Deeper?
I'm looking forward to discuss insights, challenges, and opportunities in more detail.
Right from the start, Žiga showed a strong desire to understand our product and its users, using various approaches to gain insights. He effectively identified the major pain points and suggested both quick fixes and broader changes to address them. Even with only quick fixes in place, the improvement in usability was evident, leading to a significant reduction in early user dropout.
Harald Meinl
Co-Founder & Product Owner at Baningo GmbH
Page Redesign
Web App
Baningo Cards