Track Your Networth

Netfolio

CLIENT
Netfolio

DELIVERABLE
UX Design
UI Design

DATE
February 2020

An early-stage startup approached us with an idea for a multi-asset portfolio tracker. Its focus was personal net worth and scalability over time.

The goal was to design an appealing interface that merges what currently takes multiple apps into one seamless experience. Starting with only the most popular asset types, it would need to support scaling to more categories as demand grows over time.

A multi-asset portfolio net worth tracker.

Netfolio Desktop and Mobile Preview

The Brief

Design a simple to use, responsive and easily scalable interface that allows tracking the personal net worth over multiple asset types.

User Research

Early user interviews showed that, at launch, the most crucial asset categories would be stocks, commodities, foreign currencies and cryptocurrencies.

Following the initial feedback, it was a priory to streamline the interface and keep it as clean as possible while still satisfying essential user needs.

Netfolio Personas
Netfolio Information Architecture

Mobile Exploration

Working with diversified financial information wasn't easy. Our goal was to keep the screens as simple as possible, and not overwhelm the user at any point. Designing mobile-first was a natural constraint for us that helped us achieve a minimal design. 

netfolio-ux-preview
netfolio-user-journey

Desktop Exploration

netfolio-desktop-ux

Moving from UX → UI

Once the UX tested well, both in terms of user acceptance as well as scalability, we moved on to design the elements of the interface.

Colors

Financial markets can be highly volatile. Therefore, we chose blue to take advantage of the provable calming effect that the color has on human psyche.

Throughout the UI, not only did we use a wide spectrum of blues, but also blue-tinted greys to further convey the feeling of tranquility.

netfolio-color
netfolio-typography-1

Typography

Fira Sans is a slightly wider and calmer sans-serif typeface which goes very well with our color choices. Together, they provide peace of mind when looking at potentially very impactful financial numbers.

Putting It All Together

Everything at a glance. Never overwhelming.

netfolio-sidebar
netfolio-category-pill-crypto
netfolio-category-pill-stocks
netfolio-menu-drop
netfolio-table

In Numbers

5 weeks

Start to finish

700+

U.S. Stocks

50+

Cryptocurrencies

5+

Asset types

Numbers based on the soft-launch version of the product.

Summary

We had a lot of fun working on Netfolio. Some of us haven't had the chance to dive into financial products before, so this was the perfect excuse. Exploring established platforms (e.g. Robinhood, Yahoo! Finance or Blockfolio) has taught us a plethora of things which we will be taking into future projects.

We would like to highlight two challenges in particular.

Firstly, the requirement of having Netfolio appeal to newcomers and successful investors alike. When dealing with a numbers-heavy dashboard, it is easy to make it feel overwhelming. We decided early on that every design element would have to pass our everything at a glance, never overwhelming-mantra.

Secondly, scalability. The client had ideas for asset types that would, hopefully, make Netfolio into a one-of-a-kind portfolio tracker. While we couldn't accomodate all of them in the initial phase of the project, we laid out the groundwork for the future. The layout can easily be extended to support a virtually infinite amount of asset categories.

If you're an investor looking for an easy way to track your net worth across multiple asset types, we highly recommend you give it a shot yourself.

We loved working on Netfolio.

Ready to build Finance 2.0?

Contact

© Sunstory Design 2021

Made with ❤️ in Dubai, UAE.