Project:
Responsive Web Design
Role:
Sole UX/UI Designer
Timeline:
1 Week (4/21/2025 - 4/28/2025)
Project Background
Car detailing is a big business with a large mix of one or two-man shops and established companies with a garage. I have chosen to work with a local business owner to redesign his website for car detailing. He is a one-man business trying to get his company off the ground as a second source of income. He has a website, but says little to no business comes from it, so he might not even keep it up because of the expense. The goal was to create a responsive, intuitive website for this premium car detailing business that could increase bookings and build trust.
The Problem
Customers seeking luxury car detailing often find websites that are either outdated, confusing, or lacking trust signals. Legacy Mobile Detailing needed a modern, clean, and mobile-friendly website that showcases expertise, builds trust, and makes booking services easy.
The Goal
Create a responsive, intuitive website for a premium car detailing business to increase bookings and build trust.
The Finished Product
See my responsive prototypes here!
My Design Process
Discovery
Ideation
Design
Testing
Iterations
Reflections
Discovery Phase
My Initial Assumptions:
I propose that a responsive, visually polished website with clear service details, strong trust signals (like a gallery and testimonials), and a streamlined booking process will increase user confidence and lead to higher booking conversion rates for Legacy Mobile Detailing.
User Interview Process
Research Goal:
To understand car care habits, service expectations, and interest in premium auto spa offerings.
Participation:
7 people - via a mix of video chat and surveys.
Synthesizing User Interviews:
Most participants clean their cars semi-regularly and rely on drive-thru washes or personal maintenance, with few having used professional detailing services. Across the board, users valued clear pricing, easy online booking, and trust-building elements like galleries or testimonials when considering a detailer. While price sensitivity varied, convenience, consistency, and the ability to preview service quality were the most consistent drivers of confidence and interest in booking. I made an affinity map to organize my research.
Affinity Map
Key Findings from User Interviews
Car Care Habits and Frequency
Most participants clean their cars monthly or less, typically using drive-thru washes or washing at home.
Only a few reported regular detailing; some hadn't detailed their vehicle in years.
Interior cleanliness is often self-managed unless it becomes noticeably dirty.
Perceptions of Detailing
Viewed by many as a luxury or occasional deep-clean, not part of regular maintenance.
Some see detailing as valuable for long-term car care, especially for high-end vehicles.
Others felt it was unnecessary unless for a special occasion or resale prep.
Barriers and Frustrations
Cost was the most common barrier to booking detailing services.
Some users mentioned the time commitment or inconvenience of drop-off.
Lack of clarity around what’s included in services was also mentioned.
What Could Win Them Over?
Bundling with dealership service or oil changes for convenience.
First-time discounts, referral perks, or loyalty programs.
Offering services during already-scheduled maintenance would encourage trial.
Service Preferences
Mobile detailing was preferred by most for convenience.
One participant preferred in-shop for a more "professional" feel.
Users liked the idea of not needing to wait around or coordinate transport.
Decision Factors
Most important: Product quality, online booking, and price transparency.
Turnaround time was less important as long as quality was high.
Trust signals like gallery photos and reviews strongly influenced confidence.
Motivations for Detailing
Primarily to restore interior cleanliness or preserve long-term value.
Aesthetic pride and the enjoyment of a clean space were common motivators.
For high-end car owners, detailing was framed as preventative care.
What Feels Premium
Hand wash & wax, use of premium products, and attention to interior details.
A seamless, polished booking experience and clear communication.
Visually appealing before/after imagery and clear service explanations.
Opportunities for Legacy
Make “Mobile Convenience” the Core Value Proposition
Showcase Visual Trust Signals (Gallery + Reviews)
Add Clear Pricing and Service Expectations
Quotes from Users
“The gallery evokes a sense of trust that they can handle luxury vehicles."
— Brian, mid-50s, owns a Ram Truck and a Porsche, yearly detailer and monthly washes
"If detailers worked with dealerships… that might generate more business. It just needs to be convenient."
— Cameron, mid-30s, owns a Mazda CX-5, semi-monthly washes
"I loved the look and feel as I booked — it felt like a real website."
— Lauren Levy, mid-30s, owns an Audi Q5, washes every week
User Personas
Goal Alignment
Important Intersecting Goals:
Simplify and Streamline the Booking Experience
Build Immediate Trust Through Visuals and Clarity
Display Transparent Pricing and Service Info
The Ideation Phase
Point of View Statement
Car owners who value cleanliness and convenience need a trustworthy, easy-to-use way to book premium detailing services because they often feel uncertain about quality, pricing, and how much time the service will take — especially when dealing with smaller or solo businesses.
How Might We Question
How might we build trust and make it effortless for users to understand, book, and feel confident in mobile auto detailing services?
Creating a Feature Set
Creating a Feature Set
| Priority | Category | Feature | Description |
|---|---|---|---|
| P1: Must-Have | Business & Trust | About the Detailer Section | Personal story builds credibility and trust, especially for a solo biz. |
| P1: Must-Have | Business & Trust | Testimonials & Reviews | Essential social proof, boosts trust fast. |
| P1: Must-Have | Services & Booking | Services Overview Page | Users need clarity on what’s offered and pricing |
| P1: Must-Have | Services & Booking | Online Booking System | Reduces friction and saves time for both client and detailer. |
| P1: Must-Have | UX/Experience | Mobile-First Responsive Design | Most users will access via mobile. UX must be seamless. |
| P1: Must-Have | Utility & Contact | Contact Form | Basic contact functions are expected. |
| P2: Nice to Have | UX/Experience | FAQ or Service Explainer Modals | Reduces confusion and can preempt unnecessary questions. |
| P2: Nice to Have | Business & Trust | Before/After Image Gallery | Visually demonstrates skill and quality of work. |
| P2: Nice to Have | Business & Trust | Certifications / Products Used | Adds professionalism if available, but not critical to launch. |
| P2: Nice to Have | Utility & Location | Service Area Map | Helpful for mobile services, supports local SEO. |
| P3: Delightful | UX/Experience | Loyalty or Referral Program | Encourages repeat business and word of mouth. |
| P3: Delightful | Utility & Contact | Live Chat or Textable Widget | High-touch experience for premium users, may be SMS-automated." |
| P3: Delightful | Services & Booking | Package Add-ons (e.g., ceramic coating) | Enhances perception of premium service. |
| P4: Can Come Later | UX/Experience | Customer Dashboard (Bookings/History) | Useful for power users, but not essential for launch. |
| P4: Can Come Later | Marketing & Offers | First-time Discount or Deal Banner | Boosts conversion, makes users feel special. |
| P4: Can Come Later | Content & SEO | Blog / Car Care Tips Section | Helpful for SEO but more effort than return in early stages. |
Creating User Flows
I created a feature set and user flows by these three key examples:
Prioritized by Value and Impact
Mapped to User Intent and Business Goals
Designed for Scalable Interaction
The Design Phase
Wireframes and Mid-Fidelity Prototype
Initial Wireframe Process
Sketched mobile-first wireframes.
Developed low-fidelity wireframes on Figma
Ran user testing with the mid-fidelity prototype
Mid-Fidelity Wireframes
Branding
Creating the Logo
I chose to update his design and reinforce a brand image by recreating this logo. I did this using several AI tools to get a modern, sleek logo with a sports car background.
Legacy UI Kit
Desktop Version
High-Fidelity Prototype
Using Figma, I developed a visually polished prototype that had:
1. Sticky CTA Booking Bar
2. Clean, Scrollable Service Cards
3. Integrated Gallery + Visual Trust Signals
4. One-Tap Access to Key Actions
5. Mobile-First Booking Flow
6. Responsive Navigation Anchors
Testing My Designs
Mid-Fidelity Prototype Testing
Participants
5 users (varying in car maintenance habits from frequent DIY cleaners to luxury service users)
I Conducted these User Tests over Google Meets
Key Successes
Usability & Navigation
Users easily understood the structure and found it intuitive to move through the site.
Booking flow was clear, with users able to start a booking confidently without confusion.
Tasks were completed without needing assistance, indicating strong information architecture.
Content Clarity
Participants quickly grasped the service offerings and understood the general value proposition.
Most users could describe what the business does just by looking at the homepage—first impressions were strong.
Only minor gaps were noted in service detail clarity, mostly around missing pricing and duration.
Trust & Visual Appeal
The design was consistently described as visually appealing and professional.
Participants said they would trust the service based on design alone, which shows strong brand credibility at an early stage.
Suggested enhancements (like service photos and reviews) were aligned with what you had already prioritized in your feature set.
Pain Points and Usability Issues
Missing Key Information
No pricing listed on the service overview page, leaving users unsure whether the business fits their budget.
Lack of service details (e.g., what’s included in a basic vs. premium package) made it hard for users to make booking decisions confidently.
Users wanted to know how long services take and what to expect during the appointment.
Unclear CTAs & Flow Gaps
Some participants hesitated at the booking CTA, unsure if it would lead to scheduling, a quote, or just a contact form.
A few users expected real-time availability or calendar view but were unsure what would happen after clicking “Book Now.”
Navigation hierarchy could benefit from clearer section labels—some weren’t sure where to find the FAQ or policies.
Missing Trust Builders
No reviews or testimonials were present in the Lo-Fi version, which several users said would help them feel more confident.
Users wanted to see photos of past work or before/after shots to gauge the quality of detailing services.
A couple of testers asked about certifications or products used—especially those with higher-end vehicles.
Next Steps and Action Items
Add Clear Pricing and Service Details
Strengthen Trust with Social Proof and Visuals
Refine Booking Flow Clarity
High-Fidelity Prototype Testing
Purpose
The purpose of this usability test was to evaluate the effectiveness of the high-fidelity prototype for Legacy Auto Detailing in communicating its value, building trust, and supporting intuitive task flows. The test focused on first impressions, service discovery, and the booking process—key conversion points for new users. Additionally, we aimed to assess how visual elements like the gallery contributed to user confidence, and to identify any usability gaps that could impact engagement or task completion.
Tasks Tested
Assess first impressions
Explore available services
Start a booking
Locate and view the gallery
Participants
6 total Users: varying in car maintenance habits from frequent DIY cleaners to luxury service users
Cameron, Brian, Kelly, Pete, Lauren, and Will
I conducted tests via Google Meets & email questionaires
Participants explored and completed tasks on my prototype
Metrics & Goals vs. Results
| Category | Metric | Goal | Actual Result | Outcome |
|---|---|---|---|---|
| First Impressions | % of users who correctly identify the service within 5 seconds | 90%+ | 100% (All users said "car detailing" or similar) | ✅ Exceeded |
| Booking Flow | % of users able to start a booking without asking for help | 95%+ | 100% (All users booked easily and intuitively) | ✅ Exceeded |
| Pricing Visibility | % of users who can accurately locate pricing during first try | 100% | ~83% (Most users wanted even more upfront pricing) | ⚠️ Needs Iteration |
| Trust in Service | Average confidence rating from users (1–5 scale) | 4.5/5 or higher | 5/5 (All users said "very confident" or "confident") | ✅ Exceeded |
| Gallery Effectiveness | % of users who mention gallery as a trust factor | 80%+ | 100% (Every user praised the gallery and imagery) | ✅ Exceeded |
| Booking Completion Time | Time taken to complete a booking | Under 2 minutes | Under 2 minutes (All users completed quickly) | ✅ Met |
| User Satisfaction | Net Promoter Score (NPS) estimate from qualitative feedback | 8/10 or higher | ~9.5/10 (Based on quotes and overall positive comments) | ✅ Exceeded |
Key Findings
What Worked
Mobile Detailing Strongly Resonated: Multiple users said they'd be more likely to book if the service came to them—especially busy or convenience-minded users.
Premium Experience Expectations Are Clear: Participants knew what “premium” meant to them (e.g., hand wash, ceramic coating, full interior/exterior care).
Online Booking is a Must: Nearly all users called out online scheduling as an expected feature—not a bonus.
Trust Through Visuals and Quality: Users want to see proof—quality photos, certifications, or branded product use increase confidence.
Strengths to Double Down On
Mobile-first Convenience Positioning: Emphasize how the service fits into users’ lives—home visits, zero wait time, flexible scheduling.
Premium Add-ons & Visual Storytelling: Highlight ceramic coating, hand waxing, and before/after galleries to showcase quality and care.
Loyalty and Retention Programs: Build in perks like “half-off next detail,” monthly offers, or referral bonuses to turn first-time users into repeat clients.
Trust Signals Everywhere: Double down on visuals, certifications, reviews, and clean UI to show professionalism from first click.
What still needs iterations
Pricing Perception is a Major Barrier: Even users interested in premium service said pricing transparency and value are critical for trust and conversion.
Disengaged Users Need More Incentives: For low-interest car owners, detailing needs to be bundled, automated, or frictionless to even be considered.
Iterations Phase
| Visual & Structural Updates | |
| Homepage Reflow | Navigation elements and hero section realigned, improved hierarchy and mobile responsiveness. Card layout refined with cleaner spacing. |
| Gallery Integration | Before/after gallery embedded earlier, carousel interface with interactive previews. Thumbnails display under service descriptions. |
| Pricing Details | Service cards include visible pricing and duration estimates. Quick summary line added to service descriptions. |
| 🧠 Interaction & Flow Enhancements | |
| CTAs | Booking buttons labeled "Schedule Now," "View Availability," or "Get Estimate." Quick links added between sections. |
| Trust Signals | Testimonials and certifications placed beneath service listings. Star ratings overlaid on package details. |
| 🚀 Added Features & UX Touches | |
| Booking Bar | Persistent bottom bar (mobile) and header bar (desktop) with scheduling options. |
| Service Explanations | Hover/tap "i" icons for quick service explanations. Enhanced loading & micro-interactions added. |
| 📊 New Components | |
| Pricing Comparison | Mid-page grid comparing packages (Basic, Mid, Premium) with details. |
| Availability Preview | Simplified widget showing next open slots in booking flow. |
| ✔️ Summary of Improvements | |
| Clarity & Transparency | Pricing, time estimates, and trust elements visible at key moments. |
| Flow & Navigation | Anchors, modals, and micro-interactions support faster task completion. |
| Trust & Visual Appeal | Earlier gallery placement, testimonial integration, and visual polish. |
Old Version
New Version
Old Version
New Version
Reflections
Taking a Look Back at My Work:
This project helped me uncover deeper insights about how users perceive value in a premium service like auto detailing—especially how much of that value depends on trust, clarity, and convenience. Through interviews, surveys, and usability testing, I learned that even small interface decisions—like where pricing appears or how a booking button is labeled—can dramatically influence whether users feel confident enough to take action.
Designing for responsive behavior across desktop and mobile taught me to consider not just layout shifts, but user intent across devices. Mobile users expect speed and minimal effort—quick booking, persistent CTAs, and touch-friendly interactions. On desktop, users lingered more, exploring galleries, testimonials, and service comparisons in greater depth. Optimizing both flows helped me create a seamless, adaptable experience regardless of screen size.
Above all, this project made me better at prioritizing features based on real user feedback. I learned to strip away unnecessary assumptions, iterate with purpose, and balance user needs with business goals—while still delivering a polished, high-conversion experience.
The Next Steps:
Integrate Real-Time Booking Availability
Build Loyalty & Referral Incentives
Prototype an Admin Dashboard or CRM Concept