In 30 minuten een landingpage-pijplijn gebouwd met MCPs

In 30 minuten een landingpage-pijplijn gebouwd met MCPs

De landing page hoefde niet goed te zijn. Ik was een workflow aan het testen — vier tools aan elkaar knopen die ik nog nooit in combinatie had gebruikt — en verwachtte volledig dat de output een ruwe opzet zou zijn waar ik de komende drie uur aan zou moeten schaven. In plaats daarvan keek ik naar een Tailwind-gebaseerde landing page met samenhangende typografie, een geanimeerde hero-sectie, trust badges en een lead magnet-aanmeldformulier. Alles was gedeployed. Alles werd getrackt. En de eerste A/B-test draaide al op de headline.

Tweeëndertig minuten waren verstreken sinds ik het initiële businessidee in Idea Browser had getypt.

Laat ik iets duidelijk maken voordat we verder gaan: de snelheid is niet het verhaal. Iedereen kan snel een landing page online zetten als kwaliteit er niet toe doet. Het verhaal hier is dat de hele pipeline — ideevalidatie, competitieve positionering, lead magnet-creatie, landing page design, deployment, analytics setup en live experimentatie — liep via een verbonden keten van MCP’s in Claude Code. Geen Figma-naar-developer overdracht. Geen analytics snippets handmatig in HTML plakken. Geen zes browsertabs open om verschillende delen van de funnel te beheren.

Dit is wat er gebeurt als je stopt met Claude Code te zien als een coding tool en het gaat behandelen als een orkestratielaag voor je hele go-to-market stack.

Ik neem je mee door elke stap, elke tool, en de specifieke momenten waarop alles klikte (en de delen waar ik moest worstelen met de setup). Maar de implicatie die me lang na het bouwen is bijgebleven, gaat verder dan landing pages — het gaat over wat de terminal wordt wanneer MCP’s hem veranderen in een universeel controlepaneel voor bedrijfsvoering.

Het idee dat begon in een Markdown-bestand

Hier is het zakelijke concept dat ik als testcase gebruikte: een AI-sparringpartner voor B2B-salesmedewerkers. Zie het als een oefenarena waar verkopers bezwaren kunnen oefenen met een AI die de rol van een sceptische koper speelt. De AI past zich in realtime aan, gooit onverwachte wendingen in het gesprek, en beoordeelt de antwoorden van de verkoper op overtuigingskracht, helderheid en zelfvertrouwen.

Goed idee? Misschien. Het ging er niet om of dit specifieke product zou werken. Het ging erom of ik elk zakelijk idee door een volledige pipeline kon halen — van vaag concept tot geoptimaliseerde landingspagina met live tracking — zonder de terminal te verlaten.

De eerste tool in de keten was Idea Browser, gekoppeld aan Claude Code via MCP.

Idea Browser is geen notitie-app. Het is een idee-managementsysteem dat gestructureerde context opslaat rondom zakelijke concepten — klantprofielen, concurrentiepositionering, aanboddefinities, marktveronderstellingen — en die context in de loop van de tijd laat evolueren. Wanneer je het via MCP aan Claude Code koppelt, kan je AI-agent direct lezen en schrijven in die ideebestanden, wat betekent dat de agent een blijvend geheugen heeft over je zakelijke concept, sessie-overstijgend.

Ik maakte een nieuw ideebestand aan voor de AI Sales Sparring Partner en deelde het op in vier secties: de doelgroep (B2B SaaS-sales teams met 10-50 verkopers), het kernprobleem (verkopers oefenen op echte prospects en verliezen deals tijdens het leerproces), de positionering (goedkoper en altijd beschikbaar in vergelijking met menselijke rollenspelcoaches, realistischer dan statische flashcard-apps), en het eerste aanbod (freemium met een team-abonnement van $49/maand).

Dit kostte ongeveer zes minuten. Niet omdat de tool traag was, maar omdat ik daadwerkelijk nadacht over de positionering — en dat is precies het onderdeel dat de meeste mensen overslaan als ze enthousiast zijn om snel te bouwen.

