Effective navigation is critical for users. It lets them know what they can accomplish, where they are and where they can go, and shows the breadth and depth of the application.

Harmony’s navigation framework contains patterns that work together to guide the user through the application or a particular flow. Patterns like left navigationheadertabs, and flow navigation  help orient the user as well as convey what other areas of the application exist. These patterns help users get from point A to point B.

Back Navigation

Back Navigation allows the user to travel one level up in the information hierarchy.

  • Created by
  • Last modified June 1, 2015 by Dexx Dorris


On mobile devices, users can use the Create Icon to create transactions and other important actions. It is available on every screen except transaction modals.

  1. On a tablet, it opens a menu with multiple selections.
  2. On a phone, it is contextual to the current screen.
  • Created by
  • Last modified December 5, 2014 by Marni

Flow Navigation

Flow navigation guides the user through a task that includes multiple steps. It’s designed to give the user a sense of place and progress within a particular flow, while breaking down the tasks into easily digestible sections.

  1. Linear flow navigation guides the user through tasks that require the completion of steps in a specific order.
  2. Non-linear flow navigation allows users to complete steps without adhering to a specific order.
  • Created by
  • Last modified May 11, 2015 by Dexx Dorris

Global Header

The Global Header contains creation tools, help, messages, and settings utility menus that apply to all areas of the application. Items in the Global Header that require the user’s attention may be highlighted by a notification Badge. Within the global header, the Create Menu allows the user to create and access important application-related items, while the utility items on the right are for utility; settings, help, and inbox.

  • Created by
  • Last modified June 2, 2015 by Dexx Dorris

Horizontal Tabs

Tabs are used to separate content into different views, which can be displayed one at a time without a page refresh.  Tabs provide easy access to additional content without requiring the user to go to a new page.

Left Navigation

You probably know what Left Navigation is. For the 0.1% of you who do not: the Left Navigation panel links to important sections of the application, and contains app branding.

  • Created by
  • Last modified August 31, 2016 by Dexx Dorris


Within the application, Search occurs at an application level (e.g., accessible from the Global Header) as well as at a component level (e.g., within the Add Drawer).

  • Created by and
  • Last modified April 30, 2015 by Dexx Dorris
© Intuit 2016 | Terms of use