Clarity AI Overview

Clarity AI is a software company that brings social impact to markets. The product offers numerous and groundbreaking ways to analyze the social impact of investments. This is necessary as a growing number of investors demand data and proof that their investments match their values. Clarity AI’s biggest product is a SaaS tool for financial advisors that offers two main capabilities:

Portfolio Analysis: Assess the social impact of your portfolio across numerous dimensions.
Screener: Assess companies, funds or governments based on your values and filter for those that meet your criteria.

Navigation Redesign

Define Why

Clarity’s SaaS product does not include consistent, permanent navigation. Upon joining Clarity, I formed a hypothesis that users have to overcome hurtles after entering the product for the first time and struggle to find the majority of value Clarity’s product has to offer. We offer a month long trial which is why the first impression of Clarity’s application is critical to the success of the product. Reducing any friction for users to see value is important. Below highlights the existing state of the navigation and concerns I have with it.

MY ROLE
Lead designer - discovery, research, UX/UI design, animation

Discovery

I began to gather information to validate my hypothesis and help support the redesign of navigation. I looked at two different types of data:

1. LiveSession (qualitative) Recordings of user sessions within the product

2. Heap (quantitative) Auto tracks user paths to help understand common flows users are taking

LIVESESSION FINDINGS
I watched 15 LiveSession videos focused on first time users and observed some consistent behaviors. Users are consistently:

• Entering Screener and clicking around aimlessly, confused (worst case was the user could not figure out how to get back to the home screen and eventually logged out).

• Creating a fake portfolio of 3-5 companies to get to the portfolio analysis product (Portfolio Summary)

• Quitting shortly after entering the Create Portfolio page

HEAP FINDINGS

FINDING #1: In the Portfolio Summary, users are clicking on “Summary” text repeatedly.

Observation From the Portfolio Summary page, users are selecting “Summary” (text in the top left corner) over and over again, sometimes selecting it prior to navigating elsewhere within the application.

Hypothesis Users are taking this action repeatedly because they are expecting a different result. My hypothesis is that they are expecting to find more functionality or navigation based on where this UI is positioned.

Based on my research, I proposed 3 things:

1. Update the navigation of the app to provide an easier and more intuitive experience for users to access different products (screener and portfolio analysis)

2. Include a Sample Portfolio for users to find value immediately from the portfolio analysis product

3. Make the Portfolio Summary the home page because it is our main product and is a good showroom for the different types of analysis Clarity provides

Scoring Profile Research

A scoring profile provides users with a way to customize how the scores Clarity provides are being calculated. Calculations are deeply dependent on what you are calculating (i.e. risk vs. climate change). Therefore, you can not have one scoring profile to cover all needs. Below is an example of a custom scoring profile for the ESG Risk product Clarity provides:

Currently, the user can select a scoring profile within the Portfolio Summary; however, the location of the action appears that it would affect all modules.

The product team and I discussed providing a master scoring profile that would combine all methodology scoring profiles into one. Alternatively, we could move forward with a one-to-one relationship of scoring profiles to modules and revise the UX/UI on the Portfolio Summary.

I set up interviews to discuss this topic with users and sales. My goal was to understand the needs of our users today and in the future.

I found that a master scoring profile was not a near-term need for users today. Currently, users are not creating unique scoring profile because they are mainly using the product for reporting purposes. The insight that I gathered from sales was that it was going to be a couple years until we gain sophisticated enough clients that care about developing unique scoring profiles. Therefore, I did not think it made sense to invest in a master scoring profile today and proposed revising the existing interaction of scoring profiles within the Portfolio Summary.

Ideation

First, I wanted to propose a new information architecture that resolved some of the identified obstacles for users.

Within the revised navigation flow users will:

• Be taken directly to the portfolio analysis tool (Portfolio Summary) without forcing the user to select or create a portfolio. To unlock this, Clarity will provide a sample portfolio for new users and surface the last viewed portfolio for existing users.

• No longer have access to the empty “Financial Performance” screen. The team and I strategically decided not to focus on Financial performance and it is not a part of our value proposition.

I reviewed this proposal with the Head of Product and my product manager and they both agreed it was beneficial.

Next, I researched different compositions for navigation and ultimately narrowed options down to 2:

1. Horizontal Navigation because it was very similar to what Clarity had currently with some small additions to improve the experience drastically.

2. Left-hand Side Navigation because it provides users with an easy option to navigate between methodologies (ESG Risk, UN SDGs, etc.) as well as products.

#1 HORIZONTAL NAVIGATION

Within the Portfolio Summary navigation, the information is separated into two main products; Portfolio and Screener. There is also metadata to the right-hand side with specific information pertaining to your portfolio (portfolio AUM and portfolio selected).

A dropdown menu is available to access different portfolio analysis tools and methodologies. The information is organized into three columns: general functionality, impact methodologies and traditional/risk methodologies. The horizontal line was explored to group the Categories information together.

Screener is now separated and easily accessible.

The navigation bar changes depending on what you are looking at: Portfolio summary, Module or Screener. For example, the scoring profile selection is removed from the Portfolio summary navigation but included in the Module navigation (based on scoring profile research). Below is an example of the navigation if you are viewing the UN SDGs (United Nation Sustainable Development Goals) methodology.

#2 LEFT-HAND SIDE NAVIGATION

Left-hand side navigation was explored because it provides users with an easy option to navigate between methodologies (ESG Risk, UN SDGs, etc.) as well as products.

Within this exploration the user can expand and collapse the navigation to create more space for the dashboard or table they are viewing.

Similar to the top bar navigation, navigation and information changes depending on what you are looking at: Portfolio summary, Module or Screener. For example, the scoring profile selection is removed from the Portfolio summary header but included in the Module header. Below is an example of the navigation if you are viewing the UN SDGs (United Nation Sustainable Development Goals) methodology.

Test and Iterate

First, I reviewed with engineering to get an estimate of how long each idea would take to implement and found:

1. Horizontal Navigation 1 week to build

2. Left-hand Side Navigation 1 month to build and 1 week blocking the entire team from building

Idea #2 was a large task because it forced the team to re-engineer the entire product while Idea #1 was contained within the top navigation bar which was already present across the app.

I reviewed these explorations with the Head of Product and shared estimates from engineering. Although, he preferred Idea #2 Left Hand Side Navigation because it was easier to go in and out of methodologies, he agreed with me that it made more sense to move forward with Idea #1 Horizontal Navigation.

I then tested the designs internally with 5 client-facing people. They provided invaluable feedback that I then used to:

• Reorder the information within the dropdown

• Rename the 3 buckets of information within the dropdown to “Manage” and “Insights” rather than “General” and “Categories”

• Reorder the Scoring Profile and Coverage when viewing a module to a more intuitive order

Implement

Below are the final design proposals which provide the user with:

• Universal and consistent navigation that is present across the application

• Easy access to Screener

• Clarity’s methodologies at first log in for users to find value fast

• No obstacles to find value in Clarity (by removing the need to create a portfolio and supplying users with a sample portfolio)

• A more intuitive relationship and interaction for Scoring Profiles that fit the user’s needs today (The redesign of the Portfolio Summary is not included in this case-study)

Post Release Monitor

This project was not implemented during my time at Clarify.

The data that I would track to measure success are LiveSession videos and Heap user paths again to see if the problems identified are resolved.