AI Studio in Voluit Suite

AI Studio is een AI-builder in Voluit Suite waarmee je sneller websites, landingspagina’s en andere interactieve ervaringen maakt met prompts in gewone taal. In plaats van alles vanaf nul op te bouwen, beschrijf je wat je wilt maken, gebruik je templates, verwijs je naar een URL of afbeelding, en verfijn je het resultaat met AI. AI Studio is bedoeld om het creëren te versnellen en je projecten overzichtelijk te houden in één aparte werkruimte.

Belangrijk: AI Studio is beschikbaar via Labs. Zet het aan voor je account voordat je het gebruikt.

Wat is AI Studio

AI Studio is een conversational, AI-builder die je helpt om ideeën sneller om te zetten naar werkende digitale ervaringen. Het kan layouts, content, afbeeldingen en multi-page ervaringen genereren op basis van een prompt. Daarna kun je het resultaat verder verfijnen met vervolg-instructies.

AI Studio kan één pagina maken of meerdere gekoppelde secties binnen hetzelfde webproject. Zo kom je sneller bij een goede eerste versie, zonder dat je elk onderdeel handmatig hoeft te bouwen. AI Studio houdt de stijl consistent over de pagina, genereert content op basis van je prompt en het doel van de pagina, en levert een sterke conceptversie die je later kunt aanpassen. Als je geen afbeeldingen aanlevert, kan AI Studio visuals genereren voor hero-secties en ondersteunende onderdelen. Als je wel afbeeldingen uploadt en duidelijk aangeeft dat AI Studio ze moet gebruiken, kan het die visuals in de pagina plaatsen.

AI Studio is niet beperkt tot standaard websites of landingspagina’s. Je kunt het ook gebruiken voor interactieve front-end ervaringen, zoals multi-step surveys, custom kalender-boekingsflows, branded formulieren en andere klantgerichte ervaringen. Daarmee is AI Studio een bredere creatieve werkruimte voor het bouwen van customer experiences, en niet alleen voor statische pagina’s.

AI Studio kan je helpen om:

Een landingspagina te maken met een live URL als inspiratie voor layout en structuur
Een storefront te bouwen met je geüploade branded foto’s
Een dashboard-layout te genereren voor een specifieke business use case
Een afspraakpagina te maken die gekoppeld is aan je kalender
Een website te bouwen met content, visuals en calls-to-action die al klaarstaan

Let op: AI Studio en Agent Studio zijn twee verschillende AI-tools binnen Voluit Suite, bedoeld voor verschillende use cases.

AI Studio is een conversational AI-builder waarmee je snel websites, pagina’s en andere web-assets maakt met prompts. Agent Studio is een visual builder waarmee je AI-agents maakt die op events kunnen reageren, met gebruikers kunnen communiceren en taken kunnen automatiseren.

Belangrijkste voordelen van AI Studio

AI Studio helpt teams om sneller te creëren, makkelijker te experimenteren en met minder handwerk van idee naar livegang te gaan. Het belangrijkste voordeel is dat generatie, iteratie, preview en projectbeheer samenkomen in één werkruimte.

Sneller creëren: start met een prompt in plaats van elke sectie handmatig op te bouwen
Natuurlijk bewerken: vraag aanpassingen in gewone taal en laat AI Studio het project bijwerken
Visueel verfijnen: selecteer elementen in de live preview en pas tekst, afbeeldingen, iconen, spacing, kleuren en layout aan zonder code te bewerken
Flexibele inspiratie: gebruik templates, URLs, screenshots en geüploade afbeeldingen om de output te sturen
Veilig itereren: gebruik version history en restore-opties om veranderingen met meer zekerheid te testen
Ingebouwde organisatie: beheer projecten, mappen, recent werk en starred items op één plek
Route naar live: preview, publiceer en koppel een custom domain als je project klaar is

Waar je AI Studio vindt

AI Studio is beschikbaar in de linker navigatie van je account, nadat je het hebt ingeschakeld in Labs. Zo kun je makkelijk terug naar je projecten en vanuit dezelfde werkruimte verder werken.

Open je Voluit Suite account.
Zet AI Studio aan in Labs als het nog niet aan staat.
Klik in de linker navigatie op AI Studio.

AI Studio home en interface-overzicht

Het AI Studio startscherm is de plek waar je nieuwe projecten begint, eerder werk opent en alles beheert wat je hebt gebouwd. Als je deze indeling kent, kun je sneller schakelen tussen creëren, bewerken en organiseren.

