Services
Responsive Design
User Research
User Interface
Usability Testing
Team
Joanie Gauthier
Simplifying navigation to guide customers seamlessly from curiosity to conversion
Reimagine UI components for navigation dropdown to create a more intuitive and engaging experience, fostering deeper connections with users while reinforcing the brand’s vision and values.
Problem
Users struggled to navigate to their desired page and complete actions, with unclear categories causing confusion. Additionally, mobile and web responsiveness lacked consistency, hindering discovery and the overall experience.
Solution
Simplified the dropdown categories, ensuring intuitive grouping and labeling, while implementing visual cues to guide users and enhance usability.
Result
Users were able to find their destinations faster, with less confusion. This resulted in increased task completion rates and improved overall user satisfaction across both mobile and web platforms.
From Platform.sh to Upsun
Upsun empowers developers to push boundaries and build groundbreaking SaaS applications. The rebrand reinforces this vision, paving the way for a refreshed design system—addressing key user feedback, like frustration with mobile dropdown navigation on the Platform.sh website.
Optimize dropdown for smooth performance
The navigation dropdown fits within the marketing website, ensure smooth interactions within disrupting the content around. With subtle effects like fade-in transition that enhance the user experience without slowing down the site.
Responsive design for mobile breakpoints
Without a fully set design system, we focus on pulling in existing elements from the marketing website and product design to mobile breakpoint to ensure consistency.
Final Product: Seamless Integration from Desktop to Mobile
Focusing on placing key actions sticky at the bottom within thumb reach and key information on the top. This vertical alignment enhances readability and accessibility, making navigation easier and more intuitive on smaller screens.
Light and dark modes in design system
Light and dark modes offer users the flexibility to choose their preferred display style. While building a design system with reusable components, ensure seamless integration of both modes using Figma’s variants and color styles.
Impact of upsun dropdown
With clearer groupings and labels, users are able to find their desired destinations more quickly and with less effort, a noticeable reduction in user frustration and a significant increase in task completion rates.