Flourish Dashboard Navigation
Flourish dashboard provides access to a financial suite of products for various types of users.
Flourish dashboard provides access to a financial suite of products for various types of users.
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
Elephant
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.
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.
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.
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.
A global navigation sits on top of the dashboard where it surfaces global level pages such as notification center and profile menu.
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.
With the new design, users can switch households by clicking on the switch icon and search or choose households inside the temporary canvas area.
We displayed pre-set colors and logos to let the products and their identities shine through the visual treatment.
We executed the new navigation framework in multiple breakpoints including mobile size.
