compare-
first redesign

2024
ui/ux
in-depth user research
user testing
‍web optimisation
rapid prototyping

overview

In this project, we were given 13 weeks to redesign CompareFirst.com in groups of 3. We were given the full flexibility to reimagine how online insurance literacy could be repackaged to better suit our users' needs.

After weeks of in-depth research, interviews and testing, we arrived at Moneyverse, an integrated online insurance platform that provides personalised insurance resources.

Understanding Insurance Tab

challenge

Due to the nature of the brief and website, we have a few key challenges.

i) organisation of information

Insurance is an incredibly complex subject that every Singaporean has to interact with (by nature of MediShield, Medisave etc).

Yet, many Singaporeans still lack the basic knowledge and confidence to make independent insurance decisions, largely attributing it to its complexity and technicality.

How might we organise information to give Singaporeans what they need, at the right time and amount, without overwhelming them?

CompareFirst's landing page with many technical terms.

ii) objectivity

As CompareFirst is a website that involves the collaboration of MAS, the line of suggestion, recommendation and advice must not be crossed to preserve the authority and transparency associated with MAS.

process

i) initial desktop research

Our team quickly delved into the world of insurance by researching insurance in more depth. Insurance terms, processes, Singaporeans' sentiments on insurance and religion's impact on insurance were some of the topics that we researched.

Amongst all those, we did an Ecosystem Value Proposition to better understand Singapore's insurance ecosystem.

The insurance ecosystem in Singapore.

ii) CompareFirst website audit

An in-depth audit of CompareFirst's user interface and journey was conducted to identify key issues and design more targeted solutions

1) overwhelming UI

Some examples are the fast auto-forwarded carousels and the overwhelming amount of colours.

CompareFirst's landing page.

2) technical jargons

The jargons on the landing page such as "Coverage Term" and "Direct Purchase Insurance Products" makes it overwhelming for first-time insurance users.

3) information architecture issues

Useful features, such as the "Glossary" are hidden under the navigation bar's dropdown. When clicked in, there is a repeat of the dropdown, which could confuse users.

Useful but hidden information.

Breadcrumbs are not optimised. For example, the breadcrumb implies that clicking on "Getting Started" on the navigation bar directly sends the users two levels deeper into the website when in fact the user is only one level deeper.

Poor breadcrumbing.

iii) user interviews

We created unique discussion guides for each of the 9 individuals we contacted to gain as much value as possible from each interview.

Our 8th user interview.

iv) prototyping and testing

Designing and prototyping our lo-fi and finally hi-fi designs were done iteratively based on our user tests.

v) co-design workshops

We held workshops with stakeholders from MAS and private insurance companies to further refine and validate our prototypes. The workshops gave us better industry-specific insights that were valuable in our final design.

Co-design workshops with stakeholders.

outcome

The outcome was a clear and robust user flow specific to our target audience of young working adults taking over insurance from their parents.

We focused on giving our users important information and actionables at specific points of their user journey (which were validated through our user interviews and testing) to avoid overwhelming them.

Here are some key features of our proposed website.

i) streamlined onboarding

Through an implementation of SingPass login coupled with an integration of SGFindex resources, we can extract an individual's insurance policies across all the partnered private insurance companies like AIA and Great Eastern.

This effectively streamlines the process of manually searching for your policies.

SingPass login.

ii) tailored guidance

With the help of a website companion, Cofi, users receive tailored guidance. She serves as a universal mobile glossary, lets users save terms for future reference, and offers pop quizzes with curated questions to test their understanding of insurance topics.

Mobile Glossary feature.

Accessing saved terms.

Pop quizzes to impart confidence to users.

iii) personalised information

1) personalisation in "Understanding Insurance"

Using SingPass login and SGFindex integration, we help users identify and prioritise insurance policy types they already have, ensuring they start by understanding what's most relevant to them.

Helping users prioritise which policies to understand first.

2) personalisation in "Review Your Policies"

In the Review Your Policy tab, each policy displays objective benchmarks based on similar demographic profiles, offering users, especially those who are new to insurance, a clear reference point and a strong call-to-action to evaluate their current coverage. This is especially important as time significantly impacts insurance premiums.

Encouraging users to evaluate their policies.

closing thoughts

Collaborating with MAS presented unique challenges, especially balancing creativity with strict regulations and policy requirements. These constraints pushed me to think more critically and innovate within boundaries, ultimately enhancing my understanding of designing for impactful, user-focused solutions.

I am immensely grateful to have had the opportunity to experience and take on this project. What I learnt and experienced in this project will stay with me for a long time.

PS: There are more features that are not shown here. If you are interested, hit me up below for a full breakdown!

hello,

want to try the full clickable prototype?

contact me