Blog post
App navigation patterns and why the tab bar probably should be your first choice
By Lærke Lyhne. Design of an app's navigation is often the most fundamental and important choice in the design process. And a tab has advantages no other navigation principle has - so the tab will often be the best choice.
App design is not just about a nice UI or an inspiring interface. It is just as much about creating applications that are user-friendly, and navigation is an important part of that.
Navigation in the app needs to be both convenient and frictionless, making the app easy and intuitive to use. The easier your app is to use, the more likely it is that your users will return.
Users can get easily overwhelmed with choices when presented with too many options. And when we present all content in a similar way, all of it becomes visually equally important, making it difficult for the users to navigate your app.
One of the most basic forms of navigation is the Tab Bar. However, to succeed with this navigation method, the app information architecture needs to be thorough and sharp.
Prioritise, prioritise and prioritise
Due to the relatively small screen on mobile devices, navigation is always a challenge. That is why a simple, well-structured information architecture with hierarchies to clearly prioritise your content is key.
Which actions will be used the most? Which features are most important for your users? Questions like these will help with identifying the app’s core functionality. Place all of the most important features at the top of the hierarchy and non-essential features at the bottom.
The Tab Bar: Navigation and Classification
The tab bar is a simple way to group the content and features because each tab represents a separate section of the app. The tab bar is always visible and should provide the user with easy access to the most important functions.
Placing the tab bar at the bottom of the UI is a logical step if it is important for your app design that the users are able to navigate the app quickly. The alternative to such a solution is the so-called “Hamburger Menu”. Many popular apps like LinkedIn, Facebook and Instagram, have changed their design from using a hamburger menu to using a tab bar as they grew.
Important part of succeeding with a tab bar is having independent navigation hierarchies within each tab and making sure to avoid cross navigation between them. For example, if you have a dashboard as the first menu item, you should avoid content on the dashboard linking to any of the other tabs. Switching between tabs via content makes the user lose the context of the tabs and thereby lose track of where they are in the app. Only the users themselves should have the option to switch context in the app by selecting different tabs.
It could seem that the tab bar is the perfect solution but it has its limitations. The number of tab bar items ranges from three to five. Therefore, the tab bar should only present the top level of the app’s hierarchy. There is no room for secondary features in the tab bar – it is crucial to choose wisely and keep the future in mind. It is not recommended to remove or merge tabs when the app grows but rather minimise the amount of tabs in the very beginning, making it scalable once more space is needed.
It is possible to use the fifth tab as a “more” section, which will then reveal a menu with secondary menu items. Placing functionality here results in a less obvious communication towards the user since they can’t always know what to expect when visiting the tab. If the content within the “more” tab is secondary and thereby non-essential such as app settings and profile settings, moving it out of the tab bar could be an option. Such a section could then live at the top of the screen under a profile or settings icon within the primary tab. Once again, the importance of evaluating the relevance of the content of your tabs in a tab bar should not be underestimated – is this a section of the app that the users are going to visit often? If not, it might be wise to move it out.
Pushing the bounds
As a designer it is tempting to deviate from the standard in order to make your app distinguish itself from the millions of other apps on App Store and Play Store. But proceed with caution – there are more examples of apps with new navigation methods that have ended up confusing and annoying their users, than there are those that gave their users a great experience.
Designing a navigation is a challenge in itself but understanding one should not be. Sticking to the conventions and meeting the expectations of the users can make an app great. Apart from compromising on user experience, navigation models that do not follow the Android and iOS native patterns – like the tab bar – are also costly due to their implementation and maintenance.
While being mindful of all the pros and cons, pushing boundaries and experimenting has its place when it comes to creating an exciting user experience – but always with a specific purpose. So when we are talking about a creative navigation pattern, let’s keep in mind both the value and the price in the long run.
Vill du veta mer?
Låt oss få magi att hända och skapa en app du kommer att älska.
Berätta om ditt projekt.