A hand reaching across a black table, several items are visible, coffee, airpods, watch and a bank card
A hand reaching across a black table, several items are visible, coffee, airpods, watch and a bank card
A hand reaching across a black table, several items are visible, coffee, airpods, watch and a bank card

A FinTech Rewards Based Banking App

A FinTech Rewards Based Banking App

A self initiated project to design the homepage of a FinTech mobile banking application. The apps unique selling point (USP) offers rewards to the user. Install a clean, sleek house style that connotes innovation and has a modern appeal.

Team structure

Solo

Research method

User persona, moodboard

Discipline

UI design, visual design

Platform

Mobile

Duration

8 hours

Final Proposal

Final Proposal

Mobile mockup on a dark sand texture background, screen shows the Spending and More Products section to Fintech App
Mobile mockup on a dark sand texture background, screen shows the Spending and More Products section to Fintech App
Mobile mockup on a dark sand texture background, screen shows the Spending and More Products section to Fintech App
Mobile on a bubbly black background, screen shows Fintech app landing section, showing current card funds, points earned and transactions
Mobile on a bubbly black background, screen shows Fintech app landing section, showing current card funds, points earned and transactions
Mobile on a bubbly black background, screen shows Fintech app landing section, showing current card funds, points earned and transactions

Research

Research

User persona top line data

User persona top line data

Asher on a laptop outside profile picture

Asher

Asher

Asher

Married with two kids and a dog, Asher thrives in the fast-paced world of financial markets while ensuring his family's financial security. Outside of work, he enjoys quality time with his children and caring for his dog, balancing career and home life.

Married with two kids and a dog, Asher thrives in the fast-paced world of financial markets while ensuring his family's financial security. Outside of work, he enjoys quality time with his children and caring for his dog, balancing career and home life.

Married with two kids and a dog, Asher thrives in the fast-paced world of financial markets while ensuring his family's financial security. Outside of work, he enjoys quality time with his children and caring for his dog, balancing career and home life.

More info

More info

Job

Forex trader

Age

31

Gender

Male

Status

Married

Income

£65k + dividends

Location

Brighton

Moodboard

Moodboard

Moodboard of vibrant banking apps banking apps, mostly dark theme
Moodboard of vibrant banking apps banking apps, mostly dark theme
Moodboard of vibrant banking apps banking apps, mostly dark theme

Moodboard key takeaways

Accessibility

  • Pro dark-mode

  • Modern/cutting-edge atmosphere

  • Sophisticated

  • Trustworthy

Learning required

  • Vibrant colour use and tints

  • Card/funds section at forefront of page heirarchy

  • Use of boxes to break up sections

  • Use of gradients

  • Rounded corners

Design

Wireframes

First iterations were very basic, drawing up sections and their appropriate order. Ensuring the basic user tasks and business objectives (BO) were accounted for.

Mobile wireframes 1 and 2, with numbered sections corresponding to the accompanied text
Mobile wireframes 1 and 2, with numbered sections corresponding to the accompanied text
Mobile wireframes 1 and 2, with numbered sections corresponding to the accompanied text

1

Current account(s)

Maintain the primary user actions here, which is universal in most banking apps

2

View rewards

Prominent rewards section (business objective [BO] #2)

3

Spending overview

Encourage user to spend smarter with consolidated insights (BO #1)

4

Business development

Push more products (BO #1)

5

Help section

Ensure user feels valued, fostering brand trust (BO #1)

Further iterations were built with UI elements to enable the consideration of sizing, spacing and interactivity of components.

3 mobile phones showing the final low fidelity wireframe
3 mobile phones showing the final low fidelity wireframe
3 mobile phones showing the final low fidelity wireframe

Branding

Branding

Fonts

Fonts

Text used in the app on dark backgrounds, inter regular and semi bold
Text used in the app on dark backgrounds, inter regular and semi bold
Text used in the app on dark backgrounds, inter regular and semi bold

Primary Colours

Primary Colours

Off-black

#121212

Off-white

#ECECEC

Cool blue

#4568DC

Pastel magenta

#B06AB3

Gradients

Gradients

Black - Grey

#292929 (60%) - #484848 (60%)

Magenta - Blue

#B06AB3 (100%) - #4568DC (100%)

#B06AB3 - #4568DC

Fintech app mobile on a dark carbon style background
Fintech app mobile on a dark carbon style background
Fintech app mobile on a dark carbon style background
Fintech app mobile showing Spending and Products section, on a metal textured platform
Fintech app mobile showing Spending and Products section, on a metal textured platform
Fintech app mobile showing Spending and Products section, on a metal textured platform

Ready to bring your vision to life?

Let’s collaborate to create intuitive solutions that deliver an exceptional user experience

Ready to bring your vision to life?

Let’s collaborate to create intuitive solutions that deliver an exceptional user experience

Ready to bring your vision to life?

Let’s collaborate to create intuitive solutions that deliver an exceptional user experience

Create a free website with Framer, the website builder loved by startups, designers and agencies.