Website Design Car Insurance Company | Web Design
Yuliia Ishchenko
Smarter Warranty Website Redesign
A complete website redesign that helps users explore vehicle protection plans, understand warranty options, and move through a clear quote journey across desktop and mobile.
Protego Auto Care offers flexible vehicle protection plans for dealerships and individuals. The redesign focused on creating a trustworthy, structured, and easy-to-navigate website that clearly explains warranty products and guides users toward requesting a quote.
Industry: Automotive, Warranty Services, Car Insurance, Auto Care
Project Type: UX/UI Design, Website Redesign, Responsive Design
Scope: Website Redesign, Informational Pages, Warranty Quote Flow, Mobile Adaptation, Clickable Prototype
Contribution: User Research, Layout Planning, UX/UI Design, Visual Design, Responsive Design, Prototype
Project Overview
Protego Auto Care needed a website redesign that would make the warranty buying process easier to understand and more trustworthy for users.
The platform helps customers find, compare, and purchase vehicle protection plans. Since warranties can feel complex, the new website had to simplify the user journey, explain coverage options clearly, and make the quote process feel fast and reliable.
The final design combines informative service pages with a streamlined quoting flow, helping users move from learning about warranty options to taking action with confidence.
Problems
The old experience needed clearer structure
Users needed a more organized way to explore warranty options, products, benefits, and support information.
Warranty products can feel complex
Vehicle protection plans involve coverage levels, vehicle details, plan options, exclusions, payments, and add-ons. Without strong structure, users may hesitate or abandon the process.
The quote journey needed to be simplified
The quote flow had to guide users through vehicle registration, personal details, warranty type, plan start date, and payment without making the process feel overwhelming.
Trust was essential
Because users are purchasing protection for their vehicles, the website needed to feel professional, reliable, and transparent from the first screen.
Mobile usability needed improvement
Users needed to browse warranty information and start a quote smoothly from mobile devices.
Goals
Redesign the website into a modern and trustworthy automotive experience.
Create a clear structure for warranty products and service information.
Build a fast and intuitive quote flow.
Make key actions like “Start a Quote” easy to find.
Improve readability and navigation across all pages.
Create a responsive mobile experience.
Maintain a bold brand style using red, black, white, and clean typography.
Prepare responsive prototypes and detailed specs for development.
About the Project
Protego Auto Care offers flexible vehicle protection plans for dealerships and individual car owners.
The website redesign focused on communicating value clearly, improving the quote journey, and strengthening the overall perception of trust and professionalism.
The new design enhances the experience through clear hierarchy, mobile optimization, intuitive navigation, and a bold visual style aligned with the automotive niche.
Design Process
The project followed a structured four-step process.
1. User Research
We analyzed user needs, market expectations, and key UX goals.
The goal was to understand what users need before choosing a warranty plan: product clarity, coverage explanation, trust signals, pricing logic, and a simple way to request a quote.
2. Layout Planning
We outlined the website structure and created the main flow through low-fidelity layouts.
This helped define how users move from informational pages to action-oriented sections and then into the quote journey.
3. Visual Design
A clean, bold, and trustworthy visual direction was created.
The design uses strong contrast, red accents, automotive imagery, large headings, clear cards, and structured content blocks to make the website feel professional and easy to scan.
4. Clickable Prototype
Responsive prototypes were prepared to demonstrate the website experience and support implementation.
The prototype covered the main website pages, quote flow, mobile adaptation, and key interaction states.
Visual Identity
The visual language was designed to feel clean, confident, and automotive-focused.
Typography
Jost was used as the main typeface.
Its modern sans-serif style supports strong headlines, clean interface labels, and readable body text. The typography gives the website a professional and slightly bold look, which fits the automotive warranty category.
Color Palette
The palette uses a strong contrast system:
#EC0000 — accent red for CTAs, highlights, key words, and important actions.
#222323 — dark accent for backgrounds, footer sections, and strong contrast.
#FFFFFF — white for clean content areas and readability.
#F78F8F — light red support color for softer states and secondary highlights.
#3F3F46 — default gray for supporting text and neutral UI elements.
The red accent helps guide attention toward action points, while the dark and white foundation keeps the website clean and trustworthy.
Website Structure
The website was built around two core experiences:
1. Informational Website
A clean, well-structured space where users can learn about services, explore products, understand coverage, and find the information they need.
Main sections include:
Home
Our Products
Warranty Options
Dealer Portal
About Us
Contact Us
10+ inner pages
The informational part of the website helps users understand Protego’s services before entering the quote process.
2. Warranty Quoting Flow
The quote journey starts with the “Start a Quote” call-to-action.
Users are guided through three key stages:
Personal details
Warranty type
Plan start date and payment
The flow begins with vehicle registration or vehicle details, allowing users to enter registration data and confirm vehicle information before moving forward.
The goal was to make the quote process feel simple, guided, and reassuring.
Informational Pages
The website includes dedicated pages for warranty products, solutions, benefits, support, and company information.
The layout uses clean content blocks, image sections, product cards, benefit sections, CTA banners, testimonials, and footer navigation.
Key content areas include: Warranty cover, Car warranties, EV warranties, Van warranties, Motorbike warranties, Caravan and motorhome warranties, Dealer solutions, Customer benefits, Support and contact sections.
This structure helps users quickly understand which product fits their needs.
Product and Warranty Pages
The warranty pages were designed to make product comparison easier.
Each product section explains what the warranty covers, who it is for, and why it matters. Cards and content blocks help separate different warranty categories, while CTAs guide users toward requesting a quote.
The design uses bold red highlights to emphasize important terms such as solutions, benefits, warranties, and start a quote.
Quote Flow
The quote flow was one of the most important parts of the redesign.
The interface was designed to reduce friction by keeping each step focused and easy to complete.
Users can review vehicle details, compare cover options, adjust plan details, add warranty extras, and complete payment through a structured process.
Quote Confirmation
A success state was designed for completed warranty purchases.
The confirmation screen clearly tells users that the warranty purchase was successful and provides a simple path back to the homepage.
This creates a more reassuring end to the buying journey.
Mobile Adaptive Design
A full mobile adaptation was created to keep all key functions accessible on smaller screens.
The mobile design keeps the same strong visual identity while making content easier to read and actions easier to tap.
The result is a smooth mobile experience where users can explore and purchase coverage on the go.
UX Solution
To address the main challenges, the website was restructured around clarity, trust, and action.
The new design improves:
Information hierarchy
Page readability
Product comparison
CTA visibility
Quote flow structure
Mobile navigation
Trust-building content
Responsive behavior
By separating the website into informational pages and a guided quote flow, users can first learn about the service and then move naturally toward action.
Results
The final redesign created a more structured, trustworthy, and conversion-focused warranty website.
Key Results
A complete website redesign for vehicle protection and warranty services.
Clear informational pages that explain services, products, and warranty options.
A streamlined quote flow guiding users from vehicle registration to payment.
Improved visual hierarchy with strong typography, red CTAs, and structured content blocks.
Mobile adaptive design covering key browsing and quote actions.
Clickable responsive prototype prepared for smooth implementation.
Stronger trust perception through clean layouts, professional imagery, and clear service messaging.
Better conversion path from education to quote request and purchase.
Project Scope
This case study covers the redesign of the Protego Auto Care website, including informational pages, product pages, warranty options, dealer-facing sections, quote flow, payment screens, confirmation states, and mobile adaptation.
The design was created to help users understand warranty products faster, trust the brand more easily, and complete the quote journey with fewer barriers.
Conclusion
Protego Auto Care’s website redesign transforms a complex warranty experience into a clearer and more user-friendly journey.
The final design combines trust-focused content, bold automotive visuals, structured product pages, and a guided quoting flow across desktop and mobile.
The result is a modern, responsive website that helps users confidently explore, compare, and purchase vehicle protection plans.
✍️ Contact me and I will provide you with an estimate for your project!
Like this project
Posted Apr 21, 2026
UX/UI redesign for Protego Auto Care, a vehicle warranty website with clear information pages, quote flow, and mobile-friendly purchase journey.
Likes
1
Views
4
Timeline
Nov 3, 2025 - Dec 12, 2025
