Embraced Progressive Disclosure
The Challenge
The Emerson Sizing & Selection tool had historically low satisfaction. Customers found the tool confusing and time-intensive. The Emerson team needed to address the complexities of their fluid products and make it easy for customers to size and select the correct solutions.
The above All-In-One form was cluttered with input fields and options, presenting several UX challenges:
Complexity: The sheer number of options and fields led to cognitive overload and increased the chances for customers to encounter errors. Unfortunately, all the options were relevant and needed to remain.
Poor Information Hierarchy: Important elements were buried among less critical options, making it difficult for users to prioritize their actions or know where to begin.
Decreased Usability: Users struggled to find the specific fields and settings they expected.
Completion Time: The current solution was overwhelming. It’s easy to imagine users spending a lot of time scanning and locating the relevant fields, slowing down their workflow.
Increased Error Rates: The abundance of options led to user mistakes, such as overlooking required fields.
Reduced Accessibility: A dense layout can be particularly challenging for users with disabilities, such as those relying on screen readers or keyboard navigation.
Mobile Usability: No engineer would tackle this form on a mobile device. Even on smaller laptop screens, displaying all fields and options resulted in excessive scrolling and a cramped layout, hindering usability.
Maintenance and Scalability Issues: As the application grew, there was no easy way to scale and manage this complex form without increasing the likelihood of errors.
Learning Curve: New users found it daunting to understand and utilize all the available options at once, making the experience feel like being thrown into the fire.
Additionally, I noticed empty fields and answers I didn't have, labels I didn't understand, no clear starting point, and a mix of input types. There were no clear next steps, definitions, disabled options, tips, or an end in sight.
When I attempted to engage with the tool, I found scrolling problematic, it was unclear which fields were required, the lack of auto-populate options was intimidating, load times were slow, there were active fields for no reason, and no way to know the number of expected results. This was compounded by size and styling inconsistencies and a lack of hover and interaction states.
The worst thing was when I changed my measurement type selection all the other options changed.
The Solution
The solution was to present information in a structured and manageable way, ultimately leading to a more intuitive and satisfying user experience.
Addressing Complexity: Without removing any options, I revealed information incrementally, allowing users to focus on one task at a time and reducing mental fatigue.
Establishing Information Hierarchy: I created a clear hierarchy, highlighting essential features first and providing additional options as needed.
Simplifying Navigation: By guiding users through a step-by-step process, I enhanced overall usability and made it easy to move forward.
Improving Completion Times: I streamlined tasks by presenting only the necessary information at each stage, speeding up completion times.
Minimizing Error Rates: I reduced the likelihood of mistakes by limiting the visible options to those relevant to the current step.
Enhancing Accessibility: I presented information in manageable chunks, making it easier for assistive technologies to interpret and navigate.
Implementing Progressive Disclosure: This approach created a more enjoyable and user-friendly experience with a clean and organized interface, fostering higher satisfaction levels.
Optimizing for Mobile: We optimized the small screen experience by presenting information in bite-sized pieces, ensuring better readability and interaction on handheld devices.
Ensuring Maintenance and Scalability: We compartmentalized features, allowing for modular updates, which made maintenance and scaling easier as things changed.
Easing the Learning Curve: Our solution introduced inputs gradually, asking one question at a time, which helped users learn and adapt without feeling overwhelmed.
While displaying all fields and options on one screen might seem efficient at first glance, it often leads to a cluttered and user-unfriendly experience. In contrast, the new Sizing & Selection solution enhances usability by presenting information in a structured and manageable way, ultimately leading to a more intuitive and satisfying user experience.
Results
Shorter Task Completion Times
Decreased Error Rates
Higher User Engagement
Increased Customer Satisfaction
