Launching MetLife's First Online Payments | 2012-2014
In 2014, MetLife customers were unable to pay their premiums online, nor could they setup and manage automatic payments. The only method of payment for customers was to send a manual check to a PO box, resulting in lapsed/cancelled policies and significant overhead.
Data analysis revealed customers enrolled in autopay had a significantly higher probability of remaining customers for five+ years than those who paid their premiums manually. From a Call Center perspective, the number one query logged was customers asking how to make a payment online. On the customer portal, and through VoC research, this also was the number one issue, resulting in a low NPS score.
​
Our challenge was to create a responsive payment center allowing users to make one-time payments, setup and manage automatic payments, view their billing and payment history, purchase new products, and maintain payment accounts across MetLife policies. There were complex business rules we needed to work within, as well as integrate with a third party vendor who handled all credit and debit transactions to ensure PCI compliance.
.png)
My Role
I led the team responsible for UX, Creative and Copy. When I first joined MetLife, I worked with my team to conduct a detailed current state audit and identified "quick wins" for the self-service portal based on user research. We sold those ideas into senior management and worked closely with global Business Owners, multiple Product Owners, Development Leads, and BAs to create, prioritize and groom product backlogs. I also partnered with Development to ensure our ideas were technically feasible before we began detailed design. My contributions were acknowledged with a MetLife Core Values award.
Our team worked in four week design sprints ahead of development. We conducted usability testing at the end of each sprint to identify improvements that were added to the product backlog for future sprints. We also participated in the development sprints - providing support and user acceptance testing.
"...Before requirements discussions even began Michelle took the initiative to prepare a series of wireframes ... her contributions enabled the team to reach a greater level of precision in a much shorter period of time."
​
- Metlife, VP, 09/2015
Discovery
After years of convincing, we received buy in from the highest levels of management to design an experience allowing customers to make and manage payments online. The complexity lied in how to go about it, what features to offer, how to integrate with disparate data sources, and how to build something that could be used globally. This led to a month long discovery project with a global team.
Competitive Research
We first set out to understand how other companies within and outside of the Insurance sector were accepting online payments.
Developing Empathy
Next, we referred to our self-service user personas we'd recently developed through one-on-one interviews to ensure we were meeting the needs of our target users.
Feature Set Journey Maps
Leveraging our personas, Voice of the Customer interviews, Call Center data, and our Competitive Analysis, we began to frame-out potential features for the new experience.
Workshops
With representatives from MetLife's Global team, we fleshed-out features and prioritized "must haves" across devices through an intense series of workshops.
Rapid Prototyping, A/B and Usability Testing
As we were conducting research and preparing for our Workshops, we quickly prepared a few concepts to help facilitate the feature set conversation. These concepts were A/B tested with real users and the winner was fleshed-out during the Design Sprints.
Concept A
Concept C
Concept B
Concept D
Design Sprints
Once the overall concept was agreed to, we worked closely with the Product Owner and BA to formalize and groom the backlog, working a sprint ahead of development. On a parallel path, we worked with the team responsible for offline claim kits to ensure messaging and process were aligned, and that a link to the self-service portal was included in their offline communications.
​
Each design sprint was usability tested as either low or high fidelity prototypes, sometimes resulting in the addition of features or revisions that were added to the backlog and prioritized for future releases.
​
​
​
Feature Breakdown
Main Page
The main cards on this page flip to reveal further details and push the cards beneath them down. This allows the customer to view more information without leaving the page.
The first card on this screen shows the flipped state which is also indicated with a fold on the top right of the card.
Make a Payment
The most important feature from a business perspective was allowing a customer to pay their bills online and/or setup automatic payments. One template was created to handle both scenarios as well as the editing of both.
Add Payment Account
A drawer was created for customers to add, edit and delete payment accounts without leaving the Payment page.
Make a Payment Review Page
The page shows the user the details of the payment they are about to make before they submit it - allowing them to go back and fix any errors.
Make a Payment Confirmation
The page provides the user with all the details of the payment they just submitted, along with a reference number for their records.
In cases where the user is making a one-time payment, a strong call to action to enroll in automatic payments appears in the right rail, as well as in the "what do you want to do next" links at the bottom of the page.
Responsive Design
Each page and card was designed in tablet and phone views to ensure the best responsive experience across platforms.
Outcomes & Learnings
Key Metrics Before Launch:
-
MetLife's Self Service Portal had an NPS score of 4
-
MetLife's Self Service Portal was accessed by approximately 10,000 users per day
-
Payment questions were the number one inquiry logged by the call center
-
Lack of payment capabilities was the number one issue raised by customers on both Opinion Lab and VoC research
-
5% of MetLife's customers were enrolled in automatic payments
Key Metrics One Year Post Launch:
​
-
MetLife's Self Service Portal had an NPS score of 8 (100% increase)
-
MetLife's Self Service Portal was accessed by approximately 12,000 users per day (20% increase)
-
Payment questions were the number five inquiry logged by the call center (significant decrease)
-
Mostly technical issues related to payments were reported based on Opinion Lab and VoC research
-
9% of MetLife's customers were enrolled in automatic payments (80% increase)
-
42% of users that logged in and had an eligible policy made a payment online
​
​
The Road to Success Was Long & Difficult:
-
Our MVP release was a simple one-time payment with a bank account (no debit/credit cards due to PCI complexities)
-
We were bombarded with negative feedback about the lack of debit/credit card payment capabilities​
-
There were significant technical glitches when we first launched that "put a bad taste" in users' mouths
-
The Call Center wasn't aware of the new feature so they weren't directing users to the site
-
Users wanted to enroll in automatic payments and purchase insurance online
-
While we added a Payment Center to the primary navigation, some users still couldn't find it
-
Not all policies were eligible for online payment due to backend issues​, frustrating users
-
-
While the complexities of PCI compliance were worked out, we released a minor update to address user feedback
-
Added links to make a payment on the home screen were accounts were listed​
-
Prompted eligible users upon login to make a payment, if one was due
-
Created a promo area on the home screen to communicate the new feature and explain what users could do
-
Added the URL to all eligible bills that were sent in the mail
-
All of these changes increased our traffic, but core features users wanted were still missing
-
-
Our second major release allowed users to schedule automatic payments with a bank account
-
Users still expected to be able to use a credit/debit card​
-
Users wanted the flexibility to schedule payments at a frequency our business rules didn't allow
-
All that said, we saw a surge in automatic payment enrollment within the first month; I contribute this success to prompts we made to eligible users when they login and including the URL on their bills
-
-
Our third major release integrated credit/debit card payments through a third party vendor
-
The experience was framed-in (the horror - and it was)​
-
The experience was slow
-
There were technical glitches, and again users were left with a "bad taste in their mouths"
-
We conducted usability testing and showed the development team how bad the experience was, and eventually persuaded them to use the vendor's APIs instead of frames, significantly improving the experience and load times - earning back the trust of our users.
-
​
​