Als je AI Studio opent, zie je:

Een beschrijvingsveld waar je typt wat je wilt bouwen
Tabs zoals Recently Viewed, My Projects, Starred en Templates (Recent bekeken, Mijn projecten, Favorieten en Templates)
Template-opties zoals landingspagina’s, dashboards, ecommerce storefronts, portfolio’s en blogs
Een linker sidebar met toegang tot projecten en recent werk

Vanaf dit startscherm kun je een nieuw project maken, een bestaand project openen, een project hernoemen, een project naar een map verplaatsen of een project verwijderen.

Een project maken in AI Studio

AI Studio biedt meerdere manieren om te starten. Dat helpt, omdat niet iedereen dezelfde input paraat heeft. Of je nu begint met een idee, een template, een website als referentie of een afbeelding, het doel blijft hetzelfde: sneller naar een sterke eerste versie.

Starten met een prompt

Je kunt een prompt typen die beschrijft wat je wilt bouwen. Hoe specifieker je bent, hoe beter AI Studio de eerste versie kan vormen. Naast je prompt kun je ook extra input gebruiken, zoals bestanden, afbeeldingen of een live URL voor inspiratie voor structuur, layout of stijl.

Voorbeelden van prompts:

Maak een website voor een tandartspraktijk met online boeken
Bouw een portfolio-site voor een freelance designer met de bijgevoegde merkafbeeldingen
Bouw een homepage voor een familiecamping en gebruik deze URL als inspiratie voor de navigatiestijl en structuur: https://www.campingvacation.com/
Maak een boutique skincare website en gebruik de bijgevoegde homepage-screenshot als visuele richting voor de hero-sectie, spacing en typografie

AI Studio stelt vervolgvragen als dat nodig is

Je hoeft geen perfecte prompt te schrijven. Als je vraag te breed is, kan AI Studio eerst een paar korte vervolgvragen stellen voordat het gaat bouwen.

Als je bijvoorbeeld zegt “bouw een website voor mijn bedrijf”, kan AI Studio vragen voor wat voor soort bedrijf dit is. Daardoor kun je eerst het doel kiezen, in plaats van zelf te moeten bedenken welke informatie nodig is om te starten.

Starten met een template

Templates zijn handig als je snel wilt beginnen met een herkenbare structuur. AI Studio heeft templates voor veelvoorkomende projecttypes, zoals:

Landing page (Landingspagina)
Dashboard
Ecommerce Storefront (Webshop)
Portfolio

Om te starten met een template, ga je naar de tab Templates en kies je de template die je wilt gebruiken.

Projecten bewerken en verfijnen

AI Studio werkt het beste als conversational builder. Je zit niet vast aan de eerste versie. Na het genereren kun je vervolgprompts geven om wijzigingen te laten doorvoeren, zoals:

Kleuren of styling aanpassen
Headlines of body copy herschrijven
Een contactformulier of boekingssectie toevoegen
Een referentie-URL of screenshot gebruiken voor een specifiek onderdeel

Voorbeelden van vervolgprompts:

Pas de kleuren aan naar lichtgroen in plaats van oranje
Voeg een Contact-pagina toe
Maak de topnavigatie vergelijkbaar met de referentie-URL
Voeg een testimonial-sectie toe die lijkt op de bijgevoegde screenshot
Vervang de hero-afbeelding door de bijgevoegde afbeelding

AI Studio kan ook geüploade afbeeldingen gebruiken in je project. Als je geen afbeeldingen aanlevert, kan het visuals voor je genereren.

Visuele bewerkingen in AI Studio

Met Visual Edits (Visuele bewerkingen) kun je je AI Studio projecten direct aanpassen vanuit de live preview. In plaats van voor elke kleine wijziging een prompt te gebruiken of de Code Editor te openen, selecteer je elementen op de pagina en pas je visueel tekst, knoppen, afbeeldingen, iconen, kleuren, spacing en layout aan.

Om Visual Edit mode te starten, klik je op Visual Edits in het prompt-gebied linksonder in de builder.

Als Visual Edit mode aan staat, wordt de preview interactief. Je kunt tekst dubbelklikken om inline te bewerken, elementen selecteren om contextuele controls te openen, of een prompt toepassen op een geselecteerd element als je AI-hulp wilt bij een gerichte aanpassing.

