Admiral Pet Quote Journey
Overview
In 2021, our Pet Insurance Quote engine was outdated and confusing. It was also white-labelled from an external company. It needed to be modernised and mobile-first. The different product tiers are also confusing, so the quote flow needs to be both educational and clear to the customer.
For many years, our brands websites have been designed through Adobe Illustrator and Dreamweaver. One of the main problems was there was no centralised place for all of our assets. There is also no clear place to maintain a consistent look & feel.
And we had many problems with inconsistencies; at one point, all seven of our product landing pages had different button and text sizes in their hero banners. And a look at our icon suite also showed over 800 variants were being used across email, web and our quote engines.
Categories
UX/UI Design
Design Systems
Client
Admiral
Date
2021
Redesigned desktop flow
Examples of the mobile view
Showing wireframe to final execution
Process
The existing flow and question set was torn up. We rewrote the questions and changed their order to prevent the customer reaching a dead-end while getting a quote. The design was mobile-first with a clear emphasis on clarity – spreading the questions over a number of pages and by using a clear and accessible AAA WCAG colour palette.
Along with the Creative Director and designers from other products, this year we set about creating a design system to contain all our assets in Figma. This included icons, colours and typefaces, as well as modules and more complex components to allow new webpages, emails and app mockups to be created quickly.
I created the wireframes for the initial concepts and the finished designs. Myself and the Creative Director also rewrote some of the content to inject personality and warmth.
Takeaways
The pet journey was our first proper test-and-learn project, so it allowed us to work in a totally different way to our normal MVP process of getting a product out quickly and iterating later. The journey has been a success and seen many copy-cats. 4 years later the journey is still going strong.
Admiral Pet Quote Journey
Overview
In 2021, our Pet Insurance Quote engine was outdated and confusing. It was also white-labelled from an external company. It needed to be modernised and mobile-first. The different product tiers are also confusing, so the quote flow needs to be both educational and clear to the customer.
For many years, our brands websites have been designed through Adobe Illustrator and Dreamweaver. One of the main problems was there was no centralised place for all of our assets. There is also no clear place to maintain a consistent look & feel.
And we had many problems with inconsistencies; at one point, all seven of our product landing pages had different button and text sizes in their hero banners. And a look at our icon suite also showed over 800 variants were being used across email, web and our quote engines.
Categories
UX/UI Design
Design Systems
Client
Admiral
Date
2021
Redesigned desktop flow
Examples of the mobile view
Showing wireframe to final execution
Process
The existing flow and question set was torn up. We rewrote the questions and changed their order to prevent the customer reaching a dead-end while getting a quote. The design was mobile-first with a clear emphasis on clarity – spreading the questions over a number of pages and by using a clear and accessible AAA WCAG colour palette.
Along with the Creative Director and designers from other products, this year we set about creating a design system to contain all our assets in Figma. This included icons, colours and typefaces, as well as modules and more complex components to allow new webpages, emails and app mockups to be created quickly.
I created the wireframes for the initial concepts and the finished designs. Myself and the Creative Director also rewrote some of the content to inject personality and warmth.
Takeaways
The pet journey was our first proper test-and-learn project, so it allowed us to work in a totally different way to our normal MVP process of getting a product out quickly and iterating later. The journey has been a success and seen many copy-cats. 4 years later the journey is still going strong.
Admiral Pet Quote Journey
Overview
In 2021, our Pet Insurance Quote engine was outdated and confusing. It was also white-labelled from an external company. It needed to be modernised and mobile-first. The different product tiers are also confusing, so the quote flow needs to be both educational and clear to the customer.
For many years, our brands websites have been designed through Adobe Illustrator and Dreamweaver. One of the main problems was there was no centralised place for all of our assets. There is also no clear place to maintain a consistent look & feel.
And we had many problems with inconsistencies; at one point, all seven of our product landing pages had different button and text sizes in their hero banners. And a look at our icon suite also showed over 800 variants were being used across email, web and our quote engines.
Categories
UX/UI Design
Design Systems
Client
Admiral
Date
2021
Redesigned desktop flow
Examples of the mobile view
Showing wireframe to final execution
Process
The existing flow and question set was torn up. We rewrote the questions and changed their order to prevent the customer reaching a dead-end while getting a quote. The design was mobile-first with a clear emphasis on clarity – spreading the questions over a number of pages and by using a clear and accessible AAA WCAG colour palette.
Along with the Creative Director and designers from other products, this year we set about creating a design system to contain all our assets in Figma. This included icons, colours and typefaces, as well as modules and more complex components to allow new webpages, emails and app mockups to be created quickly.
I created the wireframes for the initial concepts and the finished designs. Myself and the Creative Director also rewrote some of the content to inject personality and warmth.
Takeaways
The pet journey was our first proper test-and-learn project, so it allowed us to work in a totally different way to our normal MVP process of getting a product out quickly and iterating later. The journey has been a success and seen many copy-cats. 4 years later the journey is still going strong.
