Back to work

AI product design · Vibe coded

AI Banking Copilot

From AI concept to working prototype in 6 days.

Designing an AI-native banking experience and transforming it into a working prototype using AI-assisted development.

Instead of building another banking app, this project explores how AI understands context, recommends next-best actions and orchestrates complete workflows.

Copilot home screen: a natural-language prompt field, four workflow shortcuts, and a proactive insights list flagging a spending rise and two ways to save.

Home

Role

Product Designer

Duration

6 days

Type

AI concept + vibe-coded prototype

Stack

Figma · Claude Code · Cursor · React Native · Expo · GitHub

Repository

Public on GitHub

Why it matters

Banking has always made customers do the thinking.

The AI Copilot changes who does the thinking.

Traditional banking expects customers to search, compare, understand products and decide what to do next.

AI Banking Copilot shifts that cognitive work to the assistant — understanding intent, reasoning with customer context, and recommending the best next action.

Traditional banking

Customer does the thinking

  1. Goal
  2. Search
  3. Compare
  4. Fill forms
  5. Submit

AI Banking Copilot

Customer states a goal

  1. Goal
  2. AI understands
  3. AI reasons
  4. AI recommends
  5. Customer confirms

The customer defines the goal. The AI figures out how to achieve it.

AI workspace

Four workflows, one copilot

Each workflow starts from what the customer is actually trying to do, and ends in a completed action rather than an answer.

The explain-transaction flow: a question about a deduction answered with the charge's origin, its details, and the actions available next.

A charge the customer doesn't recognise is answered in a single turn — what it was, who took it, and what they can do about it.

  • Answers in plain language first: the merchant and the reason for the charge, before any transaction detail.
  • Backs the answer with the record — amount, merchant, date, reference — so the explanation is checkable, not just plausible.
  • Ends on the three actions that actually follow: view the bill, download the receipt, or report a problem.
  • Leaves the thread open, so the next question continues the conversation instead of restarting it.
View full flow

How I built it

From concept to prototype in 6 days

AI accelerated execution, allowing ideas to move from concept to a working prototype in days instead of weeks.

  1. 01

    Explore

    Benchmark AI experiences

  2. 02

    Design

    Create AI-first workflows

  3. 03

    Vibe code

    Transform into a working prototype

  4. 04

    Ship

    Interactive prototype + GitHub

Live prototype

Explore the AI Banking Copilot experience across mobile and web.

Try prototype

ai-banking-copilot

Public
  • Update project docs for session closure4 days ago
  • Fix missing horizontal padding in bottom sheets4 days ago
  • Pin the app to its designed light theme and fix viewport-sized backgrounds4 days ago
  • Add responsive web device frame and Vercel static hosting config4 days ago

Public GitHub

Inspect the implementation, project structure and development history.

View repository

Built with

  • Figma
  • Claude Code
  • Cursor
  • React Native
  • Expo
  • TypeScript
  • GitHub

More works

Portrait of Mohammed Rizwan

Start your new project in just a few clicks.

Book a free call