Nutmeg—The digital wealth manager

 
 
 
mobile-rebrand.png
 
 

Dashboard redesign

Our first step was to review every aspect of the product and try to list all the components, create a gap analysis, audit the exiting elements and then group them by their usage and measure the frequency of their appearance. This allowed us to build a plan and prioritise our work flow.

 
Screen Shot 2019-06-23 at 09.35.16.png

By taking a zoomed out view of the entire journey were able to better understand and sequence the various steps our users go through on the way to the dashboard. This also helped us identify patterns and templates that we could reuse in our visual design.

 
IMG_1911.jpg
IMG_3430.jpg
affinity-workshop.jpg

From here we wanted to establish rules and principles for the Design System. To begin with we established our core atomic expressions: Grid, colour, typography and icons. Before going any further we need to create a shared understanding of what a dashboard is and its role in lives of our users. To do that we had to turn to our design principles for guidance.

 

The Grid for the Design System

grid.png

The Typographic Scale for the Design System

typography.png

The Colour Palette for the Design System

Base UI

Base UI

 

Creating new compositions

After completing 15 contextual inquiries and 2 rounds of unmoderated remote card sorting exercises we were in a better position to understand how our users interact with with the dashboard and how they view and use their finances.

 
Screen Shot 2019-06-23 at 22.36.04.png
Screen Shot 2019-06-23 at 22.36.36.png

Armed with these new insights about our customers we began creating new compositions and visual arrangements, exploring new ways in which we could surface information for our customers, enhancing their situational awareness.

Using our base visual language to mock up wireframes we started to create our vision of the future. We wanted to get there in an iterative fashion creating embraceable change all the way and adopting a process of co-creation with our customers.

 
Full width panels

Full width panels

Customised content panels

Customised content panels

Customised content panels

Customised content panels

Dynamic content, filters and rich navigation

Dynamic content, filters and rich navigation

simple-pages-1.png
 

Narrative

Once we had our components we were able to begin developing the narrative and start to tell the story of the customers financial situation. Allowing them to customise and curate content gave them a more meaningful experience.

 
3.png
1.png
2.png
mobile 1.png
mobile 2.png
Group 5.png
Group 6.png
 

The app

All of the appropriate learnings about how our users interact with Nutmeg we were able to successfully feed into both the iOS and android app

nutmeg-mobile-splash.png
iOS mobile screens.png
app store preview.png
 

Business outcomes

Increased AUM
Improved session time
Reduce churn
Increased referrals
Increased tracking ability
Improved process measures
New market opportunities through open API’s

Customer outcomes

Customer Satisfaction Score (CSAT)
Customer Effort Score (CES)
Net Promoter Score (NPS)
Greater transparency
Ease of use
Improved understanding of journeys
Faster task completion time