Combining wellness and insurance into one App - users can track steps to receive premium discounts and manage their insurance policies
To hit the revenue goals of the coming year, Manulife aims to increase the conversion of younger customers to the wellness programme ManulifeMOVE offers on the Mobile platform. Thus, the management has decided to combine the MOVE app with the Manulife Servicing App, which serves millions of ASEAN customers in managing their financial portfolios. This App will roll out to many ASEAN countries in Q3 2022.
I was engaged in this short term project from June to September 2021 to lead the definition and design of the customer experience of the "Combined App". I collected requirements and defined the project scope for different phases (MVP and phase 2) during my tenure, balancing the cost and delivery timeline. I also designed user flows for onboarding and wireframes for the "Combined App" key screens.
During the process, I worked alongside a team of Accenture consultants, an in-house engineering team, and solution architects to estimate the delivery timeline. We also created a prototype app with the new designs where we integrate a Web View using AngularJS to display servicing app features within the MOVE app.
Before committing to delivering this project, our project team needs to obtain buy-in from the management and local offices as much as possible for the Concept of the Combined App. In 2 months, we also need to assess the delivery lead time and the associated cost to roll out the MVP and prioritize features in 6 months.
Working collaboratively with the Servicing app Product Lead, our team planned the roadmap for the Combined App by phases and rolling out by markets based on business needs and readiness of the backend services that would fit into the frontend development pipeline.
As the product owner to scope and design this new App, I have to develop a prototype app that can illustrate a seamless onboarding experience for new and existing users and ensure superb usability for the integrated Wellness & Financial Management features in one platform.
The key challenge of designing the onboarding experience is that we cater to many use cases and edge cases. As the MOVE and the Servicing App are already serving many users, the design of the Combined App will need to handle account registration and login for different user types.
To complicate the design, the security requirements for both Apps differ. When combining those two groups of features into one App, we need to consider creating various authentication approaches at different touchpoints. The design needs to comply with the strict financial industry standards to ensure robust security for users in handling financial information while feeling coherent and logical to the user when the user is navigating the App accessing different functions.
The delivery and product teams must align with specific design principles to solve the above problems. After several discussions with the Head of Platform Delivery and the Head of both the MOVE programme and Servicing, we have summarized the following:
One of the fundamental design principles to create a great onboarding experience is to reduce the number of steps to access and experience the core values of the App. We want to ensure MOVE users (but not policyholders) do not need to go through multiple authentications (like the recent experience) to track their steps and join health challenges.
Balancing both customer experience and high security, we settled on designing a staged authentication approach. Users only need to log in with account credentials to access the core App and go through the second-factor authentication when accessing a higher security level information, e.g., when a person needs to see payment history or change credit card details.
To further streamline the onboarding process, we explored implementing biometrics as a login method to shorten the time of logging in. After some evaluation, we have confirmed that biometrics can completely replace the 2FA: username and password and OTP verification steps.
However, it is essential to note that the biometrics feature is only available for phones with such native functions (Touch ID or Face ID). As this combined App will launch in countries where only half the population of phone users have such functions, we also need to design the 2FA journey for users who did not enable biometrics or cannot use biometrics as a login method. We have resorted to showing an additional OTP verification where code is sent to the either registered email address or phone number upon customers' choice.
Using the MOVE App existing account registration and login flow, we incorporated changes to accommodate logins for non-MOVE users but are Servicing App users. For example, we need to combine the T&CS, Terms of Use, and Informed consent of MOVE and Servicing App for users' viewing during account creation and develop a common sign process where both MOVE App or Servicing App users can both log in to the Combined App.
The team has created the prototype flow and tested it with some internal users based on the user flow. We learnt that:
We have taken the insights and added a screen after the user selects "Create Account" and asks the user if they are an existing Manulife customer. This way, we can educate Servicing App users that they can also log in to an unknown App with the single sign-on feature.
It took a week to align with solution architects across multiple service systems (e.g., Claims, Funds, Policies) on the backend infrastructure design. It took another week to get approval from the Legal & Compliance team on the feasibility of implementing the staged identification verification process.
We have concluded that the higher levels of security apply when a user has started the session with the Servicing function, which means the timeout session changes from 4 hours to just 15 minutes when the user has navigated from using wellness features to financial servicing components.
Finally, I mapped out the user journeys for different scenarios, including existing MOVE App users, existing Servicing App or Web users, non-policy holder MOVE App users, users registered with MOVE and many more. We created a Figma prototype that we use for further refinement with the team. We are ready to run this with some selected users in our user interviews.
Apart from designing the onboarding experience that works for all users, the integrated features in this Combined App consist of many design considerations. We have to:
Together with the UX/UI designers, we researched and looked at references to the navigation and structure of many healthcare, fitness, wellness, and financial apps.
Through gathering requirements from country managers in Vietnam, Hong Kong, and Singapore, we have scoped out that this Combined App would offer the following features:
We created a conceptual design of combining the two apps by restructuring the entire navigation based on product features. As the key business objective is to drive conversion and generate leads, we must build features to upsell App users with new products or redirect users to our agents. In addition, we need to create an appealing first-time user experience for both MOVE App users and Servicing App users. With these requirements in place, we created multiple versions of the Dashboard view (landing screen) and conducted more preference tests with internal users to settle on the Dashboard design.
Since a policyholder and a non-policy holder can both enjoy the wellness features of MOVE, whereas only a policyholder can access servicing components, the landing experience for each type of user differs.
We conducted interviews with users in Vietnam and Singapore across different age ranges, using a prototype app with English translators through a Zoom call for two days. The objective of the user test is to understand the (i) desirability of the Combined App, (ii) likelihood to download the App (iii) likelihood to continue using the App, focusing on the changes added to the existing MOVE App like the Dashboard and the Services tab.
To ensure we get unbiased feedback, we chose a group of existing MOVE App users and non-policy holders to play around with the prototype app and describe how they feel and like the Combined App.
The users are generally satisfied with the landing page and can clearly understand the layout and content. They also found the content on the landing page helpful, mainly information related to Policies. They like the Combined App's modern design, policy management, and health tracking features. In short, the users appreciated that they could manage their policies more quickly using one single platform without requiring multiple touchpoints across Servicing App and physical branches.
With the high-level conceptual design and the onboarding flow validated with users, we locked down the UX of the critical landing screens, and user flows of the App. I then worked closely with the Scrum team to create technical requirements for both frontend and backend implementation needs. We explored possible technical solutions for designing the combined App, including a completely native experience vs a web app integration. We decided to create a Hybrid App with the key Servicing features mainly residing on the "My Policies" tab in the navigation bar. This way, a different engineering team can focus on building a Web View that hosts all API calls from the Servicing features. Our MOVE engineering team can code the front end of the entire App concurrently.
This development approach saves us time and allows us to deliver within the expected timeframe. The Web View non-native experience was still considered satisfactory from users' point of view after conducting user testing with a prototype App.
To finalize the design of the Combined App, the team has gone through more iterations to refine the visual presentation of the components further and ensure consistency across the different features. I bridged between the business and the designers and engineering team to ensure requirements were taken and incorporated into the final design.
With the App designs developed and tested, the design phase of the Combined App was signed off by the project sponsors and the Head of MOVE and Servicing. The project was ready to be brought into the development phases.
Before rolling off from this project, I wrote all the needed requirements for developing the registration and general navigation of the Combined App for the first two sprints.
Apart from documenting the changes in business logic and features of the App, I also learned and summarized the critical development efforts required to ensure the successful delivery of the Combined App.
This product design experience was short yet very fruitful.
As I deep-dived to tackle difficult problems with the engineers and solution architects from different teams and functions, I learned many technical complexities in merging two legacy applications with vastly different data structures. I have explored new biometric technologies and understood the intricacies of designing a global application where localization applies to product features, regulations, and UX/UI designs.
My role also puts me in a challenging position where I communicate requirements and design details across multi-functional team members like the engineers, project managers, designers, team heads and VPs, country managers, and external business consultants. During the entire design process, I constantly needed to explain to the Legal & Compliance team how the technical design of our system could meet the stringent security requirements of the financial industry in Hong Kong.
I have honed my critical thinking, problem-solving, and communication skills while straddling between the designers and the engineers.
Energised by bold ideas and lateral thinking, I’m up for solving big problems and transforming the world. Count me in for innovating products, processes, and customer experiences.
