Becoming More than an Insurance Company

Laura Cochran smiling.
Case Study Overview

Northwestern Mutual (NM) was in year two of a digital transformation program when this effort began. The business wanted to optimize and improve their successful relationship-based planning process by making the digital products a true extension of the client experience.

This work reflects the role NM's digital channels play in helping NM reach these goals.

Impact
20.3% increase in MAU YoY and 6.48 average sessions per month a 7.1% positive change MoM
Role
Design Director
Client
Northwestern Mutual
Timeline
36 Weeks
Size

The Situation

Northwestern Mutual (NM) is well known for its insurance products. Its client-facing web and mobile applications allow customers to seamlessly make payments, view statements and keep updated on the value of their insurance policies.

As NM diversified its core products and pushed to grow its business, NM believed it was important to better communicate its protect (insurance) and prosper (wealth) value prop, as well as, increase client engagement between advisor check-ins.

Design Challenge

How might we help clients protect and prosper by enabling them to interact with and optimize their plan, review their products, and engage their advisor?

Objective One

Elevate the design, informing the evolution of the mobile design system, incorporating the brand aesthetic to build trust with the client.

Objective Two

Unite disparate stakeholder visions into a cohesive approach for the client mobile experience. 

Objective Three

Envision how the PDF plan can evolve into an interactive experience. 

Objective Four

Deliver hypothesis-driven experiments and iterate the experience based on growth in key metrics.

Approach

There were two teams for the work. One team was focused on the vision for the mobile experience that could be pragmatically implemented within 2-3 years. The second team was focused on iterative delivery of detailed design, working towards the ideal experience.

Understanding the Problem

Both teams came together to conduct discovery to shape and frame the opportunities. The vision team stayed at a higher altitude while the delivery team focused on prioritization or sequencing of the opportunities based on job statements and user needs.

A photo illustrating how the team brainstormed jobs to be done for the client.

Other Activities: 

  • Customer Interviews
  • Stakeholder Interviews
  • Secondary Research Review
  • Competitive Analysis
  • Current State Audit
  • OKR definition

Define

Problem Statement

We are going to help people understand the value of having both protect and prosper products in order to increase integrated clients for the business.

We are going to provide a frictionless online advisor and planning experience in order for our clients to see the value they are getting from their investment and quickly interact with their advisor and products.

The Users

The team used existing personas for this work, narrowing the focus of the work on the NM customer that would most likely be an engaged, multi-product customer. For example, someone with kids would likely want to leave a strong legacy behind and protect their family. Or, someone with an advisor is more likely to be engaged with NM and more interested in extending their relationship with their advisor to digital channels.

  • Married with kids
  • Owns one or more NM products
  • Has an advisor and has a plan

A woman with brown hair is on the couch with a child with brown hair.

Ideate

Low-fidelity sketching allowed the team to get out as many ideas as possible. Then, a prioritization framework was used to narrow down and combine ideas.

Narrowing down ideas based on business and user value was critical at this point. The team aimed to find the right balance of user needs and impact on the business by increasing the number of clients with more than one product.

NM is known as an insurance company. The hypothesis was people were more likely to think of NM as an investment company as well if we could quickly show the product diversity and value of having both insurance and wealth products.

Design

Once it was time to get stakeholder and user feedback, the visual fidelity increased but the content fidelity remained low as the team conducted UX research to identify:

  • hierarchy
  • labels
  • navigation patterns
  • data visualization style
  • overall branding

The team conducted research to determine the best labels, interaction pattern and data visualization for the hero module. Simultaneously, the team was working with the engineering team to do a technical spike on the segmented control component. The team highlighted the usability of this component could be an issue for users but it also might not be the best technical execution also.

Ultimately, leadership direction was based on a ship and learn approach for the component. This was a two-way door situation. Once the component was shipped the team would monitor: 

  • Where users clicked
  • How often users clicked on each label
  • Scroll patterns
  • Click path patterns

One of the proposed changes to the information architecture was to make a new feature, the Advisor Center, a primary navigation item. This proposed change included removing "Cash Flow," one of the most popular features from the primary nav. The delivery team used data from surveys and analytics to show how this change would impact the users and engagement metrics.

An image that shows different variations of the home hero module.

Results

As of March 2024, three months after launch of the first experiments, there was a 20.3% increase in MAU YoY and 6.48 average sessions per month a 7.1% positive change MoM.

Elevated Design: Design Language Updates

We introduced aspects of Northwestern Mutual's brand aesthetic into the mobile app.

  • Brought in the dark NM blue globally with a heavy impact update to the header and footer.
  • Introduced NM’s gold highlight color strategically to bring in more of NM”s familiar brand color.
  • Created a “NM badge” to illustrate the NM three-part value proposition: protect, prosper, plan; and, provide a simple, intuitive visual for advisors to use to coach clients to "complete the rings" by getting a plan, protection through insurance and an investment portfolio.

Redesigned Home Hero Module & Quick Actions

We showed the value of client's products as well as personalized recommendations to expand their portfolio without compromising client's access to self-service capabilities.

  • A vision for the redesigned hero module informed the final delivery
  • The first version of the hero module launched January 2024, illustrating the value of a person’s NM products
  • Quick Actions also launched January 2024, providing one click access to the most used self service items

Communication Center for Advisors & Clients

We gave all collaboration tools and advisor communication a "home" to empower clients to seamlessly collaborate with their advisor and financial team.

Reflection

Keeping the Team Aligned

Keeping the teams aligned was the biggest challenge. The teams were working at different altitudes, everyone was distributed and contractors were working on the vision while the dedicated internal team was working on delivery.

An initial six experiments were prioritized to be delivered from the vision work. To transfer knowledge from the vision team to the delivery team, we aligned on project briefs that described:

  • Design pillars
  • Key features & capabilities
  • User needs
  • Business needs
  • Communication schedule
  • Design crit schedule
  • Timeline
  • Resources

Resourcing for Gaps in Technical Capabilities

Outside of maintaining alignment, determining gaps in capabilities was also key to delivering this work.

  • Additional resources were added to fill in technical gaps, such as data visualization and marketing copywriting
  • A Slack group with business SME's and a biweekly meeting closed the gap in business knowledge as the designers worked to recreate the advisor & client relationship


Communicating Dense Financial Information

We needed to understand, then visually communicate dense financial information and accurately nail the technical nuances.

Vision work included pulling in marketing materials that took months to create. This is one example.

The initial prototypes were complex and not aligned with mobile best practices or user needs.

An early version of the proposed future vision.

Aligning Business and User Needs

What users were doing and saying diverged from the business needs. The delivery team had to balance helping users make payments while also helping the business communicate the value of expanding the relationship.

The vision, for example, moved the quick action to pay your bill below five feature modules. The final design moved the quick action back to the top of the screen.

The work was high profile with heavy-handed senior leadership oversight. So, designers were working with different levels of fidelity to get actionable feedback from senior leadership, users and the field (advisors) while they moved fast to deliver concepts.

The Team

My role was Design Director focused on delivering the highest quality work on time, considering tradeoffs and constraints, accounting for accessibility in the designs, and aligning with the strategic direction and objectives of the business.

Vision Team

  • Gloria Wu, Designer
  • Jarret Pickens, Designer
  • Laura Levisay, Designer
  • Kathryn Marinaro, Creative Director

Delivery Team

  • Lindsay Ackerman, Senior Designer
  • Bridget Ma, Associate Designer
  • Joe McNeil, Principal Designer
  • Thomas Voss, Content Design Director