Bankrate
Reinventing a financial advice website
Role
Senior Designer
Responsibilities
UX & UI Design
Design Systems
Visual Desirability Testing
Project Summary
Bankrate was in the midst of digital transformation, and came to DesignMap to implement responsive redesign for their website. Over the course of 11 months, we re-designed, tested, and delivered core features of the website including homepage, navigation, rate comparison pages, calculator tools, articles, and blogs.
Typical projects at DesignMap pair a creative director with one or two designers. To tackle this ambitious goal, our team consisted of 2 creative directors (one at Bankrate and one at DesignMap), and 6 designers (3 from Brankrate and 3 from DesignMap). As a Senior Designer, I helped lead the visual refresh, which included:
Competitive audits
Stakeholder interviews
Visual desirability testing
Presenting results & findings to the team
Leading design critiques and creative direction
Crafting a new visual design style guide
Style Guide
How we got there
Goal
For the visual refresh, our goal was to develop a single visual system that supports Bankrate's brand and allows for a unified experience across all platforms and device sizes.
Stakeholder Interviews
We interviewed Stakeholder across the organization about how Bankrate wanted to position themselves. Based on the themes we heard, we established design principles to guide the brand positioning and visual concepts.
Establishing brand principles and gathering feedback from actual site visitors made it easier to set aside subjectivity, and focus on designing what was right for the company.
Demographic Data
We leveraged demographic data about existing site visitors to inform the visual concepts. A challenge for the visual refresh was choosing a style that would appeal to disparate age groups, from age 25 to 64.
Color Differentiation
Bankrate wanted to keep blue as their primary color, so we choose a hue strategically — with the goal of differentiating from other blues that already dominated the digital landscape.
Desirability Testing
Using Microsoft's method of reaction card sorting, we surveyed real bankrate.com users for their reaction to a new visual design. With over 250 survey participants, we confirmed that the new visual directions were a clear improvement for representing the company and their values.
Homepage Redesign
Homepage Concepts
How we integrated feedback
For this part of the redesign, I was responsible for generating homepage concepts for qualitative testing. Most people wanted to jump into the content that was relevant to their current financial situation. Based on the feedback, we tailored the homepage focused on 2 key principles:
Showcase the breadth of expertise that Bankrate offers, so people can jump into topics that matter most to them.
Feature recommendations, to reinforce the promise of Bankrate as a trusted partner for life’s full financial journey.
Outcome
DesignMap delivered a responsive website redesign, guiding design principles, and digital style guide for the new look and feel of bankrate.com. 12 months after the engagement ended, Bankrate was acquired by Red Ventures: Read About It Here