The New

Today, we're really proud to announce the next step in our digital journey at FNB - the launch of the brand spanking new website.

The website relaunch has been a project of mammoth proportions, with amazing collaboration between teams from all over the bank. As I blog this, the guys from the Online team are still baby-sitting the launch - big kudos on the effort.

The old site

The new site

From the very beginning, we started out with a couple of lofty strategic ideals centered around the customer experience.

It had to be:

* An Experience (a bank website just isn't the must-visit destination other sites can claim to be - our visitors are purpose driven and we have to work hard to provide an environment that promotes exploration and feels like an experience).

* Friendly (it's something I've been talking about for ages, the big lesson that Web 2.0 has taught us is to talk WITH people, not talk AT them - something I think we've really achieved)

* Intuitive (banking products can be complicated - we had to find a way to logically group them according to a flow that customers would relate to - the I Want to BANK approach is that)

* A bit 2.0ey (you can't be obsessed with the open-everything Web 2.0 approach, remember we're a financial institution and trust is paramount - but there are some 2.0 lessons that you can see coming through: the personalisation mentioned below, the rounded edges, soft design, AJAX elements on the Wizards and navigation structure)

* Personal (there's much more to come in this space, but you can see elements of personalisation in the My Menu option - it's amazing what just pulling your name into search results does for the experience as a whole)

More visual more often

When I was doing research in the beginning stages of the product, it blew me away how few bank websites (even international examples) bothered to show a picture of the product. A platinum credit card is a sexy product, it's a status symbol and something you use almost daily. Yet no pictures?

A strong focus in the project was to find a way of visualising products and their associated features and benefits. This follows a big international trend towards a more retail style of financial services sites. Amazon has set a benchmark, and there's no shame in trying to match it.

If you look at a product page (Platinum Credit Card is my personal favourite) you can see how the simple use of images to illustrate benefits really turns this into a sexy experience...

It's all about conversions.

And, at the end of the day, what is a website around for? It's your digital front door, your virtual sales consultant... If people can't get your products or get in touch with you, you're failing from the start. The lead form on page (Click CALL ME BACK on any of the content pages) and the new Product Shop are moves in the right direction.

Make it easy for customers. Full stop.

The new site was a massive team effort - thank you and congratulations to everyone involved. We hope you, the public, see where this dream is going and enjoy the new experience. This is just the first step... Finance on the web. Now with added friendliness.


  1. would be nice if it was an improvement, but updating a design and using an international bank as a roadmap has not helped at all. IA sucks and its still talks bank with no solution. All that has changed is that the first 3 steps of interaction seem cooler but when you get down to the real info its all just an online brochure with no web conversion. How can we help you? clearly you cant....

  2. Don't you love it how people are too chicken shit to attach a name to hard comment?


    Sorry you feel that way. This is definitely a first version - and we're constantly working on turning the base content (what you get too once you've delved through the wizards) into simple, conversational style.

    We'll keep trying as long as the public keep readin'!

  3. I like the new site...apart from the initial bugs I had when logging in.

    It looks better, and definitely makes you want to spend more time on the site - I don't think I ever used anything other than the login on the old site? Using your name is a nice touch too.

    I'm sure its next on the cards, but the online banking part of the site is in stark contrast to the changes made to the rest.

    Well done...

  4. I agree with Ross - the online banking section is where the already-customers are served, and it would be great to see some attention given to a redesign & funtionality upgrade for us faithful FNB customers since we were 'Bob Juniors' back in the 80's :)

  5. I was surprised when I saw the FNB website upgrade. I immediately got the sense that the site was a more friendly, user based experience from the start.

    I was a little disappointed though, that when I logged into online banking, and saw that's where the improvements had stopped.

    You are right, banking products are complicated, which is why I mostly go into the banks (the weakest link..)

    In general, I am surprised how behind banks are with usability on their websites, I mean surely they have the MOST money to spend on making their sites user friendly? Or does all their budget go to making it secure?

    I use absa, fnb, barclaycard and natwest online banking, and as I couldn't give you clear winner when actually logged in and using it.

    Nice article, thanks for taking the time to run through the process.

  6. Thanks for the feedback Nick... I think the dream really is to simplify everything. Going into a branch gives you that face to face human experience. Why shouldn't a digital medium achieve the same?

    Watch this space :)

  7. @Ross @Michelle Agreed! But... forward progress is good progress :)

  8. Hi Andy,
    Congratulations on the new design. It’s a good step forward towards a needs based navigation.

    I guess I have more questions than comments.

    My only critique is that the icons are not as visually attractive as they could be. Did you guys do any icons with colour and what were the results from the user testing?

    Another fun aspect that comes to mind is when a user would mouse over the icon sections – any thoughts to change the colour or animate the icons?

    This would be visually attractive and create a more memorable experience.

    Looking at the 2nd and 3rd level pages, I notice that the FNB logo, internet banking login and the navigation takes occupies quite a bit of space. What are your thoughts around that?

    One last high-level comment – I love the “what people are currently searching for” – it create awareness of the search engine and some areas that people are searching for. It creates a sense that the engine will provide some valuable feedback unlike other search engine whereby you enter your search criteria with irrelevant results.

    Regarding the IA in the 2nd level, were there any thoughts to make it more graphical similar to the first level?


  9. Serious problems with the login to online banking, it takes forever to just open the webpage and then once I've logged in, I cant see nothing else happening. This has been the same situation for the last 3 days now. I have bills to pay online, and since I'm based in the UK, it's kinda difficult to hold on for a FNB call centre for an hour!! Could the smart people behind this "making it simple" website please tell me how to go about solving the problem of not being able to see my accounts after logging in???

  10. Hi Natasha... If you're on Twitter - can help! If not - suggest you mail They'll need one or two personal details to diagnose the prob - hence I can't really help you in the comments :)

  11. updating a design and using an international bank as a roadmap has not helped at all. IA sucks and its still talks bank with no solution. All that has changed is that the first 3 steps of interaction seem cooler but when you get down to the real info its all just an online brochure with no web conversion.
    Artikel Kesehatan | Download PDF JawaPos | Practical Lessons in Yoga | Review | BitDefender | Cheap Softwares | CNN | Natural and Technology

  12. Hi Andy,

    Well done in the FNB ground breaking changes. I see you guys are using jQuery...well done in that. I love the lib myself its beautifull. Let me know if I can lend a hand!

    Anyways, thanks for the update and hard effort.

    Keep it rolling!


  13. Hi Andy

    Who are the online teams that worked on the re-design of

  14. @Smallz All the technical wizard was done internally by the guys and gals at FNB Online. Then the briefing and business input came from all over the bank - it was a big project!


Post a Comment

Popular Posts