Wat de meeste mensen missen aan idee-capturetools, is dat de waarde niet zit in het vastleggen zelf. Het zit in wat downstream mogelijk wordt wanneer elke andere tool in je pipeline die gestructureerde context kan raadplegen. Toen ik Claude Code later vroeg om landingspagina-copy te schrijven, begon het niet met een leeg prompt. Het haalde het klantprofiel, de positioneringsstatement en de concurrentiehoeken direct uit het Idea Browser-bestand. De copy was bij de eerste poging al scherper omdat de context er al was.

Dat is de eerste les: de kwaliteit van je landingspagina wordt bepaald voordat er ook maar één pixel is ontworpen. Het wordt bepaald door hoe duidelijk je hebt gedefinieerd tot wie je je richt en wat je ze belooft.

Van Idee tot Lead Magnet in Acht Minuten

Voordat ik de landingspagina bouwde, had ik iets nodig om erop aan te bieden. Een landingspagina zonder lead magnet is slechts een reclamebord — mooi om te zien, maar waardeloos voor conversie.

Ik gebruikte een Claude Code-skill om een lead magnet PDF te genereren: "Vijf Bezwaren Die Freight Software Deals Doden (En Hoe Topverkopers Elk Bezwaartype Aanpakken)." De skill haalde context uit het Idea Browser-bestand — specifiek het klantprofiel en de probleemstelling — en produceerde een PDF van tien pagina’s met specifieke frameworks voor het beantwoorden van bezwaren, e-mailtemplates voor follow-up na elk type bezwaar, en een beoordelingsrubriek waarmee verkopers hun eigen prestaties konden evalueren.

Was het een meesterwerk qua contentdesign? Nee. De lay-out was basic. De opmaak kon beter. Maar de inhoud was sterk omdat de onderliggende context solide was. Het design kon ik later nog oppoetsen. Wat telde, was dat ik een tastbaar asset had voordat de landingspagina live ging.

Dit is waar de pipeline-aanpak loont op een manier die je met een sequentiële workflow nooit bereikt. Waar een traditionele workflow me zou laten schakelen tussen een tekstverwerker, een designtool en mijn code-editor, hield de MCP-gekoppelde workflow alles in één sessie. Claude Code genereerde de PDF, sloeg deze op in de projectmap, en ging direct door naar de volgende stap zonder dat ik iets hoefde te uploaden, downloaden of tussen tools te verplaatsen.

Acht minuten voor een lead magnet waar ik handmatig twee uur over zou doen — en waarschijnlijk nog een uur extra om het door overdenken alleen maar slechter te maken.

De landingspagina was de volgende stap. En hier veranderde Paper mijn mentale model van hoe design en code zouden moeten samenwerken.

Waarom Paper Mij De Design-to-Code Aanpak Liet Herzien

Ik gebruik Figma al jaren. Ik heb geschreven over hoe Claude Code en Figma’s MCP-integratie mijn UI-workflow hebben getransformeerd. Maar Paper neemt een andere plek in binnen de toolchain, en dat onderscheid begrijpen is belangrijk.

Figma is een designtool die nu een brug slaat naar code. Paper is vanaf de basis een hybride van design en code, gebouwd voor agentmanipulatie. Het verschil klinkt subtiel. Dat is het niet.

Het canvas van Paper draait native op HTML en CSS. Wanneer Claude Code via MCP verbinding maakt met Paper, vertaalt het geen designs naar code — het leest en schrijft dezelfde taal als het canvas zelf. Die bidirectionele synchronisatie betekent dat ik een component kon ontwerpen in de visuele editor van Paper, vervolgens Claude Code het programmatisch kon laten aanpassen, en daarna het visuele resultaat weer in Paper kon bijstellen — allemaal zonder export/import-stap of formaatconversie.

Zo zag het bouwen van de landingspagina er in de praktijk uit:

