The challenge

The site needed a major redesign, coupled with a tech upgrade and a major rebranding. Several technical and practical challenges became clear, from 3rd party developer constraints to lack of adequate resource allocation. The outdated design and functionality led to poor customer experience, low account openings, and slow website performance. The old website looked like this:

The process

We began by adding key team members, including a senior UX designer and content editor, and partnered with the visual design group on rebranding. We started with focusing on the overall IA and the all-important Account Overview page. Then we worked with the Fiserv technical team to understand all the constraints of the platform, what’s possible, and what would be considered customization vs configuration. This was necessary to control costs and timeline. Then a series of high-fidelity wireframe prototypes were created and tested with existing and prospective customers to arrive at a fully designed end-to-end site that was constantly iterated and tweaked. The prototypes assisted with refining the customer experience, understanding priority, communicating with engineering on requirements, as well as providing a blueprint for the rebranded site. Finally, all the content and customer messaging had to be updated with new communication added for improved servicing.

Here are some sample high-fidelity wireframes created:

Detailed and annotated wireframes were created for all use cases and pages. The outcome was a deceptively simple online banking experience that met the needs of both customers and the business.

Mobile Innovation Lab

After the successful launch of online banking, we were asked to develop a future-state “Direct Bank” mobile concept. The following are some early ideation concepts produced: