Hoi Jamal, hier een update van onze kant, een soort 'overdracht' van Conductor aan Kimi voor de restyling van de Haarvisie homepage. Zie het als een aanvulling op het verslag van 25 juli, want sindsdien is er een hoop gebeurd, met wel 82 nieuwe aanpassingen aan de code. Dit praat je helemaal bij over de meest recente stand van zaken en wat er allemaal veranderd is.

De kern van de zaak is dat we nu op homepage-versie 6.2 zitten en het afspraakformulier op 5.15. Er zijn belangrijke stappen gezet. Denk aan de creaties-galerij die nu met echte video’s werkt en de reviews die jij zelf hebt uitgezocht en die nu op de site staan. Het afspraakformulier heeft ook een compleet nieuwe look en gebruikerservaring gekregen. Er zijn ook een paar punten die nog openstaan, zoals de Instagram-feed en het onduidelijke concept van ‘vlogs’. We hebben ook een belangrijke beslissing genomen over de ‘Awards’-sectie: die is van een ‘trofeeënkast’ veranderd in een ‘bescheiden belofte’-sectie, omdat we niet ‘trotserig’ wilden overkomen, zoals jij aangaf. En een cruciaal punt voor Kimi: het oude design-brief document in de repo is echt verouderd en moet genegeerd worden; de live site en de git-log zijn de enige waarheden. Ook belangrijk: de homepage en het afspraakformulier zijn twee technisch gescheiden systemen die los van elkaar worden bijgewerkt.

Laten we de openstaande punten van het vorige verslag er even bij pakken om te zien hoe ver we zijn:

* **De creaties-galerij:** Deze is nu helemaal klaar. In plaats van een statische galerij, zien we nu drie dynamische video's van echte klanttransformaties. Heel visueel en impactvol. * **De Reels-strip:** Dit is nog steeds een open punt. De handmatige clips staan er nog, en het probleem met het integreren van een echte Instagram-feed – ofwel via een betaalde widget, of via een Meta-app-review – is helaas nog niet opgelost. Dit is iets waar jij, Jamal, uiteindelijk een keuze in zult moeten maken. * **Reviews:** Helemaal afgerond. Na meerdere aanpassingen staan er nu vijf recente Google-reviews van juli 2026, verspreid over verschillende locaties en medewerkers. En heel belangrijk: de reviews die jou direct noemen, zijn eruit gefilterd, precies zoals je vroeg. * **Blogs en ‘vlogs’:** De blogsectie toont nu de top-10 meest gelezen blogs, gebaseerd op Google Analytics-data. De oorspronkelijke vraag om “laatste 10 blogs én laatste 10 vlogs” te tonen, hebben we dus iets anders ingevuld. En wat je precies bedoelt met ‘vlogs’ is nog steeds niet duidelijk. Kimi zal jou hier expliciet naar moeten vragen voordat ze hier verder mee aan de slag gaat. * **Het afspraakformulier:** Dit is een groot succes! Het is volledig opnieuw ontworpen qua look en gebruikerservaring, en het draait nu als een apart ontwikkelpakket. * **Het herschrijfplan voor blogs/vlogs:** Kimi heeft de blogs 11 tot en met 20 herschreven en toegevoegd, en later ook de eerste 10 blogs van tekst voorzien. Een apart, formeel "kwaliteitsplan" voor alle content is er niet gekomen, maar de herschrijf-sessies hebben dit in de praktijk opgelost.

Naast deze punten zijn er ook een aantal nieuwe dingen aangepakt sinds het vorige verslag:

* **De Awards-sectie:** Deze is tweemaal herzien. Eerst kreeg het SEO-teksten en een groter design, maar nadat jij het ‘trotserig’ vond, Jamal, hebben we het omgebouwd naar een bescheiden belofte-sectie met kleine, gelijkwaardige medailles. De tekstleesbaarheid is ook nog twee keer bijgesteld. * **Wella-badges:** Twee nieuwe Wella-badges, ‘TrendVision’ en ‘Color Masters’, zijn toegevoegd en precies in de rosé-stijl van Haarvisie gekalibreerd. * **Cookiebanner:** Er is nu een cookiebanner geïmplementeerd, samen met Consent Mode v2 en een privacyverklaring. Dit stond niet in het oorspronkelijke ontwerp, maar is natuurlijk essentieel. * **‘Kies je kapsel’-navlink:** Deze link werkt nu echt en verwijst naar de live Kapsel Kiezer op haartips.nl. Voorheen was dit een dode link. * **Beeldregel-bug (v6.2):** Een cruciale bug is hersteld. Het kader van de creatievideo’s stond op een 4:5-verhouding, terwijl de clips 9:16 zijn. Dit zorgde ervoor dat 30% van elk beeld werd afgesneden, precies tegen de ‘harde regel’ in van ‘nooit bijsnijden’. Dit is nu opgelost door ‘contain’ te gebruiken in plaats van ‘cover’. Dit soort kader-aspect-ratio’s moeten altijd expliciet gecontroleerd worden bij nieuwe media. * **COLOR-hero-woord:** Dit visuele element heeft zes fix-rondes gehad om de basislijn, overlap en spatiëring te perfectioneren. Het is nu stabiel en werkt als een ‘haar-letter alfabet’ met 26 losse letters in plaats van één plaatje.