Voor een volledige walkthrough van features en mogelijkheden, zie artikel onderaan.

Code Editor in AI Studio

AI Studio heeft ook een ingebouwde Code Editor voor wie meer directe controle over projecten wil. Met de Code Editor kun je de onderliggende code handmatig bewerken voor preciezere aanpassingen.

Dit is vooral handig voor gerichte designwijzigingen, functionaliteitsaanpassingen of het verfijnen van AI-output, zonder dat je het hele project opnieuw hoeft te genereren. Je kunt de Code Editor gebruiken om layouts te updaten, styles aan te passen, issues te debuggen en advanced gedrag te finetunen. Wijzigingen zie je direct terug.

Voor een volledige walkthrough van features en mogelijkheden, zie artikel onderaan.

Geavanceerde SEO-ondersteuning in AI Studio

AI Studio bevat ingebouwde SEO tools om je projecten beter vindbaar te maken voor zoekmachines, social platforms en AI-gestuurde zoekervaringen.

Omdat AI Studio sites zijn gebouwd als snelle, moderne web apps, kunnen search engines en crawlers de content soms lastiger lezen. Advanced SEO Support maakt je content toegankelijker en makkelijker te indexeren, zonder dat het uiterlijk of de performance voor bezoekers verandert.

Met SEO ingeschakeld kun je:

Verbeteren hoe je site wordt gecrawld en geïndexeerd door zoekmachines
Zorgen dat gedeelde links de juiste titel, beschrijving en preview image tonen
Een sitemap genereren zodat zoekmachines je pagina’s sneller ontdekken
Je content beter leesbaar maken voor AI search tools zoals ChatGPT en andere assistants

Voor een stappenplan en een volledige uitleg van SEO-features, zie artikel onderaan.

Je project previewen en reviewen

Preview tools helpen je om te checken hoe je project eruitziet voordat je publiceert. Dat is handig om layouts te controleren, meerdere pagina’s te testen en de ervaring op verschillende devices te bekijken.

In de editor kun je:

Wisselen tussen Preview en Code view
Je project bekijken in desktop-, tablet- en mobile-modus
Via de paginadropdown wisselen tussen pagina’s in een multi-page project
De geselecteerde pagina in een nieuw tabblad openen of de preview refreshen na wijzigingen

Versiegeschiedenis

Elke AI-gegenereerde wijziging maakt een versie waar je later op terug kunt gaan. Dit geeft je een veiligere manier om te verfijnen, zonder dat je bang hoeft te zijn om een eerdere versie kwijt te raken.

In de versiegeschiedenis kun je:

Eerdere versies openen
Een eerdere versie previewen
Een versie bookmarken
Terugzetten naar een eerdere versie als dat nodig is

Dit is handig om wijzigingen te vergelijken, een prompt-resultaat terug te draaien, of terug te gaan naar een versie die beter paste bij je doel.

Om version history te openen, klik je op de knop Version History in je project.

Formulieren en kalenderkoppeling

Formulieren en kalenders maken van een AI-gegenereerde pagina een werkende ervaring waarmee je informatie kunt verzamelen of afspraken kunt laten boeken. AI Studio kan de front-end ervaring opbouwen en je vervolgens door de koppelstappen leiden om alles werkend te maken binnen je Voluit Suite account. Zo wordt de output sneller bruikbaar, terwijl jij bepaalt wanneer je formulieren en kalenders koppelt.

Belangrijk: Formulieren en kalenders worden niet automatisch gekoppeld. AI Studio kan de layout maken voor een formulier of boekingssectie, maar je moet AI Studio vragen om dat onderdeel te koppelen voordat er data naar je account wordt gestuurd.

Hoe formulieren werken in AI Studio

AI Studio kan secties en pagina-ervaringen met formulieren maken op basis van een prompt. Bijvoorbeeld: een contactformulier, registratieformulier, feedbackformulier of lead capture sectie. In deze fase is het formulier eerst een front-end layout. Dat betekent dat het formulier al zichtbaar kan zijn op de pagina, terwijl het nog niet gekoppeld is aan je CRM.

Als je wilt dat het formulier inzendingen gaat verzamelen, vraag je AI Studio om het te koppelen of klik je op Connect wanneer dat in de chat wordt gevraagd. Dit start de Connect to CRM flow (Koppelen aan CRM), die wordt gebruikt om:

