Let’s face it—typical financial websites are inherently about as stale and lifeless as their physical branch counterparts. Insipid, lackluster traits seep from the branch and imprint themselves across the website, engaging users about as much as would a multicolored ledger. Washington State Employees Credit Union (WSECU) is not your typical credit union. Fresh off a rebrand, WSECU came to Gravitate recognizing the digital apathy across its industry and sought to evolve and reimagine all current and potential digital properties to match its recent brand and core philosophy overhaul.

cs_wsecu_fg-1024x650

Defining Goals

In the wake of a rebrand and opening memberships beyond state employees, WSECU has gone trendy. In fact, visit one of their new, chic branches and you’ll feel like you’ve strolled into an upscale café or an Apple store—not a place where you’d secure a car loan. To that end, WSECU required a complete digital overhaul that, in their words, “reflects our core philosophies and commitment to our members through an immersive website that feels like you’re walking into one of our physical branches.”

Naturally, typical conversions goals (new members, new loans, etc.) weren’t going to be enough for the marketers at WSECU; they required a truly immersive experience to convert current and potential members emotionally, well before they even encounter a call to action.

Challenges

How do you create a catered, compelling user experience that spans an unfathomable range of personas and devices? From the Seattleite dressed like Macklemore on his iPad to a potato farmer from Pullman on her PC—all users should feel as though the site is built specifically for them and their needs. To make matters a little more difficult, many current and potential members frequently jump devices (e.g., mobile phone to desktop, desktop to tablet, etc.) throughout their time with the website. Sounds impossible, doesn’t it?

Solutions

We spent a great deal of time refining and thinking about WSECU’s target personas. Our lead designers and strategists would spend days together—locked away with whiteboards and hundreds of post-it notes—predicting and mapping detailed user paths to determine each persona’s emotional state, motivations, and the likely multiple scenarios they interact with on the website. In fact, the process more closely resembles a form of method acting than user flow exercises. The resulting information architecture and user journeys emphasized dynamically populating content based on the specific device accessing the website and the user’s behavior.

Wireframes and Usability Testing

With the extensive preparation behind us, it was time to start constructing a fully immersive digital branch. Considering the complexity of each user’s journey, we went far beyond prototyping only high-level pages and built out wireframes for every milestone page within each persona’s user flow—for mobile and desktop. But we didn’t stop there. With the help of a third-party agency, we set up detailed usability testing scenarios and observed while the focus group navigated and completed typical banking website actions. As a result, our wireframe modifications were driven solely by informed, calculated decisions based not only on numbers, but on the real-time interactions of real people.

cs_wsecu_mobile

Mobile First

A shift is currently occurring in mobile banking, and the opportunities for credit unions to step up and address customer desires and hesitancies  abound. In the early 2000s, when online banking was introduced, most didn’t trust their computer to manage money online. Today, 92 percent* of the same uncertain Baby Boomers say they prefer bank via their desktop computer. This trend is now extending to mobile—with the numbers showing that members are now using their phones and tablets more often to check balances and transfer funds. With this in mind, we began building site prototypes from the smartphone up—ensuring the UX both looks great and functions perfectly before progressively enhancing the website for larger platforms with fewer constraints.

*Nielsen Insights 2015

cs_wsecu_design-1024x650

Design

When you plan this extensively for the design of a website and create incredibly detailed, high-fidelity wireframes, style guides, and art direction, not much is left up to chance. With tireless preparatory work from the team under their belts, our designers were able to focus on really making the refreshed brand come to life—from subtle compositional details and art direction for the photography to creating visually compelling user experiences that adapt with current and potential members no matter the screen size.

wsecu_dev_colab_alt

Collaborative Development

Although Gravitate was sole owner of the design and strategy, we co-developed the site with a third-party CMS solution, Ingeniux, and with WSECU’s staff. Recognizing the pain points, we quickly shifted to an Agile development process to facilitate the demanding timeline and collaboration, simultaneously completing many processes and providing hands-on training and assistance throughout.

results-transp-mock_2screens

The Result

We have to admit: the phrase “digital branch” was thrown around a lot as this project kicked off. While we rolled our eyes at first, the idea of directly informing design and UX decisions from a feeling achieved by walking into a newly rebranded physical location served as the driving factor behind this project. From method acting to determine user flows, usability testing to inform design and, finally, utilizing dynamic and evolving content throughout the site based on user behavior—every effort was committed to designing and delivering a low-effort, device-agnostic experience that perfectly resonates with current and potential members.

Our thoughts

It's appropriate that WSECU is all about community. This site was a community effort built by more than 10 developers across three companies. It was an amazing experience to collaborate with so many that were passionate about ensuring the success and quality of the end product. The level of thought and detail that went into everything from the subtle animations to the ever changing dynamic content resulted in a transparent seamless user experience being brought to life.

Brian Ferdinand, Front-End & UX Development Manager

I really enjoyed working with the WSECU team and how involved the were with the project. Both our team and their team were excited to create a great experience for their digital branch and provide more resources for their members. I also like the increase of pages on the new website, especially for the opportunity of generating new traffic and educated members on the offerings.

Joe Vernon, Marketing Manager