Ik begon met het aanleveren van een referentieafbeelding van een SaaS-landingspagina die ik bewonderde — een strak ontwerp, sterke visuele hiërarchie, veel witruimte. De AI van Paper haalde de belangrijkste designelementen eruit: het kleurenpalet (een navy-tot-slate verloop met elektrische blauwe accenten), de typografieschaal (48px hero heading, 20px subheading, 16px body), het spacingschema (80px sectie-padding, 24px component-gaps), en het algemene layoutpatroon (single-column hero, two-column features grid, testimonial carousel, CTA-blok).

Deze extractie leverde in feite een micro-designsysteem op — een set van constraints waar elk volgend component aan moest voldoen. Ik hoefde die beslissingen niet handmatig te nemen. De referentieafbeelding deed dat voor mij, en Paper legde ze vast in herbruikbare tokens.

Daarna begon ik componenten toe te voegen. Paper koppelt aan Tailwind-componentbibliotheken — ik gebruikte er een genaamd Tail Arc, een indie-ontwikkelde bibliotheek met strakke, kant-en-klare blokken en illustraties. De hero-sectie, feature-cards, prijstabel en footer kwamen allemaal uit vooraf gebouwde componenten die ik op het canvas sleepte en vervolgens aanpaste via zowel de visuele tools van Paper als de MCP-commando’s van Claude Code.

De magie zit in de stap van het aanpassen. Ik paste bijvoorbeeld de lettergrootte van een heading visueel aan in Paper, en Claude Code zag die wijziging direct via de MCP-verbinding. Vervolgens vroeg ik Claude Code om de teksten in alle secties te updaten met de messaging uit mijn Idea Browser-bestand, en Paper voerde die tekstwijzigingen direct door. Geen build-stap. Geen refresh. Geen hoop dat de gedeployde versie overeenkomt met wat ik ontworpen had.

De gratis versie van Paper bevat 100 MCP-calls per week. Voor het bouwen van één landingspagina gebruikte ik er ongeveer 40. De Pro-versie kost $20 per maand en biedt een miljoen calls per week, wat overkill is voor iedereen die geen agency runt — maar de gratis versie is echt bruikbaar voor individuele projecten.

Eén ding om te benadrukken: Paper is geen Figma. Als je een complexe multi-screen applicatie bouwt met design system governance en samenwerking tussen twintig designers, is Figma nog steeds de betere tool. Paper blinkt uit in een specifiek scenario — wanneer je zo snel mogelijk van concept naar live pagina wilt gaan, met een AI-agent die het meeste zware werk doet. Het is de juiste tool voor landingspagina’s, marketingwebsites en single-page applicaties. Niet voor enterprise design systems.

Dat onderscheid kostte me ongeveer twintig minuten frustratie in het begin, toen ik Paper probeerde te gebruiken zoals ik Figma gebruik. Toen ik mijn denkkader eenmaal had aangepast, viel alles op zijn plek.

De Bouw: Van Canvas tot Gepubliceerde Pagina

Met het ontwerp vastgelegd in Paper, liet ik Claude Code de productiecode genereren. Deze stap was op de best mogelijke manier anticlimactisch — omdat de canvas van Paper al HTML en CSS is, leek de “generatie” meer op een export met optimalisatie dan op een vertaling.

Claude Code haalde de lay-out uit Paper, herstructureerde de HTML voor semantische correctheid (de visuele editor van Paper nestelt soms divs op manieren die visueel werken, maar niet ideaal zijn voor toegankelijkheid), voegde responsieve breakpoints toe en koppelde het lead magnet-formulier aan een eenvoudige serverloze functie.

De subtiele animaties waren het vermelden waard. De referentieafbeelding die ik eerder aan Paper had gevoed, had een fade-in-effect op de hero-sectie, en de designextractie legde dat vast als een stijlopmerking. Claude Code implementeerde het als een CSS-animatie met een ease-in van 0,3 seconde — subtiel genoeg dat bezoekers de verfijning opmerken zonder erdoor afgeleid te worden. Ik voegde een lichte parallax-scroll toe op de feature cards en een hover-state op de CTA-knop die het kleurverloop 10 graden verschuift.

