function CaseStudyAutofit({ onNavigate }) {
  return React.createElement(window.CaseStudyLayout, {
    onNavigate,
    category: 'Web Design · 2025',
    title: 'ANWB-Autofit',
    tagline: 'Modern web platform for vehicle maintenance and service booking',
    heroImage: '../../assets/case-studies/autofit/hero.png',
    heroPosition: 'center 55%',
    meta: [{ label: 'Role', value: 'UI/UX Designer' }, { label: 'Timeline', value: '8 weeks' }, { label: 'Team', value: '4 members' }],
    about: 'ANWB-AUTOFIT is een webplatform dat autobezitters helpt om eenvoudig voertuiggegevens op te zoeken en onderhoudskosten te berekenen. Het project is uitgevoerd in opdracht van de ANWB en richt zich op het verbeteren van de gebruikerservaring bij het vinden van betrouwbare voertuiginformatie.',
    problem: 'Veel mensen die afhankelijk zijn van hun auto weten niet wanneer of welk onderhoud eraan zit te komen. Dit zorgt voor onzekerheid en stress, vooral bij onverwachte hoge kosten. Ze missen overzicht en kennis. Vaak is er ook weinig ruimte in hun budget om financiële tegenvallers op te vangen. Omdat zij wél hun auto nodig hebben, ontstaat er een kwetsbare situatie waarin kleine problemen uitgroeien tot grote.',
    solution: 'Een intuïtief webplatform dat alle voertuiginformatie centraliseert. Gebruikers kunnen met één kenteken alle relevante gegevens opvragen en direct inzicht krijgen in onderhoudskosten en schaderapportages.',
    features: [
      { title: 'Kenteken Check', desc: 'Voertuiggegevens opzoeken via kenteken, merk of chassisnummer.' },
      { title: 'Kosten Inzicht', desc: 'Maandelijkse onderhoudskosten en wegenbelasting berekenen.' },
      { title: 'Snelle Resultaten', desc: 'Directe toegang tot voertuiggegevens en schaderapportage.' }
    ],
    fonts: [{ label: 'Primary font', value: 'Inter' }],
    colors: [
      { label: 'Primary', hex: '#003DB6' },
      { label: 'Accent', hex: '#F0B504' },
      { label: 'Background', hex: '#E5E5E5' },
      { label: 'Text', hex: '#000000' }
    ],
    research: {
      cards: [
        { title: 'Doelgroep', desc: 'Mensen met een laag tot modaal inkomen die hun auto nodig hebben voor dagelijkse activiteiten. Ze hebben weinig technische kennis over hun auto en kunnen niet zomaar grote uitgaven doen.' },
        { title: 'Randvoorwaarden', desc: 'Kenteken invullen en direct inzicht krijgen in aankomend onderhoud. Stap voor stap hulp met duidelijke iconen en waarschuwingen. Makkelijk doorlinken naar de juiste ANWB How-To video’s.' },
        { title: 'Team idee', desc: 'De layout en stijl van de ANWB aanhouden zodat de gebruiker direct weet waar hij zich bevindt, en de onderdelen duidelijk scheiden met iconen en knoppen. Handig als je met pech langs de weg staat.' }
      ],
      quote: { text: 'Als ik lampjes zie, dan krijg ik wel gelijk stress.', by: 'Respondent, diepte-interview' },
      items: [
        { image: '../../assets/case-studies/autofit/respondent.png', caption: 'Respondentbeschrijving' },
        { image: '../../assets/case-studies/autofit/interview-monteur.png', caption: 'Interview met een monteur' },
        { image: '../../assets/case-studies/autofit/empathy-map.png', caption: 'Empathy map' },
        { image: '../../assets/case-studies/autofit/ronde-1.png', caption: 'Prototyping ronde 1: schetsen' },
        { image: '../../assets/case-studies/autofit/ronde-2.png', caption: 'Prototyping ronde 2: wireframes' },
        { image: '../../assets/case-studies/autofit/ronde-3.png', caption: 'Prototyping ronde 3' }
      ],
      findingsTitle: 'Testresultaten',
      findings: [
        { title: 'Contrast', desc: 'Bij de kentekencheck was het contrast goed, bij hoor/ruik niet. Daar komen meer ANWB-kleuren en gekleurde titels.' },
        { title: 'Typografie', desc: 'Verschillende fonts en groottes zorgden voor verwarring. Eén font voor alles, belangrijke delen dikgedrukt.' },
        { title: 'Structuur', desc: 'De kentekencheck was duidelijk. Hoor/ruik krijgt twee pagina\u2019s of een duidelijkere scheiding.' },
        { title: 'Content', desc: 'Groen voor goede onderdelen op de auto was overbodig. De auto wordt volledig groen, alleen probleemdelen krijgen kleur.' },
        { title: 'Navigatie', desc: 'Eén navigatiescherm had te grote foto\u2019s. Het alternatieve scherm dat testers wel prettig vonden wordt gebruikt.' },
        { title: 'Kleur', desc: 'Bij dashboardlampjes gaven alle kleuren te veel contrast. Minder felle kleuren of een filter.' }
      ]
    },
    prototype: [
      { label: 'Kentekencheck', image: '../../assets/case-studies/autofit/kentekencheck.png', desc: 'Weinig op de pagina zodat de gebruiker niet wordt afgeleid van het doel.' },
      { label: 'Merk kiezen', image: '../../assets/case-studies/autofit/merk-kiezen.png', desc: 'Geen kenteken bij de hand? Kies een automerk uit de lijst.' },
      { label: 'Gegevens invullen', image: '../../assets/case-studies/autofit/gegevens-invullen.png', desc: 'Kenteken, chassis- of KBA-nummer, of handmatig via dropdowns.' },
      { label: 'Resultaat', image: '../../assets/case-studies/autofit/resultaat.png', desc: 'Algemene info ter controle, daarna uitgevoerd onderhoud (rood) en slijtage (oranje).' },
      { label: 'Onderhoud & problemen', image: '../../assets/case-studies/autofit/home.png', desc: 'Vier duidelijke onderdelen om snel naartoe te navigeren.' },
      { label: 'Ik hoor/ruik iets raars', image: '../../assets/case-studies/autofit/hoor-ruik.png', desc: 'Neem een geluid op voor een AI-check, of bekijk veelvoorkomende geuren.' }
    ],
    reflection: 'Ons prototype heeft nu alle delen die de gebruiker zou willen hebben, maar de werking kan nog verbeterd worden. Op sommige pagina’s staat te veel tekst, waardoor de gebruiker in een stressvolle situatie lastig bij zijn oplossing komt. Bij de dashboardlampjes kan een betere zoekfunctie de lange lijst vervangen. Bij het ruikgedeelte mag meer info komen over of je naar de garage moet of kunt doorrijden, en voor de garages willen we een reviewsysteem toevoegen zodat gebruikers kunnen zien of een garage goed is.'
  });
}
window.CaseStudyAutofit = CaseStudyAutofit;