State Bank of India Net Banking Redesign

Design Challenge : Take a website or app that i currently use and am dissatisfied with, and try to make it better.

I chose the online Banking interface of SBI ( State Bank of India ). I find myself using this frequently to check account balance and transfer funds to others. I always get confused with the interface and end up logging out as soon as the task in hand is completed. After talking to people , I realized that net banking interfaces of most banks in India belong to an era when people my age watched Cartoon Network.

Questions to consider :

1. What problems is the website supposed to solve ? How well are they solved ?
2. Is the website easy to use and understand ?

The interface is huge with a lot of sections. Here are snapshots of the site- map sections of the website just to prove my point.

Oh ! And it continues

So, I had to decide where to channelize my efforts ( this being a side project). I decided to do a short user survey asking people one simple question,

“ Which of these features do you look at/use while using Online Banking ?”

Here is a snapshot of the responses I gathered :

From the survey, it was clear what features people cared about. Picking the top 3 :

1. Transfer funds
2. Check account balance
3. Monitor previous transactions

I decided to focus my efforts on these.

Interface Critique

Redesign

To start with, I had to redesign the navigation. I did research on all the sections of the website, their functions and what they are used for. I found myself learning about banking while pursuing a website redesign. It was a good experience. On the basis of how things were organised in the site map and a bit of intuition, I redesigned the flow

In the site map, the 5 options ( Bill Payments … SBI Exclusif) were under the term “Service Offerings”. Here was an opportunity to make the Home screen cleaner. Also, I felt Logout button could be included with the other Important links.

Here are the snapshots of the redesign :

Account Summary Page.

And the second screen shows the trickiest navigation ( Service Offerings). Inspiration from flipkart.com

The key changes made to the interface are :

1. Organised navigation. Resulting in a much cleaner looking interface. Seldom used functions show themselves when the user looks for them.
2. Account balance is visible as one goes to account summary. Saves the user a click.
3. Transfer funds button on top. Since most people come here to do that, i felt its visibility should be the top most priority.
4. A search function, to go to a page directly. There was a “Jump to” function previously, which I felt was outdated.
5. Changing the font from “Arial” to “Roboto”. It’s got more x-height and thus is more readable, even on small screens.

I have tried to leave the colors and logo as they were to not mess with the branding.

Thank you for reading. Critique will be appreciated.

Disclaimer : This is, in no way a complete redesign of the website. To achieve a complete one would take considerable more manpower and time. The objective of this redesign is a hope that it reaches the people responsible for maintaining the interface, and they do something about it.