Fin

Digital Assets - Where Fintech meets a dystopian finish to the natural world. 

(an oxymoron to saku) 

OVERVIEW

SUMMARY

According to 'The Unstoppable Rise of Digital Assets',  the total digital asset market size is now approximately US$350 billion. 

Yet after listening to the many complaints about the current Fintech webapps such as Coinbase, Binance, Revolute etc, experiencing some issues myself, I wanted to create my own fintech webapp, Fin. 

The Idea would be to build a digital assets platform, each user has their own avatar, profile and digital world. They can learn about, buy, and trade stocks, crypto's and NFT’s as well as having a social platform where you can interact with other users, show off their NFT’s and trading history within their digital world and exchange thoughts and assets. 

ROLES AND RESPONSIBILITIES

Role: UX|UI Designer

Platform: Desktop / Mobile

Tools: XD / Trello / Phtotoshop / Illustrator 

Deliverables: UX Design / UI Design / Graphic Design 

SCOPE AND FOCUS 

My main focus of this project was to come up with a sleek and clear design for trading and saving digital assets. Using and exploring soft UI design Neumorphism, which is notoriously un-user friendly, but a key trend in UI design, I wanted to combat its unfriendly reputation and try to create a functional and user-friendly experience for both novice and experienced traders and savers. Focusing on what is really important to the user, whilst maximising on this UI trend, to create a unique cult brand webapp. 

THE PROCESS

DISCOVERY AND RESEARCH

DESIGN GOALS

Research Goals:

To create an informative web app that helps expand the users knowledge to help maximize their assets and savings. 

Research Objectives:

- Find out people's pain-points and struggles with current finance apps.
- Find out what motivates users and what their goals are for their finances.
- Find out what information customers need to make informed decisions.
- Research current trends in fintech and design. 
- Stay up to date with competitors. 

Methodologies: 

- Market research - Analysis trends and forecasts.
- Competitive Analysis - Conduct a strengths and weaknesses list on competitors to understand market positioning and differentiation. 
- Customer interviews with potential customers.

High-Level Design Goals and Objectives: 

- Design the branding and UI kits for Fin using soft UI
- Create a web based app that can be used on both Web and mobile.  
- UX experience that combats the customer pain points.

COMPETITIVE ANALYSIS 

There are a lot of fintech products out there, with more popping up each day, I wanted to check out some of the competition, below are my findings along with the companies main features, strengths and weaknesses.

TAKEAWAY SUMMARY:

The main issues with finance sites seems to be the customer service, the lack of options, and information given to customers. It would be great to make sure these categories are clearly and easily found on the site. There seems to be a mix of great, good and bad UI and UX design, with Etoro being the best and Binance the worst. Tring to show as much information, in the most simplistic way possible will be key to the design.

TAKEAWAY KEY FEATURES:

(to include in Fin)

- App & Desktop
- Savings / Crypto / Stocks / NFTs? 
- Social elements 
- Shows profit and loss on each transaction
- Analyst consensus and price target 
- Easy and quick deposit & withdrawal process
- Native tokens
- Set Price Alerts
- Rewards / Airdrops 
- Built in budgeting and savings tools

PRIMARY INTERVIEWS

I interviewed 4 people all of whom were interested in savings and investing. 3 out of the 4 were actively investing, and 3 out of the 4 activity saving. All participants mainly used their phones to check their finances, but all of them also used the desktop websites. All of the participants wanted to create more money in order to have a better lifestyle that was less stressful, even though 2 out of the 4 participants did find investing itself very stressful at times, but the gains and highs outweighed this. 

All of the participants liked the current apps and site they were using but all agreed that they could be improved and were open to using a new platform, showing no loyalty to current ones. 

Goals 

The main goals were to make / create more money, in order to feel more secure, responsible and grown up. Being able to buy a house, save for a rainy day or ensure a desired lifestyle, were the main reasons why the participants saved and invested.   

- Be Responsible 
- Big purchases such as a house
- Security 
- Better Lifestyle 

Pain points 

The main issues were that most current competitors do not clearly show the customers profit and loss for each trade or saving made, this meant they would either have to guess, or work it out on a spreadsheet separate to the company, which was time consuming and confusing. 3 out of 4 participants would like to have a better understanding of tradings and savings to help ensure they are getting the best deal. 