Contacten aan te maken in je account
Formulierinzendingen vast te leggen
Workflows te ondersteunen via tracking triggers

Na het afronden van die koppelstap kan AI Studio het formulier verbinden met de gekozen setup, zodat inzendingen binnenkomen in je Voluit Suite account.

Voor een volledige walkthrough, zie het artikel onderaan.

Hoe kalenders werken in AI Studio

AI Studio kan ook pagina’s maken die gericht zijn op boeken. Als je vraagt om een afspraakpagina, consultation booking page of discovery call page (afspraakpagina, consult-boekingspagina of kennismakingscall-pagina), kan het een pagina bouwen rondom plannen en een boekingssectie toevoegen.

Om het boekingsgedeelte functioneel te maken, kan AI Studio kalenders detecteren die al bestaan in je account en je vragen welke kalender je wilt koppelen.

Op hoofdlijnen werkt het zo:

AI Studio maakt het boekingsgedeelte op de pagina.
Jij kiest een kalender in je account.
Die kalender wordt gekoppeld aan de pagina.

Je projecten publiceren

Als je je AI Studio project publiceert, krijgt het een live URL zodat je het kunt reviewen, delen en live kunt zetten op je eigen domein. Voluit Suite gebruikt een eenvoudige publish flow: je publiceert eerst naar een preview domain, daarna kun je een custom domain koppelen en bepalen welke URL de primaire URL wordt.

Na het publiceren kun je blijven bewerken. Wijzigingen blijven in draft totdat je opnieuw publiceert. Zo kun je doorontwikkelen zonder dat je live versie meteen verandert.

Als een AI Studio project is gekoppeld aan een domein:

Het project staat in AI Studio onder Sites
De domeinkoppeling is zichtbaar in Domains (Domeinen)
De gepubliceerde pagina is bereikbaar via dat gekoppelde domein

Publiceren naar een preview domain

Publiceren naar een preview domain geeft je een live versie van je AI Studio project voordat je een branded domain koppelt. Dit helpt je om de ervaring te testen, de layout te controleren en te bevestigen dat alles werkt voordat je live gaat op je eigen domein.

Om te publiceren naar een preview domain:

Klik op Publish rechtsboven. Pas de URL aan als dat nodig is, en klik daarna opnieuw op Publish.

Werk het icoon, de naam, de beschrijving en de social image bij. Klik daarna op Apply Changes.

Klik op Publish.

Een custom domain koppelen

Met een custom domain publiceer je je AI Studio project op een branded URL. Je kunt pas een custom domain koppelen nadat je het project eerst naar een preview domain hebt gepubliceerd.

Om een custom domain te koppelen:

Klik op Publish en selecteer Add Custom Domain.

Vul het domein in dat je wilt koppelen.

Als je een apex domain (example.com) of de www-variant (www.example.com) invult, verschijnt er een optie om ook de andere variant toe te voegen en een redirect in te stellen. Het is aanbevolen om zowel je root als je www-domein te koppelen.

Laat deze optie aan staan om beide domeinen in dezelfde setup te koppelen. Zet hem uit als je alleen het domein wilt koppelen dat je hebt ingevuld. Deze optie verschijnt alleen bij apex en www domeinen.

Als het domein al wordt beheerd in Voluit Suite, gaat de setup verder in de flow. Als er conflicterende records worden gevonden, bekijk je de waarschuwing en de betrokken records voordat je op Add Records klikt.

Als het domein niet wordt beheerd in Voluit Suite, voeg je de DNS record(s) toe die worden getoond. Klik daarna op Verify DNS. Als je zowel apex als www koppelt, word je gevraagd om twee records toe te voegen of te verifiëren in dezelfde flow.

Als de setup klaar is, zie je in de AI chat dat het custom domain is gekoppeld. Het gekoppelde domein wordt getoond en je ziet een optie View site.

Een primaire gepubliceerde URL instellen

Met een primaire gepubliceerde URL bepaal je welke live domeinnaam de hoofd-URL is voor je AI Studio project. Andere gekoppelde URLs doen automatisch een 301 redirect naar de primaire URL.

Let op: Als je tijdens het koppelen zowel apex als www hebt gekoppeld, wordt het domein dat je invult als primary (canonical) URL gezien en redirect de andere variant naar deze URL. Als je project al een primary URL heeft, blijft die ongewijzigd.

Om een primaire gepubliceerde URL in te stellen:

