All-time visible navigation
With the recent boom of UX Design domain, large enterprises started to recognize how they can benefit from easy-to-use software. A well-designed product is not only simpler to use. As it looks simpler on the surface, it is also much simpler to sell, adopt and support.
Simplification
More and more stakeholders, executives and business decision makers require their place at the design table. This is generally a great trend, as a good UX design process should be inclusive.
All established enterprises have to deal with product legacy, and thus everyone knows, how a clunky and bloated professional software looks like. What executives are looking for as an improvement is the exact opposite — a product that is immediately obvious to a novice or non-technical user. Visual simplicity. Clarity. Obviousness. Lucidity. Sexiness.
Simplifying is not hiding
Stakeholders are often too busy and distracted to understand the full depth of a particular UI scenario that is matching real world goals and constraints. Especially in the case of professional software, the end results might look complex to a person who is not performing the task. Professional software has a certain learning curve, even that ideally this learning experience is an integral part of the product itself.
Internal feedback is often targeted towards simplification of one particular screen or small interaction design subset that is reviewed during the design feedback loops. As the global product navigation does not obviously contribute to the actual task increment performed on the page, it is often the first item to shot down. Lets hide it. Hamburger menus. Dropdowns. Megadropdowns.
Professional apps can contain a lot of navigation items used to navigate between different pages, sections or states of the product. Obviously, by hiding them, there is larger canvas available for actual features. The general assumption is, that hiding these elements will help to maintain user focus on the actual task and not the product itself — aka the myth of invisible UI.
Resources
As in everything in UX design, the only correct answer is "It depends". It depends on the context and user base, and the only way how to prove the hypothesis right or wrong is to perform usability testing. In this particular case, the study would need to compare the performance of two versions of the same. But because of known challenges of an enterprise environment, this is often not happening.
So are there any other data supporting the navigation hiding hypothesis? Based my own research, quite the opposite is true.
Discoverability is cut almost in half by hiding a website’s main navigation. Also, task time is longer and perceived task difficulty increases. Hamburger Menus and Hidden Navigation Hurt UX Metrics by Nielsen Norman Group.
Showing users things they can recognize improves usability over needing to recall items from scratch because the extra context helps users retrieve information from memory. Memory Recognition and Recall in User Interfaces by Nielsen by Nielsen Norman Group.
There are three great design themes: making something beautiful, making something easier, and making something possible. The best designs accomplish all three at once. The Myth of Invisible Design by Dan Saffer.
Simplicity is key to great and innovative product design. But simplicity is way often confused with minimalist style. In fact, simple looking, minimal product UIs often carry hidden complexity. UX Myths by Zoltán Gócza
F-Shape
What I am advocating in my design practice is to use the simplest possible and standard design patterns for such a crucial item as the global product navigation. There are three main options:
- Horizontal tabbed navigation
- Vertical sidebar navigation
- In the case of multiple levels, some combination of both.
I am always striving for all-time visible navigation and I call this a screenshot test. For any professional product, users often seeks for help in a community by sharing a screenshot of a particular UI state. From any app screenshot, it should be obvious, what page or what state in global navigation the app is in. As a nice bonus, it also provides enough visual clues to figure out, how the user might end up there, and what are the available options to get out.
I always prefer recognition over recall approach, and I have validated this for the most complex enterprise applications spanning across multiple portfolio bundles. The argument that the product navigation takes too much screen real estate is not relevant in the responsive design world.
Progressive disclosure
In this post, I am targeting global product navigation only. I am not advocating for rigid all-time visible actions in the actual product interaction design. We all have that one software with thousands of toolbars or buttons randomly flying around the screen. Progressive disclosure is the key design pattern to apply for the rest of the goal or task based user interfaces.
For progressive disclosure, the same applies as for the product navigation design pattern. It has to be applied properly so that it does not just hide crucial UI components. I often see that features are hidden in attempt for a role based UI, but these roles are not defined by a comprehensive user research.
Conclusions
Above recommendations are based on my own observations and experience. Even that I often back up my decisions with external links to articles or research papers, these might support my own design preferences or biases. I am always keen to validate any assumption with a proper usability testing method. Without validation, all design decisions are always just that — assumptions.