- No Profit or Loss shown
- Lack of understanding
- Sacred of losing money 
- Slow updates 
- Lack of organisation 

Motivations 

Motivations to feel in control and knowable about their savings and investments, being able to make money and in turn create a secure future.  

- Feeling of being in Control 
- Security 
- Better Lifestyle 

PROVISIONAL PERSONA

I created a user persona based on the customer I had interviewed and, because I only interviewed 4 people, this would mean that the app I was creating could be very niche, not for the masses but for a smaller group of customers who would love the app and be loyal customers, something that other fintech companies lacked. 

INFORMATION ARCHITECTURE

SITE MAP

Working off the the competitions site maps and adding in our customers wants and motivations I created the site map below:

BRANDING AND UI DESIGN

NEUMORPHISM BRANDING

When I was thinking about how what the style and branding for Fin should be, I want to do something that would stand out and be reconsidered in such a crowded market, and because I wasn't creating a webapp for the masses, it is aimed at a select niche customer I felt as those I could be bold and try out some soft UI designs, an on trend design that i've wanted to try for a while.

Neumorphism combines developments of flat design and skeuomorphism. Neumorphism, or soft UI, is a visual style that combines background colors, shapes, gradients, highlights, and shadows to ensure graphic intense buttons and switches. All that allows achieving a soft, extruded plastic look, and almost 3D styling. While it is not to everyone's taste it is a style I have been wanting to try it out for a while and felt this would be a great challenge and opportunity. 

LOFI WIREFRAMES

Before implementing the soft UI I created some lofi wireframes,  shown below: 

MIDFI WIREFRAMES 

I added the neuromorphic design and tried out a few different colours that I liked. I loved the pink and orange but when I put them though the accessibility test the pink failed, I tried a few different versions of pink but dieced that it would be better to keep it simple and more in line with the classic neumorphic design but limiting the colours and so I decided to make everything orange.

ITERATION AND IMPLEMENTATION

HIFI WIREFRAMES

After changing the colours to fit with the accsessbity I created the full set of HiFi Wireframes belows.

Webapp

Key Features

- Dashboard
-  Trading Portfolio 
- Portfolio custom design features.
-  Asset page 
- Asset Trading and information page
- Candlestick / Graft page 
- Technical Analysis Page
- Open a new trade 

USABILITY TESTING

USABILITY TESTING:

Usability tests were conducted both in person and remotely via Zoom. I tested the mobile version on half of the group and the desktop version on the other half, where I had the participants share their screen with me. I gave them all the same questions and scenarios which asked them to perform tasks, mainly based on navigating around the webapp, while I observed them as they navigated through the prototype, my key findings are summaried below:

Pros:

Love the branding (Neuromorphic)
Love the Pushy Buttons 
Very easy to use
Great P/L
Easy to navigate 

Cons:

A bit boring 
Maybe add some more colour 
Maybe add some white

Suggestions:

It could be good to add a sound to the buttons when you press them

SUMMARY:

It’s great that everyone was able to navigate through the app, this is not what I expected, especially as not everyone was familiar with trading apps or had used them before, so I am very pleased with that. 

One person found the neomorphism style a bit boring and would have liked some more colour, while someone else suggested adding in white for a bit more contrast, I feel that both of these suggestions would take away from the neuromorphic style. However as someone who also loves colour I can understand why they have said this and also where the newer glass trend comes into play. 

I liked the suggestion on the press button sound, and it would be nice to have the option to turn that on, however it would not be a priority. I therefore did not make any other changes other than the one made to the colours previously. 

FINAL THOUGHTS

MY TAKEAWAY'S

Fintech is a sector I am interested in, I have used a lot of different saving and trading site and apps over the years, even if its just to see what their UX|UI is like. The fintech industry is booming right now, but a lot of customers still face a number of pain points with each app, and because of this there did not seem to be any customer loyalty, something that traditional banks used to rely on. I think with a few minor adjustments, mainly with transparency (showing P/L etc) and streamlining both the UX and UI it would give the customers much needed knowledge of their accounts and would help build back trust and in turn their loyalty. Of course there are a lot more features and different user testing that could be done, but after listening to current fintech users this seemed to be the main issue they had was the lack of information on their individual P/L, something that I have included into the fin webapp as well as trying out the Neumorphism to give it that cult brand feel, appealing to a select niche, that also in turn creates brand/fan loyalty.

CHEERS :)