Deze micro-interacties kostten me via Claude Code misschien drie minuten om te implementeren. Als ik de CSS handmatig had geschreven en getest op verschillende viewports, was ik er dertig minuten aan kwijt geweest. De tijdswinst draaide niet alleen om snelheid — het betekende dat ik deze details daadwerkelijk toevoegde in plaats van ze uit de scope te schrappen omdat “we het later wel oppoetsen”.

De deployment verliep via Vercel. Claude Code verzorgde de git push, de Vercel-integratie pikte het op, en de pagina stond binnen negentig seconden live. Totale tijd van de eerste interactie met de Paper-canvas tot een live gepubliceerde URL: ongeveer achttien minuten.

Maar een live pagina zonder tracking is slechts een prestigeproject. Het echte werk moest nog beginnen.

Humblytics: Waar de Landingspagina Geen Gok Meer Is

Dit is het deel dat de meeste “Ik bouwde een landingspagina met AI”-verhalen overslaan. Ze laten je de mooie pagina zien, geven je een deploy-link en noemen het af. Maar een landingspagina is geen product. Het is een hypothese. En hypotheses moeten getest worden.

Humblytics is de tool die mijn landingspagina veranderde van een statische gok in een levend experiment.

Voor wie Humblytics nog niet kent: Humblytics is een alles-in-één analytics- en conversie-optimalisatieplatform dat heatmaps, kliktracking, funnel analytics en A/B-testen samenbrengt in één dashboard. Wat het relevant maakt voor deze workflow is de MCP-integratie met Claude Code — waardoor experimenten opzetten, resultaten analyseren en pagina-updates allemaal vanuit de terminal kunnen gebeuren.

Het privacyverhaal is ook belangrijk. Humblytics gebruikt een eenrichtings-hash van IP- en apparaatkenmerken in plaats van cookies. Geen toestemmingsbanners nodig. Volledige GDPR-compliance zonder de modale pop-up die op elk ander analyticsplatform de conversieratio’s om zeep helpt. Vanaf $19/maand vervangt het wat anders losse abonnementen op Google Analytics, Hotjar en een A/B-testtool zouden zijn.

Zo zette ik het eerste experiment op.

Ik vroeg Claude Code om een A/B-test aan te maken op de hero-headline. Variant A was het origineel: “Stop met deals verliezen terwijl je reps leren op echte prospects.” Variant B draaide het perspectief om: “Je beste reps zijn niet als toppers geboren — ze oefenden waar falen veilig was.” Zelfde waardepropositie, andere emotionele trigger. Variant A stuurt op verliesaversie. Variant B op groeimindset.

Via de MCP-integratie configureerde Claude Code het experiment direct in Humblytics — definieerde de varianten, zette de traffic split op 50/50, specificeerde het conversie-event (lead magnet formulier inzending), en stelde een minimale steekproefgrootte van 200 bezoekers in voordat er een winnaar wordt uitgeroepen.

Geen code-deployment nodig. Humblytics wisselt de headline dynamisch op basis van de experimenttoewijzing. Het engineeringteam (in dit geval: ikzelf) hoefde de codebase niet aan te raken om de test te draaien.

Dat is de snelheidswinst die het verschil maakt. Traditioneel A/B-testen vereist dat een developer varianten aanmaakt, deze uitrolt, het testplatform configureert en dan wacht. Met Humblytics via MCP kan de copywriter de test zelf uitvoeren. De experimenteercyclus verkort van dagen naar minuten.

