FinAlly

FinAlly

visual identity

design systems

ui design

prototyping

Industry

Industry

Finance & Banking

Finance & Banking

Company

Company

Atomic Robot

Atomic Robot

Product

Product

UI Kit + Prototype

UI Kit + Prototype

Challenge

Atomic Robot was looking to expand its work into the financial space and tasked the design team with creating a UI kit that would provide users with a way to track expenses, manage accounts, and encourage saving.

Atomic Robot was looking to expand its work into the financial space and tasked the design team with creating a UI kit that would provide users with a way to track expenses, manage accounts, and encourage saving.

Solution/Approach

This joint project included phases of research and collaborative design thinking to address each feature requested. The key features include a responsive design system, user management, a finance dashboard, saving and spending goal settings, account actions, bill payments, and more. Our goal was to research the current competitors and use that knowledge, as well as direct user feedback, to create an app that brings freshness to the often overcomplicated and sophisticated financial management platforms that make the topic feel inaccessible to so many.

This joint project included phases of research and collaborative design thinking to address each feature requested. The key features include a responsive design system, user management, a finance dashboard, saving and spending goal settings, account actions, bill payments, and more. Our goal was to research the current competitors and use that knowledge, as well as direct user feedback, to create an app that brings freshness to the often overcomplicated and sophisticated financial management platforms that make the topic feel inaccessible to so many.

Problem

Atomic Robot is looking to showcase its ability to branch into new markets successfully and compete with the top providers in this sector. Through primary and secondary research, it was found that users often feel frustrated when trying to manage their finances online, feeling as though something is always missing from one bank app to the next. A key pain point was the tools available to encourage saving/budgeting in apps and inconsistencies across categorizing expenses.

Goals

  • Provide users with a clean UI that clearly displays the most pertinent information.

  • Provide users with a comprehensive platform where they can manage all active accounts.

  • Make budgeting attractive with visual designs that focus on positive growth and goal setting.

  • Build a detailed design system that allows for further customization and feature expansion.

Competitive Research

The first step was to take a deep dive into the competitive analysis of popular apps in the target space. Our team analyzed 15 different apps, focusing on key takeaways that connected to our main objectives, such as dashboard layouts, budget tracking, and user flows of money transfers, deposits, and more.

The first step was to take a deep dive into the competitive analysis of popular apps in the target space. Our team analyzed 15 different apps, focusing on key takeaways that connected to our main objectives, such as dashboard layouts, budget tracking, and user flows of money transfers, deposits, and more.

What are the main frustrations with finance & banking apps from current users?

What are the main frustrations with finance & banking apps from current users?

gathered from a 10-person, in-depth survey

gathered from a 10-person, in-depth survey

Inconsistent Features & User Experience

Users often face issues with app functionalities not aligning with their needs, such as Discover's irregular monthly credit limit cycles and the frustrating UX of Zelle when receiving payments.

Poor User Interface & Navigation

A common complaint is the cluttered and complex user interface across various apps, including poor animations, clunky navigation, and insufficient data visualization tools.

Issues with Financial Management Tools

Users frequently encounter issues with budgeting features, such as overly aggressive budgeting algorithms that don't accommodate slight overspending, or inaccuracies in budget tracking.

Technical Challenges & Security Concerns

Technical difficulties like multiple attempts needed for mobile check deposits or the absence of auto-deposit features from Venmo frustrate users. Concerns about security, particularly with SMS 2-factor authentication, are highlighted.

Desire for Enhanced Features

Users express a strong desire for additional features such as investment capabilities within the apps, better data visualization tools, quicker access to account balances, and more intuitive search functionalities for transactions.

Inconsistent Features & User Experience

Users often face issues with app functionalities not aligning with their needs, such as Discover's irregular monthly credit limit cycles and the frustrating UX of Zelle when receiving payments.

Poor User Interface & Navigation

A common complaint is the cluttered and complex user interface across various apps, including poor animations, clunky navigation, and insufficient data visualization tools.

Issues with Financial Management Tools

Users frequently encounter issues with budgeting features, such as overly aggressive budgeting algorithms that don't accommodate slight overspending, or inaccuracies in budget tracking.

Technical Challenges & Security Concerns

Technical difficulties like multiple attempts needed for mobile check deposits or the absence of auto-deposit features from Venmo frustrate users. Concerns about security, particularly with SMS 2-factor authentication, are highlighted.

Desire for Enhanced Features

Users express a strong desire for additional features such as investment capabilities within the apps, better data visualization tools, quicker access to account balances, and more intuitive search functionalities for transactions.

OPPORTUNITY:

Due to this lack of desirable UI design, adequate feature integrations, and efficient usability in the current platforms, users often neglect using these financial tools completely or resort to Excel sheets.

Due to this lack of desirable UI design, adequate feature integrations, and efficient usability in the current platforms, users often neglect using these financial tools completely or resort to Excel sheets.

The Solution:

FinAlly will become a user's new friend in Finance. The app will encourage financial growth over strict budgeting by providing users with seamlessly integrated tools and user flows that are enhanced by a clean, sophisticated design. The UI design will still retain the sense of security needed when dealing with finances while bringing a fresh feel compared to its outdated competitors.

