Flourish Dashboard Navigation

Flourish dashboard provides access to a financial suite of products for various types of users.

My role

I redesigned the entire navigation framework of Flourish dashboard to work flawlessly on every page level across different breakpoints.


1 Product designer,
1 Design director,
1 Product manager,
8 Engineers




Mar 2020–Apr 2020
(1 month)


There are three types of users to engage in Flourish dashboard: investors, advisors, and executives. Among those three user types, the experience for ‘executives’ particularly had the most design challenges.

The existing sitemap for executives consists of 3 layers from top to bottom: 1) global level to see the list of their clients and advisors, 2) household level to manage settings and permissions of their clients, and 3) account detail level to see their clients’ account-related activities such as pending transfers.

Flourish dashboard sitemap

The problem

Inefficient ways of navigating

As users navigate through each of the levels, the navigation bar becomes dynamic and reflects the most relevant pages in each level. However, this usability was flawed and led to many workarounds as users go deeper into pages such as:

It was clear that the existing framework for the navigation did not work well especially for the executives.

The previous navigation structure

The solution

Paradigm shift

I came up with a radically shifted framework where the users could navigate efficiently at every level of the page they are in. It involves a persistent global navigation along with a left rail navigation that expands to support navigating into household and account detail level pages.

Our goal

The approach

We focused on nailing the design solution around the navigation framework for the executive experience since it meant that it would work for the remaining user types if we were to achieve.

Persistent global navigation

A global navigation sits on top of the dashboard where it surfaces global level pages such as notification center and profile menu.

Top global navigation

Left rail navigation to support household and account detail level pages

Left rail navigation promptly expands to allow users to intuitively navigate every corner of the household and account detail level pages. In addition, we leveraged expand and collapse functionality inside the chevron icons for added utility.

Left rail navigation

Switching households

With the new design, users can switch households by clicking on the switch icon and search or choose households inside the temporary canvas area.

Changing household

We displayed pre-set colors and logos to let the products and their identities shine through the visual treatment.

Visual treatment for various products

We executed the new navigation framework in multiple breakpoints including mobile size.

Web app screens