PROJECT BACKGROUND
When I joined this project, the first version of the app was in private beta and users could ask questions as if they were talking to a real person about their financial data. The Xobi team wanted to rebrand the app and design a "Life" tab in order to provide users with a different way of looking at how they spend money. The idea is to focus on the experiences, instead of mere expenditures and balances. I was the lead designer working with a PM and a team of developers to create a new look, additional features and think through some UX improvements. You can download the app here.
SKILLS
UI / UX
Wireframing
Branding
Prototyping
Motion Graphics
Project Challenges
- XOBI CARD APPLICATION: Xobi offers an exclusive credit card to users with great financial history. It was my job to make the application flow seamless for the user while abiding by credit card industry standards.
- USER INTERFACE / REBRAND: The first version of the app lacked continuity, brand messaging and several UI/UX best practices.
- ALLOW THE USER TO CREATE VISUAL NARRATIVES WITH THEIR FINANCES: Design a "Life" feed that translates financial transactions into rich media stories documenting users’ real world experiences. Users can easily search, create, package, and share meaningful memories based on transactions.
Apply for XOBI Card
We pulled from the user financial data to understand how much money they could save using a XOBI card and displayed that on a full screen modal with a CTA. For the card application flow, we limited the number of steps by pre-populating with information we already know from their credit cards on file.
User Interface Redesign
BEFORE
MOODBOARDS
I gathered different pieces of inspiration that I thought captured the desired look and feel. The goal was to feel wealthy, chic and sophisticated. We had to differentiate ourselves from the minted and money book apps that are more budgeting oriented.
BRANDING DECISIONS
I re-skinned the entire app, unifying it under a singular new design language including 60+ custom illustrated icons, a grid system & card styles (see life tab) , colors and typography.
Illustrations done by Mallory Sluetz
Life Tab
Users can easily create life "Events" populated with imagery based on their financial data. They can then package and share their meaningful memories with friends.
I went with a light and gold theme anchoring on the user generated images and gold accents to give the app character and visual appeal.
I created a card and grid system to accommodate all types of vendors, transactions and user added data.