About

Spring is a finance and budgeting tool in need of a dashboard, brand identity, and mobile app. It helps users track and set budgets, set goals, and keep track of payments and bills.

Scope

This project focuses on creating a cohesive brand with cross platform elements and assets, and streamlining and cleaning up the information heirarchy of a data heavy interface.

User stories

I want to check how much I need to save this month, so I can afford that holiday next year.

I want to figure out where I’m spending the most money, so I know where to cut back.

Exploration

For some research I analysed some competitors and interviewed some users, and took away a few key user stories. The overarching theme was that personal finance goals on a micro level are deeply personal and specific, but on a macro level can be distilled into a few categories. Those who want to save more, those who want to track their spending, and those that want to grow invesments. Often these categories overlap, but I worked on the assumption that most users would check this dashboard to facilitate at least one of those three things.

Interface

As personal finance goals are unique to each user, I wanted to keep the interface customisable to allow different users to focus on their personal interests, without having to build separate interfaces for each target persona. This lead naturally to a card style layout with swappable tiles that can be placed on the dashboard.

Brand

Building a brand, I knew this prodcut needed to be designed to relax users and reduce strain, being such a data heavy interface. I created a logo and wordmark that was simple and clean - It’s just an S combined with a spring (revolutionary) - and rounded it off to create an identifiable mark at all practical scaling.

The colour palette and visual styling was also built conscious of this, with the muted colours and outline style icons kept free from shadows and gradients to simplify and reduce eye strain as much as possible.

Iconography

An important part of the navigation, and categorisation of features within the product, I created the customised outlined icons to serve multiple uses. More detailed and larger icons with splashes of colour behind were allocated for categories of spendings, to help users visualise their largest expenditures. A smaller, simpler set of icons was used for the sidebar desktop navigation, and navigation within the mobile application. The overarching goal of the visual element was to reduce cognitive load on the user.

Clutter

To reduce clutter on the dashboard I wanted to do away with expansion buttons or detailed graphing on the cards themselves, and instead have them be expandable with a click. In order to ensure clarity, the solution of a quick modal tutorial was created for display on opening the dashboard for the first time, which would instruct users to click a card for more detail.

Solution