NAVIGATING SEAMLESSLY
NAVIGATING SEAMLESSLY
NAVIGATING SEAMLESSLY
ORGANIZATION: Kyndryl
ROLE: Senior Lead UX Designer – Led platform-wide navigation redesign by conducting IA assessments, defining frameworks, and iterating on designs. Directed subject-matter expert interviews, prototypes, and cross-functional testing to ensure a consistent and seamless user experience. Collaborated with engineering and design teams for implementation aligned with platform goals.
METHODOLOGY: User-Centered Design, Navigation Heuristic Analysis, Information Architecture, Prototyping, User Testing (including usertesting.com), Design System Integration.
TOOLS: Mural, FigJam, Webex Meetings, Jira, GitHub, Sketch, Figma, Adobe Illustrator, Adobe Photoshop
ORGANIZATION: Kyndryl
ROLE: Senior Lead UX Designer – Led platform-wide navigation redesign by conducting IA assessments, defining frameworks, and iterating on designs. Directed subject-matter expert interviews, prototypes, and cross-functional testing to ensure a consistent and seamless user experience. Collaborated with engineering and design teams for implementation aligned with platform goals.
METHODOLOGY: User-Centered Design, Navigation Heuristic Analysis, Information Architecture, Prototyping, User Testing (including usertesting.com), Design System Integration.
TOOLS: Mural, FigJam, Webex Meetings, Jira, GitHub, Sketch, Figma, Adobe Illustrator, Adobe Photoshop
1. THE PROBLEM
1. THE PROBLEM
The navigation system across Kyndryl Bridge applications was fragmented, inconsistent, and lacked a unified structure. Applications operated independently, resulting in a lack of seamless transitions and a disjointed user experience. This fragmentation caused:
Users missed critical tools and features because the navigation layout did not make them visible or accessible.
Inconsistent hierarchies and patterns across applications caused users to struggle when switching between tools.
The navigation lacked a unifying framework, making it feel disconnected and reducing the perception of the platform as a cohesive ecosystem.
The navigation system across Kyndryl Bridge applications was fragmented, inconsistent, and lacked a unified structure. Applications operated independently, resulting in a lack of seamless transitions and a disjointed user experience. This fragmentation caused:
Users missed critical tools and features because the navigation layout did not make them visible or accessible.
Inconsistent hierarchies and patterns across applications caused users to struggle when switching between tools.
The navigation lacked a unifying framework, making it feel disconnected and reducing the perception of the platform as a cohesive ecosystem.
2. REQUIREMENTS ASSESSMENT
2. REQUIREMENTS ASSESSMENT
Context
Kyndryl Bridge is a modular multi-cloud platform designed to unify cloud services and applications into a single, cohesive user experience. Each application operates independently, using different technologies, teams, and hosting environments. Despite this modularity, the platform shares key elements, such as accounts, permissions, user profiles, and navigation.
The challenge lay in creating a seamless navigation system that not only addressed inconsistencies between applications but also reinforced the perception of Kyndryl Bridge as a unified platform. The solution needed to balance flexibility for application teams and consistency for users, while ensuring that critical tools and features remained intuitive and easy to access.
Kyndryl Bridge is a modular multi-cloud platform designed to unify cloud services and applications into a single, cohesive user experience. Each application operates independently, using different technologies, teams, and hosting environments. Despite this modularity, the platform shares key elements, such as accounts, permissions, user profiles, and navigation.
The challenge lay in creating a seamless navigation system that not only addressed inconsistencies between applications but also reinforced the perception of Kyndryl Bridge as a unified platform. The solution needed to balance flexibility for application teams and consistency for users, while ensuring that critical tools and features remained intuitive and easy to access.
Information Architecture (IA) Assessment
The IA assessment was a foundational step in understanding and addressing navigation inconsistencies across Kyndryl Bridge applications:
Platform-Wide Audit: Conducted an in-depth review of all application hierarchies to evaluate how tools and features were organized.
Subject-Matter Expert Interviews: Collaborated with product managers, team leads, and delivery partners to understand workflows, pain points, and the navigational needs of each application.
Recommendations for Applications: Proposed structural improvements for individual applications to standardize internal IA and better align with the platform-wide navigation framework.
The IA assessment was a foundational step in understanding and addressing navigation inconsistencies across Kyndryl Bridge applications:
Platform-Wide Audit: Conducted an in-depth review of all application hierarchies to evaluate how tools and features were organized.
Subject-Matter Expert Interviews: Collaborated with product managers, team leads, and delivery partners to understand workflows, pain points, and the navigational needs of each application.
Recommendations for Applications: Proposed structural improvements for individual applications to standardize internal IA and better align with the platform-wide navigation framework.
Findings and Suggestions
Inconsistent Hierarchies: Applications used varying structures and terminology, making navigation unintuitive and inconsistent.
Hidden Tools: Critical features were buried in some applications, causing users to miss important functionality.
Platform Alignment: A lack of standardization reduced cross-application usability and diminished the perception of Kyndryl Bridge as a unified platform.
Inconsistent Hierarchies: Applications used varying structures and terminology, making navigation unintuitive and inconsistent.
Hidden Tools: Critical features were buried in some applications, causing users to miss important functionality.
Platform Alignment: A lack of standardization reduced cross-application usability and diminished the perception of Kyndryl Bridge as a unified platform.
Outcomes
Defined a standardized IA framework to improve consistency and scalability.
Enhanced internal application structures to support seamless integration into the platform-wide navigation system.
Defined a standardized IA framework to improve consistency and scalability.
Enhanced internal application structures to support seamless integration into the platform-wide navigation system.
3. RESEARCH
3. RESEARCH
Navigation Framework Goals
Consistency: Create a unified structure that aligns all applications under a single navigation system.
Visibility: Ensure key tools and features are accessible and prominent across the platform.
Intuitiveness: Minimize cognitive load by designing a navigation experience that feels natural and "invisible."
Consistency: Create a unified structure that aligns all applications under a single navigation system.
Visibility: Ensure key tools and features are accessible and prominent across the platform.
Intuitiveness: Minimize cognitive load by designing a navigation experience that feels natural and "invisible."
Defining the Framework
Pattern Research: Studied navigation systems from similar platforms to identify intuitive, familiar patterns that would resonate with users.
Framework Creation: Designed a multi-level navigation framework that balanced consistency and flexibility, ensuring scalability for new applications and future platform needs.
Stakeholder Engagement: Presented the framework to cross-functional teams, fostering alignment and securing adoption across the platform.
Pattern Research: Studied navigation systems from similar platforms to identify intuitive, familiar patterns that would resonate with users.
Framework Creation: Designed a multi-level navigation framework that balanced consistency and flexibility, ensuring scalability for new applications and future platform needs.
Stakeholder Engagement: Presented the framework to cross-functional teams, fostering alignment and securing adoption across the platform.
4. PROTOTYPING AND TESTING
4. PROTOTYPING AND TESTING
Prototype Creation
Built interactive prototypes in Figma to demonstrate the proposed navigation structure.
Focused on clear hierarchies, improved visibility of tools, and seamless transitions between applications.
Testing
Conducted A/B testing to evaluate different navigation layouts and identify the most effective patterns.
Ran usability testing to validate the framework's intuitiveness and ensure users could easily locate critical tools.
Insights and Iterations
Users highlighted the importance of consistent labeling and grouping, confirming the need for standardization across applications.
Iterations focused on improving the discoverability of tools and streamlining transitions between workflows.
Prototype Creation
Built interactive prototypes in Figma to demonstrate the proposed navigation structure.
Focused on clear hierarchies, improved visibility of tools, and seamless transitions between applications.
Testing
Conducted A/B testing to evaluate different navigation layouts and identify the most effective patterns.
Ran usability testing to validate the framework's intuitiveness and ensure users could easily locate critical tools.
Insights and Iterations
Users highlighted the importance of consistent labeling and grouping, confirming the need for standardization across applications.
Iterations focused on improving the discoverability of tools and streamlining transitions between workflows.
Top Navigation Features
Top Navigation Features
The top navigation is designed to provide users with a consistent experience across the Kyndryl Bridge platform, acting as an anchor that orients users and facilitates easy access to essential areas.
The top navigation is designed to provide users with a consistent experience across the Kyndryl Bridge platform, acting as an anchor that orients users and facilitates easy access to essential areas.
App Switcher
The App Switcher serves as a navigational hub enabling users to move seamlessly between primary areas, such as Dashboard, Services, and Insights.
The App Switcher serves as a navigational hub enabling users to move seamlessly between primary areas, such as Dashboard, Services, and Insights.
Account Switcher
Allows users to change the context of their view, displaying account-specific data and settings.
Allows users to change the context of their view, displaying account-specific data and settings.
Utility Deck
Includes Support, Notifications, aThe Utility Deck is a critical component of the top navigation, providing users with immediate access to essential tools and contextual information. It serves as a consistent anchor across the platform, ensuring users can easily navigate complex workflows without losing access to key features.nd Profile, ensuring quick access to essential tools and information.
Includes Support, Notifications, aThe Utility Deck is a critical component of the top navigation, providing users with immediate access to essential tools and contextual information. It serves as a consistent anchor across the platform, ensuring users can easily navigate complex workflows without losing access to key features.nd Profile, ensuring quick access to essential tools and information.
Support: Centralized help documentation, troubleshooting guides, and contact options for quick assistance.
Support: Centralized help documentation, troubleshooting guides, and contact options for quick assistance.
Notifications: Real-time alerts from individual applications and the platform, keeping users informed on updates and critical events.
Notifications: Real-time alerts from individual applications and the platform, keeping users informed on updates and critical events.
Profile: Displays user information, access groups, and permissions, with options to personalize the platform experience.
Profile: Displays user information, access groups, and permissions, with options to personalize the platform experience.
Local Navigation Features
Local Navigation Features
The local navigation appears once users enter a specific section or service within the platform. It provides deeper access to features and tools relevant to the selected area, maintaining a focus on the tasks at hand. The local navigation is tailored to each service, ensuring that it complements the overall top navigation while offering the specialized controls and actions required for more complex workflows. Its design ensures a smooth transition between different levels of navigation, maintaining context and user orientation throughout the experience.
The local navigation appears once users enter a specific section or service within the platform. It provides deeper access to features and tools relevant to the selected area, maintaining a focus on the tasks at hand. The local navigation is tailored to each service, ensuring that it complements the overall top navigation while offering the specialized controls and actions required for more complex workflows. Its design ensures a smooth transition between different levels of navigation, maintaining context and user orientation throughout the experience.
App Switcher
App Switcher
Local Navigation provides users with focused access to tools and features within specific sections of the platform, complementing the top navigation. It allows users to explore deeper functionalities without losing their connection to the primary navigation structure. By ensuring seamless transitions, Local Navigation supports more complex workflows while maintaining a clear sense of orientation for the user.
This navigation is intentionally limited to three levels deep to balance functionality and usability. Research indicated that deeper hierarchies often lead to confusion and slower task completion. By capping the depth, Local Navigation keeps the experience intuitive and prevents overwhelming users, ensuring they can efficiently access the tools and information they need.
Local Navigation provides users with focused access to tools and features within specific sections of the platform, complementing the top navigation. It allows users to explore deeper functionalities without losing their connection to the primary navigation structure. By ensuring seamless transitions, Local Navigation supports more complex workflows while maintaining a clear sense of orientation for the user.
This navigation is intentionally limited to three levels deep to balance functionality and usability. Research indicated that deeper hierarchies often lead to confusion and slower task completion. By capping the depth, Local Navigation keeps the experience intuitive and prevents overwhelming users, ensuring they can efficiently access the tools and information they need.
5. IMPLEMENTATION
5. IMPLEMENTATION
Delivered high-fidelity designs that adhered to the Shidōka Design System, ensuring consistency with platform standards.
Collaborated with engineering teams to implement the navigation framework and updated application structures.
Supported ongoing refinements based on post-launch feedback, addressing any additional user pain points.
Delivered high-fidelity designs that adhered to the Shidōka Design System, ensuring consistency with platform standards.
Collaborated with engineering teams to implement the navigation framework and updated application structures.
Supported ongoing refinements based on post-launch feedback, addressing any additional user pain points.
6. OUTCOMES
6. OUTCOMES
Thorough IA Assessment: The IA assessment resulted in a 20% improvement in navigation consistency, as reflected in post-launch usability scores, enabling users to transition seamlessly across applications.
Cross-Team Alignment: Early stakeholder engagement reduced cross-functional design and development delays by 15%, accelerating implementation timelines.
User Validation: User testing led to a 30% increase in task success rates and a 25% reduction in time to complete navigation-related tasks, demonstrating the effectiveness of the new framework.
Improved Discoverability: Enhanced visibility of critical tools contributed to a 20% increase in feature engagement across the platform.
Thorough IA Assessment: The IA assessment resulted in a 20% improvement in navigation consistency, as reflected in post-launch usability scores, enabling users to transition seamlessly across applications.
Cross-Team Alignment: Early stakeholder engagement reduced cross-functional design and development delays by 15%, accelerating implementation timelines.
User Validation: User testing led to a 30% increase in task success rates and a 25% reduction in time to complete navigation-related tasks, demonstrating the effectiveness of the new framework.
Improved Discoverability: Enhanced visibility of critical tools contributed to a 20% increase in feature engagement across the platform.
What Went Well?
What Went Well?
User-Centric Design: The user interviews and feedback sessions provided deep insights, allowing us to create a navigation experience that closely matched user needs. Collaboration with
Development: Close coordination with the development team ensured a smooth integration of navigation components, maintaining design consistency.
Iterative Approach: Regular iterations based on usertesting.com data allowed for quick adjustments, improving the overall usability of the navigation system.
User-Centric Design: The user interviews and feedback sessions provided deep insights, allowing us to create a navigation experience that closely matched user needs. Collaboration with
Development: Close coordination with the development team ensured a smooth integration of navigation components, maintaining design consistency.
Iterative Approach: Regular iterations based on usertesting.com data allowed for quick adjustments, improving the overall usability of the navigation system.
8. WHAT I COULD HAVE DONE BETTER
8. WHAT I COULD HAVE DONE BETTER
Expanding User Testing: Including a wider variety of personas and workflows in testing could have uncovered additional areas for improvement.
Ongoing Monitoring: Establishing a formal post-launch feedback loop would have provided more real-time insights for continuous refinements.
Expanding User Testing: Including a wider variety of personas and workflows in testing could have uncovered additional areas for improvement.
Ongoing Monitoring: Establishing a formal post-launch feedback loop would have provided more real-time insights for continuous refinements.