Ik zette ook funnel tracking op — landingspagina bezoek → scroll voorbij hero → lead magnet sectie bereiken → CTA klikken → formulier inzenden. Humblytics volgt elke stap en laat zien waar bezoekers afhaken. Na 48 uur liet mijn funnel een 67% scroll-past-hero rate zien, maar slechts een 12% CTA-clickrate. Dat vertelde me dat het midden van de pagina mensen verloor. De feature-sectie moest beter. De hero was goed.

Wil je liever dat iemand deze hele pipeline bouwt — van ideevalidatie tot uitgerolde landingspagina met analytics — ik neem precies dit soort opdrachten aan. Je kunt zien wat ik gebouwd heb op fiverr.com/s/EgxYmWD.

De Hele Machine Automatiseren

De individuele tools maakten indruk op me. Maar de verbindingen ertussen bliezen me echt omver.

Zo ziet de geautomatiseerde workflow eruit zodra alles gekoppeld is:

Campagnepersonalisatie op schaal. Claude Code maakt verbinding met advertentieplatform-API’s — Google Ads, Meta Ads — en haalt direct campagnedata op. Voor elke campagne genereert het een gepersonaliseerde variant van de landingspagina. Een campagne gericht op enterprise sales directors krijgt andere boodschappen, social proof en prijspositionering dan een campagne voor startup founders. Hetzelfde product. Andere positionering. Alles automatisch gegenereerd op basis van campagneparameters en de kernpositionering die is opgeslagen in Idea Browser.

Geautomatiseerde experimentcycli. Ik heb een cronjob ingesteld die wekelijks draait. Elke maandagochtend controleert Claude Code Humblytics op afgeronde experimenten, implementeert winnende varianten en genereert nieuwe testhypotheses op basis van de funneldata. Het stelt de volgende headline-test voor, de volgende lay-outwijziging of de volgende CTA-variant — allemaal gebaseerd op daadwerkelijke gebruikersdata, niet op onderbuikgevoel.

Feedbackloop van groeidata. Elk experimentresultaat en elke funnelrapportage wordt teruggeschreven naar het Idea Browser-bestand. Na verloop van tijd verandert dat bestand van een statisch businessconcept in een levend groeidocument. Over drie maanden, als ik dit idee opnieuw bekijk, vertelt de context me niet alleen wat ik gepland had — maar ook wat ik geleerd heb. Welke headlines aansloegen. Welke doelgroepsegmenten converteerden. Welke aannames onjuist waren.

Deze feedbackloop is wat een landingspagina onderscheidt van een groeisysteem. De landingspagina is het oppervlak. Het systeem is de intelligentie eronder die het continu verbetert.

Het opzetten van de cronjob kostte ongeveer vijftien minuten. Claude Code genereerde het automatiseringsscript, stelde de planning in, en ik testte het met een dry run. Nu draait het wekelijks zonder mijn tussenkomst. De resultaten verschijnen in Idea Browser, en ik bekijk ze wanneer ik tijd heb. Of ik doe het niet, en het systeem blijft toch optimaliseren.

Wat Deze Workflow Fout Doet (En Wat Het Niet Kan Vervangen)

Ik heb tot nu toe een optimistisch beeld geschetst. Tijd voor het eerlijke deel.

Designsmaak blijft belangrijk. De pipeline kan in dertig minuten een landingspagina genereren, maar "gegenereerd" en "geweldig" zijn verschillende begrippen. De referentieafbeelding die ik aan Paper voerde, deed het meeste werk op het gebied van designkwaliteit. Zonder die input — zonder dat iemand een oordeel velt over wat "goed" is voor dit specifieke publiek — zou de output technisch correct maar emotioneel vlak zijn geweest. AI-tools versnellen de uitvoering. Ze vervangen niet de mens die bepaalt wat het waard is om uit te voeren.