Nu wat betreft de technische kant en hoe alles wordt uitgerold. De live preview van de homepage is gecheckt en werkt. De code staat op de MacBook in de `haarvisie-nieuw` repository, op de `main`-branch, met die 82 nieuwe commits. De deployment werkt nu via een GitHub Actions CI-mechanisme: elke keer als er iets naar `main` wordt gepusht, worden de tests en de build automatisch gedraaid. Dit betekent dat een simpele commit en push voldoende is, zolang de CI ‘groen’ is. Maar let op: als de CI faalt (bijvoorbeeld door een typecheck-fout), wordt er niets gedeployed, en dat gebeurt stilzwijgend. Het is dus heel belangrijk om na elke push altijd even de preview-URL of de Actions-run te controleren.

Zoals gezegd, het afspraakformulier draait apart op `nieuwafspraakformulier.haartips.nl`, en dit is dus niet dezelfde plek als de homepage-preview. De backend voor het formulier is stabiel en werkt via Render, Supabase, GHL, WhatsApp en mail.

Nogmaals een waarschuwing voor Kimi: het bestand `design-brief.md` in de repository is *verouderd*. Het beschrijft nog het allereerste, donkere concept en is al lang niet meer bijgewerkt. Kimi moet zich baseren op de live preview en de git-log, en niet op dit bestand.

Wat betreft belangrijke beslissingen die we sinds 25 juli hebben genomen en die nu als designprincipes gelden:

* De kleurstelling van **champagne rosé met crème en brons** blijft gehandhaafd. * De **Awards-sectie** is dus van ‘trofeeënkast’ naar ‘bescheiden belofte’ gegaan, gebaseerd op jouw feedback, Jamal. Dit is nu een leidend designprincipe geworden: niet opscheppen, maar laten zien. * **Reviews** zullen nooit reviews tonen die jou persoonlijk noemen, om de focus op het team te houden. * **Emoji-iconen** in het afspraakformulier zijn eruit, vervangen door merk-icoontjes, omdat jij ze “afschuwelijk” vond. De regel is nu: geen emoji in de klantgerichte UI van Haarvisie, altijd eigen iconografie gebruiken. * De behandelopties **“Black hair” en “Opsteken”** zijn uit het formulier gehaald. Deze moeten niet zonder navraag worden teruggezet. * Het afspraakformulier heeft nu een **taalkeuze** voor Nederlands, Engels en Spaans. Dit was een nieuwe toevoeging en stond niet in het oorspronkelijke plan.

Er is ook een overzicht van belangrijke bestanden en assets, zoals de homepage-repository, de blog-data, het afspraakformulier-ontwikkelpakket, de bronbestanden voor de award-badges en de algemene ‘Merk-Hub’ voor logo’s, fonts en kleuren. Bij twijfel over een asset, is de Merk-Hub de plek waar Kimi moet kijken of Conductor om advies moet vragen.

Dan de openstaande punten en valkuilen, aanvullend op de 'harde regels' uit het oude verslag:

1. **De Reels-strip is nog geen echte Instagram-feed.** Zoals gezegd, het knelpunt met het betaalde widget of de Meta-review is er nog steeds. Dit vereist een beslissing met jou, Jamal. 2. **“Vlogs” is nog steeds niet gedefinieerd.** Kimi moet jou hier expliciet naar vragen. 3. **`design-brief.md` is een valse vriend.** Het leidt tot verkeerde aannames, zoals een donker thema, als je het gebruikt zonder de live site te controleren. 4. **De oude bestandsverdeling-afspraak is achterhaald.** Die afspraak dat `index.tsx` en `styles.css` van Kimi waren en de afspraak-bestanden van Conductor, vervalt nu. Kimi beheert en deployt voortaan alles zelf voor de restyling. 5. **De CI faalt stil als je het niet checkt.** Typecheck- of build-fouten in de CI blokkeren de deploy zonder dat je het direct ziet, tenzij je de Actions-run of de live preview controleert. Verifieer dit na elke push. 6. **Er zijn twee aparte deploys.** De homepage-preview en het afspraakformulier zijn technisch gescheiden systemen met eigen repositories en deploys. Een wijziging in het ene verschijnt niet automatisch in het andere.

Voor Kimi, wat betreft toegangen: ze heeft een Higgsfield websiterepoaccess-token nodig voor de website-ID. Dit token is tijdelijk en moet per keer dat ze gaat klonen of pushen opnieuw worden aangevraagd via de Higgsfield MCP-tools. Als ze daar geen toegang toe heeft, regelt Conductor het. SSH-toegang tot de VPS is nodig als ze zelf verslagen wil publiceren. Er is geen extra toegang nodig voor de afspraakformulier-backend, aangezien die stabiel en werkend is. En `haarvisie.nl` zelf blijft natuurlijk off-limits zonder Jamals expliciete toestemming per pagina.

Jamal, dit verslag is dus een aanvulling op het eerdere handoff-verslag. Mocht er ergens tegenstrijdige informatie zijn, dan is dit verslag van 19 augustus de meest recente en correcte stand van zaken.

Dat was het voor nu! Kimi, heel veel succes met de verdere afhandeling van deze restyling. We hebben er vertrouwen in!