Ninox Customizable Navigation
This initiative encompasses multiple design changes and new features for the Ninox platform, including a redesigned Information Architecture and expanded UI design capabilities for the Low-Code UI builder.
Project Summary
This initiative encompasses multiple design changes and new features for the Ninox platform, including a redesigned Information Architecture and expanded UI design capabilities for the Low-Code UI builder. While initially planned and prioritized based on high-priority partner and customer feedback, my role as Design Lead allowed me to expand the scope, introducing additional UX improvements and design refinements. Although presented as a single project, it spans various use cases across multiple areas of the platform, each requiring distinct design solutions.
Company
Ninox is a low-code business application platform designed for mid-sized companies across various industries. Its core value propositions include flexibility, rapid solution development, and compliance adherence, enabling businesses to build and scale efficiently.
Key Target Users
Our primary users are citizen developers and self-taught builders, along with partner organizations that create tailored solutions for their own businesses or clients.
Project Challenges
The navigation lacked customization capabilities, limiting builders from adapting both the structure and visual design of their applications. Additionally, there is no workspace-wide navigation system, making it challenging to ensure consistency across projects.
Goals
The project aims to:
- Enhance customizability by supporting both neutral and personalized appearances.
- Enable modular navigation structures that adapt to different user needs.
- Introduce a workspace-wide navigation system for better usability and scalability.
My Role
As a Lead Product Designer I led the end-to-end design process, from research and UX strategy to UI execution and final implementation. Collaborated cross-functionally with product managers, engineers, and stakeholders to ensure design alignment with business goals.
Timeline
Project Kickoff: November 2023
Current Status: Shipped across plattforms
Key Outcomes
✅ Shipped to users, improving the navigation experience across the platform.
✅ 100% adoption by partners, validating the solution’s impact and ease of use.
✅ Increased perceived value, elevating the platform’s market position and user satisfaction.
Research and Discovery
Understanding the context:
Challenge: No access to private cloud data, limiting insights.
Existing research relies on public cloud data and partner interviews.
AI analysis of forum discussions on navigation challenges.
Observational research from webinars and open office hours, studying how builders design navigation.
Key Finding
Builders improvise navigation solutions that operate independently from the data structure. This highlights a crucial need to decouple data structure (for builders and admins) from application navigation (for end users).
Information Archittecture, User flows, Role based access
Approach
Mapped current user flows and scenarios
Defined functional areas based on user roles and core tasks (Jobs to Be Done framework).
Key Finding
Current structure mixes hierarchical levels, creating misalignment with key user flows and role-based needs.
Ideation
Facilitated stakeholder workshops to drive alignment
Explored and refined navigation anatomy options
Introduced the concept of navigation split between data structure and application navigation
Designed context-based navigation
Developed low- and high-fidelity wireframes to visualize solutions.
Design
Explored multiple design options comparing and discussing the different benefits of each and gathering continuous feedback.
Design goals:
- neutral appearance of the side bar emphasis on accessibility
- custom color of the top bar as a first step to theming
- improved typography, icons and use of white space
- allowing customization while providing meaningful defaults
- harmonised and replaced all neutral tones across the product to match the new concept
Delivery and collaboration with development
One of the biggest challenges in delivering the first iteration of this large-scale project was planning a comprehensive rollout strategy for both the technical implementation and user adoption. I collaborated closely with Product, Engineering, and Solutions teams to ensure a seamless transition, minimizing friction and enabling users to migrate smoothly to the new navigation.