De initiële setup kent hobbels. Het koppelen van vier MCP's, het configureren van API-sleutels, het instellen van Humblytics-tracking en het werkend krijgen van de cronjob kostte me ongeveer twee uur gepruts voordat ik de dertig minuten durende pipeline-run kon doen die ik hierboven beschreef. Die installatietijd is echt, en het is frustrerend als dingen niet in één keer werken. Ik liep tegen een Paper MCP-authenticatieprobleem aan dat me twintig minuten debugging kostte. De Humblytics-integratie vereiste een specifieke API-scope die ik nog niet had ingeschakeld. Dit zijn oplosbare problemen, maar ze zijn niet nul.

A/B-testen heeft verkeer nodig. Ik kan het meest elegante experiment ter wereld opzetten, maar zonder bezoekers zijn het gewoon twee varianten die elkaar in een database aanstaren. Als je test op een gloednieuwe landingspagina zonder bestaand publiek, heb je een verkeersbron nodig — betaalde advertenties, social media, e-maillijst, iets. De pipeline optimaliseert conversie. Hij genereert geen verkeer.

De claim "30 minuten" heeft kanttekeningen. Mijn tweeëndertig minuten gingen uit van een helder zakelijk idee, een referentieontwerp dat ik al had gekozen, en eerdere ervaring met Claude Code en MCP's. Als je dit voor het eerst opzet, reken dan op een halve dag voor de leercurve. De tweede keer zit je onder het uur. Bij de derde of vierde landingspagina haal je die dertig minuten.

Die kanttekeningen zijn reëel. Maar ze veranderen niets aan de fundamentele verschuiving die hier plaatsvindt. De kloof tussen "een idee hebben" en "het testen met echte gebruikers" is zojuist van weken naar uren gekrompen. Die versnelling verandert wat het waard is om te proberen.

De Terminal Verslindt de GUI

Neem even afstand van de specifieke tools. Er gebeurt iets groters.

Elke tool in deze pipeline — Idea Browser, Paper, Humblytics — is via MCP verbonden met Claude Code. De terminal is het bedieningspaneel. Niet een browserdashboard. Niet een desktop-app. De terminal.

Dit is belangrijk vanwege wat het impliceert voor de toekomst van werktools. Traditionele SaaS-producten bieden je een grafische interface om één ding te doen — ontwerpen in Figma, analyseren in Google Analytics, testen in Optimizely. Elke tool heeft zijn eigen login, zijn eigen denkkader, zijn eigen workflow. MCP’s vouwen dit allemaal samen tot één interface, waar een AI-agent het werk over de tools heen orkestreert terwijl jij je richt op beslissingen in plaats van operaties.

Ik heb eerder geschreven over hoe AI-automatiseringen bedrijfsworkflows hervormen, maar deze pipeline bracht dat concept verder dan ik had verwacht. De automatisering doet niet alleen repetitieve taken. Het beheert een strategie — hypotheses testen, resultaten analyseren, veranderingen doorvoeren en nieuwe hypotheses genereren. Dat is geen taakautomatisering. Dat is cognitieve werkautomatisering.

Er circuleert een voorspelling — toegeschreven aan verschillende AI-onderzoekers en herhaald door Gartner — dat in 2030, 20% van de online handel door softwareagents zal worden uitgevoerd. Niet door mensen die door websites klikken. Agents die zelfstandig onderhandelen, aankopen doen en transacties beheren.

Als die voorspelling ook maar enigszins uitkomt, zijn de gevolgen voor landingspagina’s en marketing enorm. Je ontwerpt dan niet alleen pagina’s voor menselijke bezoekers. Je ontwerpt pagina’s die agents kunnen lezen, evalueren en waar ze transacties op kunnen uitvoeren. Het visuele ontwerp wordt misschien minder belangrijk dan de gestructureerde data. De emotionele copy misschien minder belangrijk dan de heldere, parseerbare waardepropositie.

Daar zijn we nog niet. Maar de tools die ik vandaag gebruikte — agents die design canvassen lezen en schrijven, autonoom experimenten uitvoeren, analytics-data ophalen en strategie aanpassen — zijn vroege versies van die toekomst. Het gat tussen “vroege versie” en “dominant paradigma” wordt meestal sneller gedicht dan iemand verwacht.