Klik op Publish en klik op het drie-puntjes menu naast de URL die je primary wilt maken.

Klik op Set as primary.

Projecten klonen in AI Studio

Met AI Studio kun je een project klonen binnen hetzelfde account of naar een ander account binnen dezelfde agency. Project cloning helpt om succesvolle setups te hergebruiken zonder opnieuw te bouwen.

Bij het klonen kun je:

Een kopie maken binnen hetzelfde account
Een kopie maken naar een ander account in je agency
Het project op root-niveau plaatsen of in een bestaande map
Kiezen of je chat-activiteit en version history van het originele project meeneemt

Volg deze stappen om een project te klonen:

Klik op het three-dot menu bij het project dat je wilt klonen en kies Clone.

In het venster Clone project vul je de nieuwe projectnaam in. Kies het doelaccount en de doelmap, of laat het op root-niveau staan.

Zet Include project history aan of uit. With History neemt chat-activiteit en version history mee. Without History maakt een schone kopie zonder chats of version history.

Klik op Clone.

Inzendingsdata van je project

Als een formulier is gekoppeld, gaan inzendingen naar de CRM-setup van het gekoppelde account, niet naar het AI Studio project zelf. Dat betekent dat de pagina in AI Studio staat, maar dat responses, contacten en submission activity binnenkomen in je Voluit Suite account. Na het koppelen kunnen inzendingen zichtbaar worden onder form submissions als third-party submissions. Ook kunnen ze via external tracking gedrag gebruikt worden in workflow-activiteit.

Je kunt inzendingen bekijken in:

Contacts (Contacten)
Sites > Forms > Submissions > External Forms (Sites > Formulieren > Inzendingen > Externe formulieren)

Hoe workflows koppelen aan formulierinzendingen

Als het formulier is gekoppeld aan CRM tracking, kun je inzendingen gebruiken in workflows via tracking triggers.

De praktische flow is:

Maak de formulierlayout in AI Studio
Koppel het formulier aan CRM tracking
Gebruik in een workflow de trigger "External Tracking Event"
Gebruik het event "Form submission" om de automation te vervolgen
Gebruik de filter "Domain" en of "External Form" en ga verder met je automation actions

Huidige beperkingen en belangrijke aandachtspunten

Het helpt om de huidige grenzen van AI Studio te kennen, zodat verwachtingen duidelijk zijn tijdens de setup. Omdat AI Studio beschikbaar is via Labs, kan gedrag in de tijd veranderen.

Belangrijke aandachtspunten:

AI Studio projecten worden beheerd binnen AI Studio en kunnen niet worden verplaatst naar de standaard Sites- of Funnels-builders.
URL- en image-based recreation moet je zien als inspiratie voor structuur, layout en stijl, en niet als een exacte 1-op-1 kopie.
Formulieren en kalenders hebben vaak koppelstappen nodig voordat ze werken met je Voluit Suite data en planning setup.

Veelgestelde vragen

V: Is AI Studio alleen voor websites en landingspagina’s?

Antwoord: Nee. AI Studio kan ook andere front-end ervaringen maken, zoals multi-step surveys, branded formulieren, booking flows en andere interactieve klantgerichte ervaringen.

V: Wat kost AI Studio?

Antwoord: AI Studio is op dit moment gratis. Pricing kan in de toekomst veranderen.

V: Moet ik een AI Studio project eerst verplaatsen naar Funnels of Websites voordat ik kan publiceren?

Antwoord: Nee. AI Studio projecten kun je direct publiceren vanuit AI Studio. Je kunt meerdere pagina’s bouwen, ze binnen hetzelfde project aan elkaar koppelen, en daarna publiceren en een domein koppelen.

V: Kan ik een AI Studio project verplaatsen of kopiëren naar Funnels of Websites onder Sites?

Antwoord: Nee. AI Studio projecten blijven in AI Studio en kunnen niet worden gekopieerd naar de standaard Funnels- of Websites-builders onder Sites. AI Studio is ontworpen om direct vanuit de eigen werkruimte te publiceren. Je hoeft de output dus niet te verplaatsen naar legacy Funnels of Websites builders.

V: Kan ik mijn project op mobiel previewen voordat ik publiceer?

Antwoord: Ja. AI Studio heeft preview-opties voor desktop, tablet en mobiel, zodat je de layout kunt reviewen voordat je publiceert. Klik op het Computer-icoon bovenin de preview om te wisselen tussen weergaves.