Site redesign addressing confusing product navigation & reflect the personal commitment of this regional bank.
UX • UI • Content Strategy • Art Direction
Webster BankUsing Site Analytics, Stakeholder Interviews, and Branding to improve experience
Timeframe: 4 months to template completion
Assignment: Help this leading regional bank from the Northeast to improve their web presence and drive conversion. Their goal was to have their site reflect the core principals of their business, putting people first, acting with responsibility, respect, ethical behavior, citizenship and teamwork.
Project Description: Merkle addressed SEO, UX and Web Design concerns, focusing on product pages to test the effectiveness of new information architecture and page redesigns. Our team created flexible wireframe templates for their product line and product detail pages to be used across 60 pages across their site, provided content strategy and finalized .psd mock-ups including a UI kit for Webster's development team to utilize.
Assessing the current experience
Our team first completed a heuristic evaluation and reviewed the current site analytics, also looking for opportunities to incorporate response marketing best practices (which parallel heuristics). This identified and informed our content strategy and was used to steer stakeholder interviews. We broke up the deliverable products focusing first on Home Equity Lending pages.
Wireframe Development
Based on these parameters, our UX designer developed the first iteration of the module-based wireframes. As part of the larger creative team, we worked together to refine and incorporate the new brand voice, SEO considerations, and content considerations to drive conversion.
The brand agency along with the client, identified the more personal approach and community focus of Webster Bank was and is a major selling point for the bank. We also identified a strong loan completion rate with phone leads versus online applications. We translated this into a strong persistent contact module driving users to contact a Webster Bank representative with future goal of addressing their online application process with their third-party provider.
For the product pages we introduced a stacked approach highlighting the defining features of each product for easy product comparison while including clearer navigation indicators to the product detail pages. We also carried the defining features into the hero section of the product detail pages as another point of visual confirmation for users.
UI Kit
Leveraging the new branding and keeping accessibility in mind, I developed a UI kit that included CSS snippets. This was handed off to the client's developer to start development for the Drupal templates.
Content Development & Design
Our first design round presented design look and feel with heads and subs describing content suggestions based on our SEO research and best practices for response marketing. Initial reviews were an opportunity to confirm direction and brainstorm with clients. Below are approved final creative.
Results