Je Eerste Pipeline: Wat Je Deze Week Moet Doen

Als je tot hier hebt gelezen, val je waarschijnlijk in één van twee kampen. Of je denkt: "Dit moet ik bouwen," of je denkt: "Dit klinkt als veel opzetwerk voor afnemende meeropbrengst." Beide reacties zijn begrijpelijk. Hier is mijn eerlijke advies voor elk scenario.

Als je regelmatig landingspagina’s bouwt — voor je eigen producten, voor klanten, of om zakelijke ideeën te testen — dan betaalt deze pipeline zichzelf terug bij de tweede keer dat je hem gebruikt. De eerste keer is een leermoment. De tweede keer voel je de versnelling. Begin met Claude Code en Paper, gekoppeld via MCP. Bouw één landingspagina. Voeg Humblytics toe voor de tweede pagina. Voeg Idea Browser en de geautomatiseerde feedbackloop toe voor de derde. Bouw de complexiteit stap voor stap op.

Als je maar één landingspagina per jaar bouwt, is dit waarschijnlijk overkill. Gebruik een template op Webflow of Framer en ga verder met je leven. De waarde van deze pipeline groeit mee met de frequentie van gebruik.

Als je growth marketeer bent of een bureau runt, let dan extra goed op deze stack. De arbitragemogelijkheid hier lijkt op de vroege Facebook Ads in 2013 — de tools zijn krachtig, de concurrentie is er nog niet op ingesteld, en degenen die deze workflow als eerste beheersen, hebben een cumulatief voordeel. Tegen de tijd dat iedereen doorheeft dat terminal-gebaseerde MCP-workflows de snelste route zijn van idee naar geoptimaliseerde pagina, heb jij al vijftig landingspagina’s gelanceerd en de data om te bewijzen wat werkt.

Dit is wat ik deze week zou doen als ik helemaal opnieuw zou beginnen:

1. Zet Claude Code op met Paper MCP (gratis tier — 100 MCP-calls per week is ruim voldoende om te starten)
2. Pak één zakelijk idee waar je al een tijd mee rondloopt en structureer het in een markdown-bestand met klantprofiel, probleem, positionering en aanbod
3. Geef Paper een referentie-afbeelding van een landingspagina die je bewondert
4. Bouw de pagina. Publiceer hem. Probeer hem bij de eerste versie niet tot in perfectie te polijsten.
5. Voeg Humblytics toe ($19/maand) en zet één A/B-test op voor de headline
6. Wacht een week. Bekijk de data. Itereer.

De dertig-minuten-pipeline die ik heb beschreven is het einddoel. Die eerste build is de weg ernaartoe. Zet elke stap apart, en bij de derde iteratie is de terminal niet alleen meer de plek waar je code schrijft — het is waar je je groeimotor aanstuurt.

Waar Dit Heen Gaat

Ik blijf denken aan iets wat Amir zei en wat me is bijgebleven: de kwaliteit van de uitvoering is tegenwoordig slechts het minimale vereiste. De tools maken het bouwen snel. Wat de winnaars onderscheidt, is smaak — het vermogen om naar een gegenereerde landingspagina te kijken en te weten welke 20% je moet behouden, welke 30% je moet aanpassen, en welke 50% je volledig moet weggooien. Snelheid zonder oordeel levert op grote schaal prachtige rommel op.

De pipeline die ik heb gebouwd werkt. De tools zijn echt. De tijdswinst is daadwerkelijk. Maar de persoon achter het toetsenbord — die beslissingen neemt over positionering, kiest welke referentieafbeelding het juiste gevoel vangt, bepaalt welke headline-variant getest wordt — die persoon blijft de bottleneck. En eerlijk? Dat is precies het deel dat ik spannend vind. Het saaie werk is verdwenen. Wat overblijft is het interessante werk: strategie, smaak en beoordelingsvermogen.

