A Modern Banking Experience

What if banking was fun and playful?

Well, this work is an extension of client project which I did almost a year ago. The project was to design a mobile banking app focused on iPad. The team developed several ideas. Client killed this particular idea early on, but I liked it. So I took my initial sketches and developed the idea further. Now I’m sharing it with hope that something good happens out of it.

The Challenge — Design a mobile personal banking app that takes advantage of touch medium to deliver an innovative experience to make banking simple.

Fact Finding — After collecting and analyzing data from several sources including one from the federal reserve, I observed that on average mobile banking customers between 18-45 come use the app at least twice every week. And 8 out of 10 times they just have a need to check their balance and last few transactions. And naturally, the top three mobile banking activities include:

  1. checking balance or recent transactions,
  2. receiving and checking alerts from bank,
  3. transferring money to another account or pay bills.

This means that 8 out of 10 times the mobile banking is a quick in and quick out kind of experience. Analytically, I believe users would be spending more time interacting with login screen than within their account. While these short lived interactions are great for users, the experience is often dull, cryptic and devoid of any financial insights. Most mobile apps carry forward the legacy of desktop’s list-based interfaces. This begs a question, is there a space in banking for experiences designed that take advantage of the medium to deliver a fun, engaging, and simpler experience?

Insight — The primary reason why a user goes to banking app is to validate if things are the way they expect them to be — which means checking balance and recent transactions. So we focus on making this activity the core of the new experience.

Inspiration — The effective and intuitive use of gesture by apps like Solar, Rise, City Guide by National Geographic, Hotel Tonight inspired the team to explore new ways of interactions elements to add fun to the experience.

The Design

My motivation is to minimize the interface while maximizing the function and playfulness. The timeline on the home screen is core to this new experience and is inspired by the Music Animation Machine by Stephen Malinowski, which enables viewers to see the music playing. It visualizes recently played, currently playing, and upcoming notes on a horizontal timeline in a very playful way.

Home Screen

First thing we do is to completely re-imagine the home screen in order to achieve two important goals —

  1. Establish a clear hierarchy for information consumption through layout
  2. Make content the interface, and use interactivity to add clarity
Home screen showing the account balance and activity timeline.

The home screen is designed to be the dashboard of all activity user should care about. As a user logs in, they see their latest balance as the first thing. Just below the account balance, they also see a timeline of activity.

The timeline is central to this experience. While the details of latest transaction are shown by default, users can view past few transaction by sliding left on the timeline. While the latest transaction is always anchored at the center, the right half of timeline is dedicated to upcoming events or important notifications that may be relevant to the user.

As user slides left, they can see details for each transaction.

As a user slides left of the timeline, they can view more details of the transaction. Same way sliding right will reveal alerts, notifications and upcoming bill details.

While the interaction is playful it limits users attention to one thing at a time. I believe that behaviorally this limitation will benefit user as they can focus on important things easily. And for those who wants to see all transactions instantly, they can go to all activity like any traditional interface.

Account Activity Screen

While we transformed the home screen to do more than it traditionally does, we thought the the usually cryptic activity log can also work harder to deliver more value for customers. The main experience goals for this screen were —

  1. Provide users a clear picture of their overall account usage
  2. Increase efficiency by enabling relevant actions
Account Activity screen shows a chronological list of transactions along with insights in the sidebar.

By default, the activity screen shows a chronological list of past transaction along with insights summary of last 30 days on the right. While the insights will help users learn about their spending patterns, it will also increase the frequency of return and time spent on each visit.

Users have a choice to play with the insights, or with the transactions. As a user taps on any transaction, all the transaction details replace the insights panel and provide contextual actions like report fraud and share.

The choice of these two actions comes from observations what a user might want to do next at this point. A user might be interested in details to send to a friend, say for splitting or to an employer, for reimbursement. Or, they might have noticed something wrong with the transaction and want to report it to the authority, the bank.

Transaction Details panel with relevant actions


I am interested to know your thoughts. I will soon add more screens to highlight other detailed but critical design insights along with a timeline animation to explain ideas better. In the mean time, please feel free to share your critique and ideas at @muditmittal.