Fintech Impact Investment App — quick UX Review
This year I decided to start investing ethically, basically what this means is that I put my money into companies that are intentionally generating social and environmental solutions. This includes investing in things like climate change, disruptive technology and equality. I use an app to make these investments and have been using it since its launch late last year. During this time I have seen two different versions of the app and based on my experiences of using them I have decided to write up a little UX review. From my conclusions I will make a proposal for a version three of the app.
First Impressions
I first used the app during beta launch and went through sign up and on-boarding at this time. I encountered a few bugs (see 1.0 below) and some minor UX issues(see 3.0 below) during this, but ultimately got through without any major usability issues.
Version 1 and 2 are very similar in structure, with three main pages, a home page showing your fund, a notifications page and a settings page…
The later two are mostly functional pages that do what they say, so I will focus on the first page which shows your investment. The biggest change between the versions saw the page split up into two sections: overview and performance, each with it’s own set of charts and information.
My fund page
The extra financial breakdown was a welcome addition but some of the underlying usability issues remain…
It’s not immediately obvious where you can and can’t click on this page, for example the pie chart is clickable, each segment takes you to a new page with more information about the sector you are invested in. The colour difference for segments of the chart is not clear enough, I ran this through Stark, the Sketch Plugin designed to simulate colour blindness, and can see potential accessibility issues here.
The ‘overview’ and ‘performance’ tabs are clear but they are very high up the page which for large screen phones means I have to move my hand in order to reach them.
Adding funds is a core function of this app but the floating button only appears on the overview page, not on the performance page. It is also positioned in a way that it blocks the visibility of content below.
The short-hand chart labels on the performance page (1W, 1M, 1Y) makes me have to think exactly what they mean.
Version 3
I have taken the issues mentioned above along with some general usability issues of the app and redesigned the ‘my fund’ page into what I am calling version 3…
The first change I made was to integrate the add funds button into the main menu. I intentionally placed this on the far righthand side, although it is probably the second most important item and second place might seem more normal it is actually easier, as a user, to remember the buttons placed on either side of the menu. So for the other primary menu position, the far lefthand side, I left the ‘my fund’ section where it was. I did, however change the icon from a chart to the more recognisable profile icon — it is after all a page about me.
Another key change was to switch the order of overview and performance, the reason for this is I think a user’s primary action in using this app is to see how their fund is performing, they first want to know if it is up or down. The secondary action is wanting to know more about which areas their investment is being made.
I overcame the issue of knowing what is and isn’t clickable by giving the appearance of selectable buttons to all options on this page. And I moved all the buttons to the bottom of the screen to make them more accessible to your thumb whilst holding the phone.
The secondary page “overview” conatins a revised pie chart. I removed the colours and the legend (key), using instead labels attached to the chart to help avoid any confusion or accessibility issues over which sectors are which. The intention here was to have the highlighted section always at the bottom. The user can click other areas of the chart and a micro-animation could be used to rotate the chart. The breakdown of the pie segment by region and company is, again, near the bottom to make it accessible to the thumb.
I did spend some time reviewing other pages in the app. For the notifications page I looked to improve the information hierarchy of the messages, as well as looking to integrate a live chat feature on to that page in an effort to provide 24/7 engagement and transparent communication. For add funds I designed it to make sure the quick deposit buttons were in reach at the bottom of the screen and also added a few options at more logical denominations.
And a final change I made was to add the company logo to the top header, there is no branding in the existing app which is a shame as this is a new fintech startup company I feel it is improtant to include this for the user.
Hope you enjoyed reading my review and recommendations for this app, please leave a clap if you did, thanks!
Note that this was a quick UX review, for more details of my normal full UX workflow please see some of my other projects :-)
