Case Study

FinTech: Mobile App Redesign

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 diversifies its core products and pushes to grow its business, NM believes it'll be important to better communicate its protect and prosper value prop, as well as, increase client engagement between advisor check-ins.

This work reflects the role NM's digital channels play in helping NM reach these goals. The first workstream was focused on illustrating an ideal mobile experience for the Northwestern Mutual mobile app that could be pragmatically implemented within 2-3 years. The second workstream was focused on iterative delivery of detailed design, working towards the ideal experience.

Northwestern Mutual
Product Design Director
Key Metric
Increase Avg Days Between Client Visits, Increase MAU
36 Weeks


  • Objective OneElevate the design, informing the evolution of the mobile design system, incorporate the NM brand aesthetic and build trust with the client.
  • Objective Two: Unite disparate stakeholder visions into a cohesive approach for the client mobile experience. Incorporate the business, advisor, client and marketing expectations into a unified view of the complete client mobile experience. 
  • Objective Three: Envision how the PDF plan can evolve into an interactive experience in the mobile app that allows clients to better understand their financial outlook and play with how life events can impact it. 
  • Objective Four: Deliver hypothesis-driven experiments and iterate the experience based on growth in key metrics: # monthly active users, # multi-product households and the # of users with a Northwestern Mutual plan.

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?

Who did we design for?

A woman with brown hair is on the couch with a child with brown hair.
Target user is married with kids, owns one or more NM products, has an advisor and has a plan.

  • Burgeoning Affluent Clients
  • Mid-30’s to mid-40’s
  • Owns one or more NM products (risk-only, investment-only, or integrated)
  • Has an advisor and a plan
  • Married with 1-3 kids
  • $125,000 avg. household income

Were there any plot twists?

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

This, but make it a website...

Northwestern Mutual marketing visual.

An early version of the proposed future vision.

What users were doing and saying diverged from the business needs. This presented an opportunity for the team to consider user and business needs and the complexity of satisfying both.

Help the business grow and help users make payments...

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.

Ceremonies were communicated in the design brief shared with the cross-functional team.


As of March 2024 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.


What helped create alignment?

  • All together, six features were identified from the vision to move to the delivery workstream the first delivery cycles
  • Key features & capabilities, a communication schedule, a lead designer and timelines were detailed in a design brief used by the full delivery team as well as senior leadership
  • Design crits with stakeholders gave just in time feedback so the team could keep iterating while staying within the timeline

What helped unblock the team?

  • Additional resources were added to fill in technical gaps, such as data visualization and marketing copywriting
  • A Slack group with SME's along with a biweekly meeting gave designers immediate access to product experts

Problem Framing

Both workstreams conducted discovery to inform their approach with the vision team focused on how to shape and frame the opportunities. The delivery workstream focused on refining the job statements from the vision team and iterating on the solutions.

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

Other Problem Framing Activities: 

  • Stakeholder Interviews
  • Scope Clarity
  • Research Review
  • Define knows and unknowns about the needs
  • Define job stories
  • Competitive Analysis
  • Current State Audit
  • OKR definition
  • Target User definition

Current state audit included documenting the existing IA and reviewing data to see if any changes should be made.

One of the proposed changes to the information architecture was to make the Advisor Center a first-class citizen. This proposed change included removing "Cash Flow," one of the most popular features, to being a second-class citizen. The delivery team used analytics to show how this change would impact usage, including engagement metrics.

Ideate Solutions

During the initial ideation phase, the team sketched solutions, keeping fidelity low.

A photo of a prioritization framework we used during the workshop.
This prioritization framework guided prioritization of concepts.

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

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

An image that shows different variations of the home hero module.
The team conducted research to determine the best labels and data visualization for the hero module.

Ship, Learn, Iterate

The first iteration of the hero module, quick actions and design language updates shipped January 2024.

My role was Product Design Director overseeing the two workstreams.

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