Jenny Stanley
Jenny Stanley 9 August 2021

Top 6 Basic Patterns for Mobile Navigation: Pros and Cons

There are many types of mobile navigation, and new ones are constantly created. In this article, we will discuss 6 of the most common types of mobile navigation found in an app and their advantages and disadvantages.

What is Navigation in App Design?

Imagine mobile apps are cities in the world and you (the user) are a tourist. Every city has its own culture, language, roads, and architecture that you might not understand. App navigation design is like a map or GPS that allows you to navigate those cities.

Good navigation design makes it effortless for you to move between the different screens of an app, it is intuitive and makes you feel in control the whole time, letting you know where you are going and where you are at all times.

Every app is different, so is every navigation. This article will discuss some of the most common types of navigations found in an app.

Types of Navigation

1. Menu

Designers have an additional problem when creating an app for a phone because of its limited screen dimensions. For this, they need to carefully think about how each pixel will be occupied.  A lot of apps contain multiple menus which allow you to access the different parts of an app. The more complex the app, the more menus it will have. Some of these menus are in the following.

1.1 Hamburger

You might have seen this menu many times on websites or apps without even knowing its name. It is usually found on the left top corner of the screen, and it usually appears as 3 lines stacked on top of each other.


  • Over the years it has gained a lot of popularity, making it recognisable almost everywhere
  • It occupies a very small space on the screen
  • Allows you to hide large menus or primary navigation while being always accessible


  • Even though it is widely understood as a menu, its shape might be confusing to some users
  • It takes one more step or action to discover that you must click on the icon first
  • It can be challenging to access on mobile screens due to its position on the top corner of the screen


1.2 Hierarchical - Dropdown

This type of menu is mostly common on websites, but it can also be used on mobile. It allows for multiple options to be found from a top tier menu on a single screen. This design requires a lot of planning and it is usually used to display sub-categories or sub-lists as a dropdown menu. You might find this kind of menu with a small icon of a downward triangle or arrow next to a menu label.


  • It can offer countless options in one single screen
  • It does not have to occupy the whole screen


  • Too many options or levels might make the interface seem very complex and frustrating


1.3 Hierarchical – Full Screen

Essentially, this menu is very similar to a dropdown with the main difference being that each subcategory is shown on a different screen and it allows for more than one level. This type of menu is usually implemented in settings or configuration options.


  • It is clearer than a dropdown and makes information easy to find if properly organised
  • Allows for multiple levels


  • It occupies the whole screen and does not allow other content than the menu itself
  • Too many options or levels might make the interface seem very complex and frustrating


2. Tab Bar

Tab bars are a great alternative to a hamburger menu for mobile design, especially when you have a limited amount of high priority navigation options. They usually appear as a static bar at the bottom or top of the screen with either an icon or label for each tab.


  • They are very intuitive and are a clear indicator of the user’s journey in the app. For instance, changing the colour when you are in the tab
  • A tab bar helps to bring consistency throughout the app
  • Immediate access compared to a hamburger menu
  • Friendly location when located at the bottom of the screen near your thumb


  • They occupy more space than other navigation types like hamburger menus
  • A limited number of tabs can be displayed on a phone


3. Tabs

Tabs play a similar role as a tab bar. However, there is the main difference that the content of tabs is in some sort of way related to each other or at least part of a common category


  • Help organising similar content
  • Universally understood
  • A convenient method of adding additional content


  • Hard to give the third level of navigation
  • A limited number of tabs can be displayed horizontally
  • Content is hidden within tabs which might be overlooked by the user


4. Gestures

The lack of space on the screen of a phone is compensated by the gestures that can be performed. As technology evolves, more gestures are introduced into mobile devices. Some examples of these gestures are swiping, double-tap, pinching, rotating and 3D touch amongst others.


  • Enhances interaction and replaces actions such as scrolling through a page which would not be possible without a mouse or keyboard
  • Reduces the use of buttons in some instances such as moving through different pages, images, lists and similar
  • They have become a standard making it easy for people to recognise instinctively
  • Once learnt, increases the ease of use of the app
  • Can be implemented creatively in numerous ways
  • Can be implemented to enhance the actions of other navigation buttons such as a back button by swiping right on the screen 


  • Most of them would require prior explanation to establish a relation between gesture and function
  • When overused might be difficult to implement
  • It might be difficult for some users to perform certain gestures


5. Back Button

This is an essential button in many apps, and it is usually located on the top-right part of a screen. The idea behind a back button is simply to take you back to the previous screen you were at. This is extremely useful, especially in large applications which contain several sub-categories.


6. Close button

Close buttons main purpose is to cancel actions. They are typically used to cancel searches, filters, pop-up windows and more. You can usually find this button in the right corner.


Important Things to Consider

For every type of navigation that is implemented in an app, there are several things that should be considered.

  • Navigation should be clear by making use of layout and pattern principles
  • The design should be made considering human-computer-interactions making it as intuitive as possible
  • Every element should be concise and straightforward using meaningful labels and having the right number of options
  • Make sure the navigation’s structure is clear and its flow is consistent


There are many types of mobile navigation, and new ones are constantly created. When deciding which navigation elements to use, a designer needs to weight the advantages and disadvantages of each element against the needs of the app whilst creating an ultimate user experience.

If you have any questions or need help with a project, feel free to reach out. We are a world-class web design agency that specialises in high-end web design and creating websites. We create designs of all shapes and sizes, from small sites to large e-commerce sites, but all with the same level of passion and skill. We connect brands to their audiences in today's world.

Please login or register to add a comment.

Contribute Now!

Loving our articles? Do you have an insightful post that you want to shout about? Well, you've come to the right place! We are always looking for fresh Doughnuts to be a part of our community.

Popular Articles

See all
8 Digital Marketing Trends to Watch in 2023

8 Digital Marketing Trends to Watch in 2023

The internet has conditioned customers to demand instant gratification, and that’s only set to continue. In 2023, customers will expect a response time of just hours. No more sending an email and waiting days for a...

Azeem Adam
Azeem Adam 3 May 2022
Read more
7 reasons why social media marketing is important for your business

7 reasons why social media marketing is important for your business

Social media is quickly becoming one of the most important aspects of digital marketing, which provides incredible benefits that help reach millions of customers worldwide. And if you are not applying this profitable...

Sharron Nelson
Sharron Nelson 6 February 2018
Read more
The 3 Most Important Stages In Your Presentation

The 3 Most Important Stages In Your Presentation

If you want to deliver a presentation on a particular topic and you have to prepare yourself for it you should make sure that you go through several very important stages in order to craft a compelling, persuasive and...

Nicky Nikolaev
Nicky Nikolaev 16 February 2016
Read more
How to Encourage Customers to Post Photos about Your Brand

How to Encourage Customers to Post Photos about Your Brand

Visuals impact buyer behavior – there’s no doubt about it. But not just any visuals will have the impact you planned on your eCommerce marketing strategy. If the only images your customers see in relation to...

Luisana Cartay
Luisana Cartay 8 June 2016
Read more
Deep Link vs. Universal Link: Which One is Better?

Deep Link vs. Universal Link: Which One is Better?

Are universal link and deep link the same thing? There are some big differences, let's understand them.

Stefano Pisoni
Stefano Pisoni 17 March 2020
Read more