FinAlly will become a user's new friend in Finance. The app will encourage financial growth over strict budgeting by providing users with seamlessly integrated tools and user flows that are enhanced by a clean, sophisticated design. The UI design will still retain the sense of security needed when dealing with finances while bringing a fresh feel compared to its outdated competitors.

Building FinAlly

Andre Hernandez

Andre Hernandez

Business CEO

Business CEO

Motivations

Motivations

Price

Price

Comfort

Comfort

Convenience

Convenience

Speed

Speed

Loyalty

Loyalty

Andre is a husband and father of two young children and travels for work often. With his financial success, he has been able to purchase several properties across the country that he uses when he travels and rents through Airbnb otherwise. While he has many accounts his credit score is astounding due to his organized personality. His current goals are to grow his property investments and set up accounts for his kids to have a stable future.

Andre is a husband and father of two young children and travels for work often. With his financial success, he has been able to purchase several properties across the country that he uses when he travels and rents through Airbnb otherwise. While he has many accounts his credit score is astounding due to his organized personality. His current goals are to grow his property investments and set up accounts for his kids to have a stable future.

Bailey Emerson

Bailey Emerson

College Student

College Student

Motivations

Motivations

Price

Price

Comfort

Comfort

Convenience

Convenience

Speed

Speed

Loyalty

Loyalty

Bailey is studying to be a freelance photographer as part of her Fine Arts degree. She would like to own he own business someday and is already establishing clientele. She often has a difficult time tracking her spending habits and just defaults to the cheapest option. She wants to save up for a new lens and leave school with as little student dept as possible.

Bailey is studying to be a freelance photographer as part of her Fine Arts degree. She would like to own he own business someday and is already establishing clientele. She often has a difficult time tracking her spending habits and just defaults to the cheapest option. She wants to save up for a new lens and leave school with as little student dept as possible.

spending analysis

filter

spending graph

categories

profile

edit profile

information

settings

management

terms + agreements

notifications

biometrics

quick actions

history

logout

support

help assistant

FAQ’s

contact info

deposit check

current limit

make a deposit

recipients

search

recents

transactions

pay

request

split

transfer funds

make a transfer

recipients

pay

request

split

pay bills

pay

payees

add payee

activity

payments

dashboard

quick actions

bank accounts

credit accounts

active goals

recipients

Account Support

Money Transfers

Money Management

my goals

savings goals

goals

add goal

spending goals

current spent $

active goals

add budget

Navigation

trusted

trusted

fresh

fresh

minimal

minimal

encouraging

encouraging

growth

growth

sophisticated

sophisticated

Logos

Colors

Grey

Green

Navigation

Welcome back

Welcome back

Dashboard

Goals

Spend Analysis

Transfer

Pay Bills

Deposit Check

Recipients

Profile

Support

Settings

Patterns

Progress Indicators

$982.38

$982.38

Budget

$20

Sep ‘22

$20

Aug ‘22

$230,000

SAVED

10%

AHEAD

$230,000

LEFT

10%

BEHIND

54

%

54

%

Complete

54

%

Complete

Buttons + Controls

Primary

Secondary

Tertiary

Disabled

CHECK FRONT

CHECK FRONT

Tap to Retake

CHECK FRONT

Typography

Anybody

NUMBERIC

X Large

Large

Medium

Small

Tiny

SIZE

48

40

32

16

11

WEIGHT

Bold

Bold

Bold

Bold

Bold

HEADER

Heading 1

Heading 4

size

24

18

weight

Regular

Regular

Kumbh Sans

HEADER

Header 2

Header 3

Header 5

Header 6

Title

Subtitle

SIZE

22

20

16

14

12

12

WEIGHT

SemiBold

Regular

SemiBold

Bold

Bold

Medium

BODY

Body 1

Body 2

Body 3

Body 4

Body 5

size

16

14

12

10

10

weight

Regular

Regular

Regular

Regular

Bold

Logos

Colors

Grey

Green

Navigation

Welcome back

Welcome back

Dashboard

Goals

Spend Analysis

Transfer

Pay Bills

Deposit Check

Recipients

Profile

Support

Settings

Patterns

Progress Indicators

$982.38

$982.38

Budget

$20

Sep ‘22

$20

Aug ‘22

$230,000

SAVED

10%

AHEAD

$230,000

LEFT

10%

BEHIND

54

%

54

%

Complete

54

%

Complete

Buttons + Controls

Primary

Secondary

Tertiary

Disabled

CHECK FRONT

CHECK FRONT

Tap to Retake

CHECK FRONT

Typography

Anybody

NUMBERIC

X Large

Large

Medium

Small

Tiny

SIZE

48

40

32

16

11

WEIGHT

Bold

Bold

Bold

Bold

Bold

HEADER

Heading 1

Heading 4

size

24

18

weight

Regular

Regular

Kumbh Sans

HEADER

Header 2

Header 3

Header 5

Header 6

Title

Subtitle

SIZE

22

20

16

14

12

12

WEIGHT

SemiBold

Regular

SemiBold

Bold

Bold

Medium

BODY

Body 1

Body 2

Body 3

Body 4

Body 5

size

16

14

12

10

10

weight

Regular

Regular

Regular

Regular

Bold

Figma Prototype

Figma Prototype

View the full UI Kit and click-through prototype in Figma

View the full UI Kit and click-through prototype in Figma