Banc Airgead

Banc Airgead

Design of a responsive banking app

The landscape of online banking is fiercely competitive, with numerous players vying for attention and market share. Amidst this saturated field, Banc Airgead emerges as a fresh contender, aiming to carve its niche in the area of financial services. Recognising the importance of differentiation and connectivity with the younger demographic, Banc Airgead sought to develop a user interface brimming with personality, tailored to resonate deeply with its target audience.

  • Client: UX Design Institute (Course Project)
  • Role: UI Design
  • Tools: Figma


In a crowded market, Banc Airgead is introducing its banking application, necessitating the development of a responsive design for its launch. Emphasising a vibrant and engaging experience, the application aims to appeal to a younger demographic, requiring it to be distinct and effortlessly intuitive from the outset.

01 / The Challenge

Responsive Banking Application

The application should prioritise responsiveness and ease of use across various platforms and devices. Information must be readily digestible and easily locatable for users. Effective navigation is of the utmost importance to ensure a seamless user experience.

Brand Principles

To truly connect with the user, three brand principles have been identified. These are;

  • Playful – the product should be fun to use
  • Clear - information must be presented in a simple, concise manner
  • Trustworthy - an overarching theme of trust needs to be conveyed throughout

02 / The Process


At the outset, preliminary wireframes were presented for the application. My responsibility entailed expanding upon these wireframes and identifying the best approach to utilise design elements to effectively communicate the information.

Banc Airgead Wireframes

Some of the wireframes provided for the banking application


Research was conducted on market competitors, encompassing materials around interactivity, typography, brand tone, and innovative or unconventional approaches, spanning not only the financial sector but also other relevant industries. This culminated in a virtual moodboard to act as a reference point throughout the project. This included headings such as typography, shape, interactivy and colour.

Style Guide

A comprehensive style guide was created. This included a colour palette, typography, iconography, and a series of UI elements for use across the banking application. The guide centered around the three brand principles of playful, clear and trustworthy. A fun, vibrant colour palette was selected. Libre Baskerville was the headline font of choice, as it adds a level of gravitas to the design, while retaining a friendly feel. Work Sans was used as the body font, it is legible at smaller sizes and has an open, warm style. An icon set was chosen for its adaptability and sense of playfulness.

Style Guide

The style guide covers colour, typography, icongraphy and UI elements.

03 / The Outcome

Curved edges are a consistent feature across the entire application, spanning cards, icons, and various other elements, subtly hinting at a gentle and inviting approach. Adding to the atmosphere of playfulness and approachability, a light polka dot pattern is used for the app's background. To prevent overwhelming the user, information is segmented into manageable chunks using cards, ensuring a smooth and digestible user experience. A personalised touch is woven throughout the interface, incorporating the user's name and preferences to foster a sense of connection and individuality.

Banc Airgead Welcome

The Bank Airgead welcome page for desktop and tablet

Banc Airgead Current Account

The Current Account screen offers an overview of key spending items and translates to mobile via use of a card system

Banc Airgead My Spending

The My Spending section is a visually led area with the option to add spending goals and review spending using various filter options

Have a project in mind? Get in touch at