Makerweergave
Indelingsoverzicht
De Makerweergave is een bewerkingsomgeving met drie panelen die je opent door te dubbelklikken op een groep in het Componentgebied. Het biedt een blokkenlijst links, een code-editor in het midden en een live voorvertoning rechts, met een AI-promptvak onderaan.
Blokkenlijstpaneel
Het linkerpaneel toont alle blokken in de huidige groep. Elk blok toont een kaartvoorbeeld met de bloknaam en een genummerde bestandslijst eronder. Gebruik de werkbalk bovenaan om terug te navigeren, te schakelen tussen lijst- en gesplitste weergave, of klik op de +-knop om een nieuw blok toe te voegen.
Code-editor
Het middelste paneel is een code-editor met tabbladen waar je blokinhoud schrijft en bewerkt. Tabbladen zijn georganiseerd op bestandstype:
Tekst
Schrijf documentatie, markdown of platte tekst voor het blok.
HTML
Bewerk de HTML-structuur van je component.
CSS
Voeg stijlen toe voor je component.
JavaScript
Voeg interactiviteit en logica toe aan je component.
Live voorvertoning
Het rechterpaneel rendert een live preview van je component. Naarmate je HTML, CSS en JavaScript toevoegt in de editor, wordt de preview bijgewerkt om het gecompileerde resultaat te tonen. Je kunt ook bestanden slepen en neerzetten of inhoud plakken (Ctrl+V) direct in het previewgebied om ze aan het blok toe te voegen. Gebruik het oogpictogram om de preview in/uit te schakelen en de BG-schakelaar om de achtergrond van de preview te wijzigen.
AI-promptvak
De onderste balk is het AI-promptveld. Gebruik het om wijzigingen te beschrijven en de AI de inhoud van je blok te laten genereren of aanpassen. Het bevat een modelselector, een tekstinvoerveld, spraak- en emoji-invoer, en een Genereren-knop. Twee modustoggles — A en V — schakelen tussen de Directe AI-modus en de Variatiemodus.
AI-generatiecategorieën
De AI-modelselector toont generatiecategorieën die bepalen welk soort inhoud AI produceert:
Tekstgeneratie
Genereer of bewerk tekstgebaseerde inhoud zoals code, documentatie en opmaak.
Beeldgeneratie
Maak afbeeldingen van tekstprompts of bewerk bestaande afbeeldingen met AI (tekst-naar-afbeelding en afbeelding-naar-afbeelding).
Videogeneratie
Genereer video's van tekstbeschrijvingen of animeer stilstaande beelden tot video (tekst-naar-video en afbeelding-naar-video).
Directe AI-modus (A)
Wanneer de A-toggle actief is, brengt de AI directe wijzigingen aan in je component ter plekke. De veldtekst toont “Beschrijf de wijzigingen die je op je component wilt toepassen” en een badge geeft aan welk bestand wordt gewijzigd (bijvoorbeeld “Zal wijzigen: tekst”). Deze modus is ideaal voor snelle, specifieke bewerkingen aan het momenteel geselecteerde bestand.
Variatiemodus (V)
Wanneer de V-toggle actief is, genereert de AI meerdere variaties van je component in plaats van het ter plekke te bewerken. De veldtekst verandert naar “Beschrijf de variaties die je wilt genereren” en er verschijnt een teller met − / +-knoppen zodat je kunt kiezen hoeveel variaties je wilt maken. Gegenereerde variaties verschijnen in een speciaal paneel waar je ze kunt bekijken en je voorkeursversies aan de groep kunt toevoegen.