MBNA offers its customers some of the lowest balance transfer interest rates in the industry. Despite this, they were having a hard time convincing customers to fulfill their promotional offers. Many MBNA customers didn’t know (or care) what a balance transfer is or what the benefits are.
Focusing on their customer segment that never, or rarely accepts a balance transfer, they wanted to build an educational landing page with a simple savings calculator to show the customer on how much money they're wasting on interest every month – and how transferring their balance to MBNA can change that.
ART DIRECTION / DESIGN
I designed the site for MBNA, working closely with our copywriter. We wanted to make sure the page had the right voice and that the message and benefits came across clearly & simply. I created the wireframes, design concepts, and the work flow for the calculator.
The landing page had to fit within the existing mbna website parameters, but the client wanted a fun, refreshing feel. Balance transfers could be overlooked as boring, so we wanted to emphasize the immediate money saving benefits with bold colours, punchy graphics and fun css animations as the user scrolls through the page.
I incorporated simple interactivity wherever I could to keep the user engaged and learning. Try it out!
CSS animations would animate as the user scrolled or a button was clicked. The idea was to use movement to draw the user's attention to key messaging or instruction. (here’s some re-created as gifs)
It's all about the little things. The MBNA brand is very simple – bold colours, and straightforward images & graphics. It's important to create visual interest by finessing the details. (close-up of calculator elements)