Portfolio Checkup App

Portfolio Analysis Page


Glossary of Terms

The Client - the entity licensing this product to service their customers
The Investor - the customer of the client and end user of this product

About the Project

The investor linked their investment accounts and is excited to learn about their portfolio. The portfolio analysis compares 15-year performance, fund fees, and asset allocation of the investor’s current portfolio against the portfolio the product recommends. The job of this page is to convince the investor that they should invest in the recommended portfolio.

Where this project belongs in the product

The Problem

For the Investor
The investor
wants to know if their current investment portfolio is right for them and if not, they want to explore other options.

For the Client
The client wants to convert the investors into paying customers.

My Role

  • Research

  • Product strategy

  • Information architecture

  • Interaction design

  • Prototyping

  • User testing

  • Visual design

The Process

Step 1: Met with the Client & Defined the Problem

Our team met with the client and learned that the life coach's book brought the investor's attention to the potential "fire" in their investments. This feature had to reveal the "fire", which are things that hurt the investor's returns, and provide the fire extinguisher, which is a better solution. The problem is showing the investor that the product provides a solution they would want to purchase.

Step 2: Interviewed Investors & Defined the Problem

The VP of Product and I spoke to potential investors and learned that after they read the celebrity life coach's book, they really wanted to get their investments in order and get rid of potential "fires" so they can achieve financial freedom as quickly as possible. Here are some things they wanted to know about their investments:

  • How will it perform over the long-term?

  • How risky is it?

  • What are the fund fees?

  • Is this portfolio appropriate for their time horizon?

Step 3: Defined the Goals of the Solution

The VP of Product and I defined a set of goals that the portfolio analysis had to achieve:

  • Show how the investor's current portfolio performs compared to a recommended portfolio.

  • Show how much the current portfolio costs in fund fees compared to a recommended portfolio.

  • Show the appropriate asset allocation for the investor's time horizon.

Step 4: Analyzed Competitors

I looked at competitors who used a similar approach to converting investors and asked potential investors to give feedback on them. Many of the competitors focused heavily on performance and fund fees as well. It was informative to learn about some of the other metrics competitors used to benchmark the portfolios.

Step 5: Brainstormed Solutions & Collected Feedback

We worked with the client to brainstorm on the key components of the solution. Here's what we decided:

  1. The page opened with a snapshot of how the investor's portfolio performed against the one managed by the firm to grab their attention - the "aha" moment.

  2. Next was a comparison of the fund fees, which readers of the book knew can eat away at their returns. Both of these were the "fire" that our client wanted us to reveal.

  3. Following that was a comparison of the asset allocations because readers of the book also knew a properly diversified portfolio was a key to financial success. The firm's asset allocation and portfolio were the fire extinguisher that the investor needed.

  4. Lastly, there was a call-to-action to open an account.

I created sketches of the layout and collected feedback from stakeholders.

Step 6: Created Wireframes, Collected Feedback, & Tested

We worked with the client to explore ways to visually convey the portfolio's performance, fund fees, and asset allocation. The client wanted us to incorporate more concepts from the book so that this product felt more of an extension of the book. They suggested showing a projection of how much the investor can have in retirement and along with it, how much the investor needed to achieve each level of financial freedom, which were concepts mentioned in the book.

Investors wanted to know the risk of their portfolio, so I included how much each portfolio can lose in a year.

What We Learned
We tested this concept with potential investors who had an advance copy of the book and had mixed results.

  • Investors liked knowing how much they were on track to have in retirement.

  • Investors who read the book understood the levels of financial freedom but they pointed out that they wouldn't have understood it if they never read the book.

The client was later concerned that they were limiting themselves if the product only made sense to people who read the book. They eventually wanted to broaden their audience so they backed away from the idea.

Compliance was later concerned about the projections and being too promissory about the returns of the portfolio.

Step 7: Brainstormed New Solutions

I took the feedback and worked with stakeholders on new ideas. Because compliance was uncomfortable about projecting future returns for their portfolio, we decided to show 15-year past performance in a graph, which they were comfortable with. We also included a table to display some of the key metrics to compare the portfolios' risk and return.

Step 8: Iterated on Wireframes and Finalized the Solution

I iterated on the wireframes using the new ideas. Based on our previous research, we learned that investors were still frightened by the recession so I highlighted the returns from that period to emphasize how well the recommended portfolio performed. In the table, I included metrics summarizing annualized return, best and worst year, and number of years with a loss to provide risk vs return comparisons. This solution tested well with investors and satisfied the needs of compliance.

Step 9: Created Prototypes, Collected Feedback, Tested, & Iterated

After stakeholders approved the wireframes, I created prototypes with increased fidelity. The VP of Product and I collected more feedback from stakeholders and iterated on the designs, with the focus on usability and visual design. I conducted user testing to validate the designs and its usability via interview sessions and unmoderated tests.

Step 10: Created High-Fidelity Deliverables

After validating everything with stakeholders and investors, I prepared deliverables for engineering, which included:

  • Pixel-perfect mocks

  • Interactive prototype

  • User-flow diagram

  • Instructions on the usage of animation and motion

High-Fidelity Responsive Views on Mobile

High-Fidelity Responsive Views on Desktop

See more case studies for this product