New design launched on the Swedish Internetbank

2018-02-12

On January 18, the internet bank for private consumers in Sweden got a facelift.

Step one of many

The site was updated with the new brand colours, and font. The header was simplified to match the new look and the old large header image was removed. In the same delivery we also launched a few pages translated to English (as well as the navigation in English).

The main goal of the release was to harmonise the old internet bank to match the new future modules that will be built with the new design system. When launching new features they will co-exist with old parts of the internetbank for a forseeable future.

The changes was only focused on doing stylesheet changes, rather than markup. This choice was made to minimize risk and test-time.

The customers reacted...

After launching the updated design reactions started pouring in from the customers through all channels possible: Facebook, telephone bank, internet support and personal contacts. Main concerns covered issues with font-size, readability, contrasts, print-size as well as general design-ideas in all directions.

...So we adjusted the design

Based on all input we decided to make three changes:
• Font-size in tables data-cells was increased to 16px (as it ought to be). To simplify our problems with space we initially launched with 14px which proved to be too small.
• Links was causing troubles with visibility and we increased the contrasts by changing link colour to the darkest shade of SEB-Blue.
• Tabs was changed to have the font-version medium weight. Originally they were Regular and this made the link-colour seem much lighter than other links, and the active tab didn’t function as header for the content underneath.

A few bugs regarding print issues was resolved, but we did not do any major changes. The wide use of white-space to make especially tables more touch-friendly makes the printout seem very in-efficient and it would probably be a very good idea to decrease line-height for the print-stylesheet.

What's next?

As a next step we will implement a warning message that will be visible for old browsers, instructing the user to upgrade to a new reader. Old browsers are always a big source of errors and security flaws. We will also start looking into a softer way of communicating with the customers through the internet bank, keeping them more in the loop of what’s happening in new releases and perhaps as way to collect feedback through this channel.

/Conny Andersson, UX-lead for IBP