Als je nog steeds landingspagina’s bouwt op de oude manier — voor elke stap een andere tool, handmatige overdrachten tussen design en code, analytics als bijzaak — werk je harder dan nodig is. De MCP-gekoppelde pipeline is geen marginale verbetering. Het is een categorieverschuiving in hoe snel je van “wat als” naar “hier zijn de data” kunt gaan.

De volgende landingspagina die ik bouw, kost geen dertig minuten meer. Het zal twintig minuten duren. En die daarna wordt beter, omdat elk experimentresultaat terugvloeit in het systeem en elke iteratie de context rijker maakt. Dat is niet alleen een snellere workflow. Dat is een cumulatief voordeel — en het venster om dit te bouwen voordat iedereen het doorheeft, sluit sneller dan je denkt.

Veelgestelde Vragen

Wat is een MCP in Claude Code?

MCP staat voor Model Context Protocol — een standaard waarmee Claude Code direct verbinding kan maken met externe tools zoals Paper, Humblytics en Idea Browser. Zie het als een universele stekker waarmee je AI-agent kan lezen en schrijven naar andere software zonder API’s of handmatige integratie. Claude Code gebruikt MCP’s om multi-tool workflows te orkestreren vanuit één enkele terminalsessie.

Kan ik gratis een landingspagina bouwen met Claude Code?

Ja, met beperkingen. Claude Code zelf vereist een Anthropic-abonnement, maar de gratis versie van Paper geeft je 100 MCP-calls per week — genoeg voor één of twee landingspagina’s. Humblytics begint bij $19/maand voor analytics en A/B-testen. De totale minimale kosten voor de volledige pipeline liggen rond de $20-40/maand, afhankelijk van je Claude Code-abonnement.

Hoe verhoudt Humblytics zich tot Google Analytics voor landingspagina’s?

Humblytics combineert analytics, heatmaps en A/B-testen in één platform — het vervangt wat anders Google Analytics plus Hotjar plus een aparte testtool zou zijn. Het belangrijkste onderscheid is cookieloze tracking met volledige GDPR-compliance (geen toestemmingsbanners nodig) en directe MCP-integratie met Claude Code voor experimentbeheer vanuit de terminal. Voor optimalisatie van landingspagina’s is het specifieker en sneller op te zetten.

Heb ik designvaardigheden nodig om Paper met Claude Code te gebruiken?

Geen traditionele designvaardigheden, maar wel smaak. Dankzij de MCP-integratie van Paper kan Claude Code de technische uitvoering afhandelen — layout, responsive breakpoints, componenten samenstellen. Jouw taak is het kiezen van het juiste referentiebeeld, beoordelen wat goed oogt voor jouw doelgroep, en weten wanneer de AI-output menselijke verfijning nodig heeft. De tool verlaagt de technische drempel aanzienlijk, maar maakt esthetisch beoordelingsvermogen juist belangrijker.

Wat is de Idea Browser-tool en waarom zou je die gebruiken voor landingspagina’s?

Idea Browser is een idee-managementsysteem dat gestructureerde zakelijke context opslaat — klantprofielen, positionering, concurrentieanalyse — verbonden met Claude Code via MCP. Voor landingspagina’s zit de waarde aan de voorkant: wanneer Claude Code je paginacopy en boodschap schrijft, haalt het direct uit je Idea Browser-contextbestand in plaats van te beginnen met een blanco prompt. Dit levert vanaf de eerste versie specifiekere, strategisch afgestemde copy op en creëert een blijvend overzicht van wat je uit elk experiment hebt geleerd.

Laten We Samenwerken

Wil je AI-systemen bouwen, workflows automatiseren of je technische infrastructuur opschalen? Ik help je graag.

• Fiverr (maatwerk & integraties): fiverr.com/s/EgxYmWD
• Portfolio: mejba.me
• Ramlit Limited (enterprise-oplossingen): ramlit.com
• ColorPark (design & branding): colorpark.io
• xCyberSecurity (beveiligingsdiensten): xcybersecurity.io