Na een wat schoorvoetend begin maakt kunstmatige intelligentie (AI) de laatste jaren grote sprongen, zowel in het bewerken van bestaand beeld als in het creëren van nieuw materiaal. In dit artikel inventariseren we de stand van zaken en gaan we zelf met wat tools aan de slag.

Wanneer we opgroeien, zijn er twee vaardigheden die we vrijwel automatisch aanleren: het interpreteren van de wereld die we zien om ons heen en het kunnen benoemen ervan. Het is dan ook niet verwonderlijk dat begrijpend kijken en taalbeheersing al decennialang tot de belangrijkste speerpunten behoren bij de ontwikkeling van AI.

Zo’n tien jaar geleden drong deze vorm van AI voorzichtig binnen in het dagelijks leven via apps die gesproken instructies konden begrijpen, teksten konden vertalen en in realtime kunstjes konden uithalen met je gezicht tijdens een videogesprek.

De laatste jaren is de kwaliteit van AI voor beeldmanipulatie dusdanig toegenomen dat het op steeds grotere schaal commercieel wordt toegepast. Veel ontwikkelingen die nu nog experimenteel zijn, zullen die weg spoedig volgen.

We kijken naar de stand van zaken en gaan zelf aan de slag met dé ontwikkeling voor de komende jaren: het maken van beeld op basis van tekst.

01 Fotomanipulatie

Jarenlang moesten we alles zelf doen als het ging om fotobewerking. Vervolgens verschenen voorzichtig handige hulpjes zoals het automatisch optimaliseren van helderheid en belichting, en later de broodnodige assistentie bij het selecteren van objecten met ingewikkelde vormen. Toch waren dat niet meer dan betrekkelijk eenvoudige (wiskundige) trucjes.

In de nieuwste software voor fotobewerking heeft AI ook zijn intrede gedaan. Voor bijvoorbeeld Photoshop gebeurt dat nog enigszins mondjesmaat door middel van bijvoorbeeld slim vergroten (Super Resolution) en om automatisch de scherptediepte van een afbeelding achteraf aan te passen. Een bedrijf als Skylum zet echter volop in op deze nieuwe ontwikkelingen. Vorig jaar bespraken we van deze makers al Luminar AI, dat het onderwerp in foto’s kan herkennen en waarmee je op basis daarvan bijvoorbeeld razendsnel en simpel portretten kunt optimaliseren. Inmiddels is het nieuwste speeltje van Skylum verkrijgbaar onder de naam Luminar Neo. De AI daarin kan automatisch stof en krassen verwijderen, en hoogspanningsleidingen uitgummen. Belangrijker is echter dat het voor- en achtergrond kan herkennen, en op basis daarvan kun je scènes eenvoudig opnieuw belichten om het onderwerp van het scherm te laten spatten.

©PXimport

02 Creatief

Waar praktische fotobewerking met behulp van AI een zeer recente ontwikkeling is, zijn er al heel wat langer technieken beschikbaar om afbeeldingen creatief te lijf te gaan. Waar we het jarenlang moesten doen met vaak maar matig overtuigende filters om bijvoorbeeld een foto om te zetten naar een tekening of olieverfschilderij, kunnen we nu de complete stijl van een willekeurige afbeelding (vaak een kunstwerk) overzetten naar onze eigen foto’s.

Deze techniek, Style Transfer geheten, vloeit voort uit onderzoek van Google naar de manier waarop gelaagde neurale netwerken informatie opslaan en verwerken. Elke laag kijkt naar een ander aspect van een afbeelding en door de juiste beeldkenmerken van één afbeelding over te zetten, kun je de visuele stijl kopiëren. Dit onderzoek resulteerde ook in Deep Dream Generator, een online toepassing waarmee je AI naar een foto kunt laten kijken. De patronen die een bepaalde laag in het neurale netwerk in die foto meent te zien, worden vervolgens aan de foto toegevoegd. Herhaal je dit proces, dan kun je verbluffende en vaak psychedelische afbeeldingen maken.

©PXimport

03 Zien = maken

Wanneer we afbeeldingen zoeken met bijvoorbeeld Googles zoekmachine, dan doen we dat met een zoekopdracht in tekst. Uiteraard is het ondoenlijk voor de makers van een zoekmachine om alle geïndexeerde afbeeldingen van trefwoorden te voorzien en dus gebeurt door middel van AI. Deze AI is in eerste instantie getraind door afbeeldingen (met omschrijving) uit een zorgvuldig en met de hand samengestelde dataset te bekijken. Aan deze training werken wijzelf regelmatig mee wanneer we op een website moeten bewijzen dat we geen robot zijn en bijvoorbeeld alle stoplichten in een raster met negen plaatjes moeten identificeren.

Elke kleuter kan op zeker moment een menselijk poppetje tekenen omdat het al heel wat mensen heeft gezien en de globale kenmerken daarvan (twee armen, twee benen, enzovoort) in de hersenen zijn gecodeerd. Het is dan ook niet verwonderlijk dat op zeker moment een AI, die getraind was op een bepaald type afbeeldingen zoals gezichten, kon worden gebruikt om vanuit de opgedane kennis nieuwe portretten te genereren. Deze techniek wordt toegepast op de inmiddels overbekende site www.thispersondoesnotexist.com (met aanverwante sites voor onder andere katten, paarden en kunstwerken).

04 Generative Adverserial Network

De website die portretten genereert, maakt gebruik van een AI die StyleGAN2 heet. Deze is ontwikkeld door Nvidia, dat een belangrijke speler is in de AI-markt omdat de grafische kaarten van dit merk niet alleen hoogwaardig beeld kunnen genereren, maar ook alles aan boord hebben om efficiënt neurale netwerken te kunnen gebruiken.

Een GAN (Generative Adverserial Network) is een van de populairste methoden om AI zelf beeld te laten genereren door twee AI’s het tegen elkaar te laten opnemen in een soort wedstrijd waarbij ze elkaars prestaties naar steeds grotere hoogtes stuwen.

Dit soort netwerken wordt inmiddels al volop toegepast om bijvoorbeeld zwartwit-foto’s in te kleuren, plaatjes te vergroten en bepaalde soorten afbeeldingen te creëren als in de eerdergenoemde voorbeelden.

05 Contrastive Language-Image Pre-training

Zoals gezegd, is het kunnen benoemen van wat een AI ziet al jaren onderwerp van onderzoek. Zoekmachines hebben dergelijke AI’s nodig om geautomatiseerd afbeeldingen te kunnen indexeren.

Een van de spectaculairste ontwikkelingen op dit gebied heet CLIP (Contrastive Language-Image Pre-training). Voorgaande AI’s waren afhankelijk van het leren herkennen van objecten aan de hand van zorgvuldig en met de hand samengestelde datasets van afbeeldingen en hun beschrijving in een beperkt aantal categorieën (mensen, auto’s, bloemen enzovoort). CLIP (waarvan de oorspronkelijke versie is getraind met ruim 400 miljoen tekst-beeldcombinaties) heeft echter een dusdanig brede kennis dat het tot op zekere hoogte ook afbeeldingen kan omschrijven in categorieën die het nooit eerder heeft gezien. Dit wordt zero shot learning genoemd.

06 GAN + CLIP

Combineer je de kennis van CLIP met een GAN als beeldgenerator, dan wordt het pas echt interessant. De IT-wereld stond een jaar geleden dan ook op zijn kop toen OpenAI ons een kijkje gaf in zijn nieuwste hoogstandje DALL-E.

DALL-E is een gigantisch neuraal netwerk dat beelden creëert aan de hand van een korte omschrijving in tekst. ‘Een fauteuil in de vorm van een avocado’ maakte wereldwijd furore toen dit systeem werd gepresenteerd. Niet alleen liet het een overtuigend zitmeubel zien, maar het maakt desgevraagd duizenden verschillende!

De rol van CLIP in dit alles is dat het als een soort jury fungeert. Het rangschikt de gegeneerde afbeeldingen op relevantie en stuurt de AI die het beeld genereert de goede kant op.

Helaas heeft OpenAI op dit moment de code voor DALL-E nog niet vrijgegeven omdat er volop discussie is over de gevolgen van dit soort AI (zie kader ‘Mogelijke gevolgen’).

©PXimport

Mogelijke gevolgen

Veel opensource-AI is op dit moment nog niet in staat om voor elke gegeven opdracht coherente resultaten te produceren. Een AI die speciaal getraind is op gezichten levert vrijwel perfecte portretten, maar vraag je het aan een algemeen TTI-systeem (Tekst To Image), dan moet je niet vreemd opkijken als het resultaat twee neuzen heeft. Deze systemen worden echter snel beter en spoedig kun je vrijwel elk soort afbeelding maken dat je hebben wilt. Wat de gevolgen daarvan zullen zijn voor fotografen en illustratoren is nauwelijks te overzien.

We kennen allemaal de ophef rond het fenomeen deepfake. Nu nog werkt dat vooral op basis van het vervangen van gezichten in bestaande video’s door middel van AI. Zodra AI echter zelf fotorealistische beelden kan genereren, zullen volledig door AI gemaakte video’s volgen.

Uiteraard zijn er ook volop positieve kanten te noemen. Zo zullen games in rap tempo nog levensechter worden omdat AI 3D-omgevingen in realtime kan vervangen door decors die echt lijken. Oude en krakkemikkige archiefbeelden worden ondertussen in hoog tempo ingekleurd, ontkrast en omgezet naar een hogere resolutie. Naast deze praktische zaken, zien we de opkomst van een geheel nieuwe kunstvorm.

©PXimport

07 Concurrentie

DALL-E mag dan nog niet beschikbaar zijn, dat wil niet zeggen dat we niet zelf met Tekst To Image (TTI) aan de slag kunnen. Al snel verschenen namelijk opensource-oplossingen op basis van CLIP en minder geavanceerde beeldgenerators. Aanvankelijk waren deze alleen online toegankelijk via het Google Colab-platform (zie kader ‘Werken met Colab’), maar al snel kwamen er varianten met een gebruiksvriendelijkere interface.

Zo scoort Visions of Chaos hoog op het gebied van gebruiksgemak en het aantal ondersteunde AI-toepassingen. Hoewel deze software oorspronkelijk is bedoeld als fractal-programma kun je er tegenwoordig tientallen verschillende AI-modellen in draaien. Dit vereist wel een stevige Nvidia-kaart met liefst 12 GB VRAM of meer. Omdat niet iedereen daarover beschikt, bekijken we eerst wat online-alternatieven.

Werken met Colab

Het gros van de opensource AI-toepassingen is gemaakt in Python (waarvan je overigens geen kennis hoeft te hebben). Is je hardware niet krachtig genoeg om deze programma’s lokaal te gebruiken, kies dan uit de vele Python-scripts die beschikbaar zijn op het Google Colab-platform en die je zelfs vanaf je mobiel zou kunnen gebruiken.

Op https://softologyblog.wordpress.com vind je links naar Colab-versies van vrijwel alle scripts die ook in Visions of Chaos beschikbaar zijn. Als voorbeeld gaan we naar het script voor Multi-Perceptor VQGAN+CLIP v3.

Elk Colab-script bestaat uit cellen met programmacode en deze hoef je alleen cel voor cel uit te voeren door op de afspeelknop te klikken. Lees daarbij wel goed de instructies en wacht met de volgende cel tot de vorige klaar is (groen vinkje), wat voor de initialisatie enkele minuten duurt.

Ben je aangekomen bij Do the run, dan vul je daar de tekst in voor wat je wilt zien en kies je het menu Runtime / Alles Uitvoeren. Na enkele minuten zal nu het eerste beeld verschijnen. Ben je tevreden, dan kies je Runtime / Uitvoering Onderbreken en sla je het laatst gegenereerde plaatje op. Voor nieuwe afbeeldingen hoef je alleen de parameters in de cel Do the run te wijzigen en deze te starten.

©PXimport

08 Zelf proberen

Kijk bijvoorbeeld eens bij Wombo Dream als je zelf wilt spelen met TTI. Hier kun je simpelweg een Engelse omschrijving invoeren en na het kiezen van een stijl krijg je binnen een minuut de gegenereerde afbeelding te zien. Wombo is snel en biedt een hoge resolutie.

Wat uitgebreider zijn je mogelijkheden bij NightCafe. Behalve Tekst To Image biedt deze ook Style Transfer. Meer van dit soort diensten vind je in het kader met links aan het einde van deze masterclass.

©PXimport

09 Uitgebreider

Veel meer mogelijkheden vind je bij de pagina’s van https://huggingface.co. Dit is een platform waar organisaties en individuen hun programma’s online toegankelijk maken. Veel daarvan hebben een aanzienlijk uitgebreidere gebruikersinterface dan de diensten die we in de vorige paragraaf noemden, wat ze ideaal maakt voor wie meer diepgang zoekt. Bovendien is het gebruik gratis. Keerzijde is dat je vaak te maken hebt met wachttijden, maar zolang je de pagina open laat, kun je ondertussen iets anders doen.

We noemen twee voorbeeldpagina’s. De eerste vind je via https://kwikr.nl/hfclip en is een van de betere AI-beeldgenerators (CLIP Guided Diffusion). Je kunt hem niet alleen kunt voeden met een tekstprompt, maar ook met een afbeelding om als uitgangspunt te dienen. Bovendien genereert dit AI-script een video waarin je ziet hoe de afbeelding tot stand komt.

Een tweede geavanceerde AI waarmee je bij Huggingface aan de slag kunt, vind je via https://kwikr.nl/hfsg3. Deze AI maakt video’s op basis van de nieuwste versie van StyleGAN. Er zijn varianten die getraind zijn op gezichten, portretten uit de kunstwereld en zelfs landschappen, en in elk van deze categorieën kun je video’s maken waarin losse beelden op adembenemende wijze in elkaar overvloeien.

©PXimport

10 Lokale AI

Beschik je over een geschikte Nvidia-kaart, dan weerhoudt niets je ervan om op je eigen pc met AI aan de slag te gaan. Zoals gezegd moet je hiervoor Visions of Chaos (VoC) installeren. Daarmee ben je er echter nog niet. Je dient allerlei aanvullende componenten te installeren om AI-modellen te kunnen gebruiken. Deze maken namelijk gebruik van PyTorch of TensorFlow, de twee populairste platformen voor AI.

Gedetailleerde installatie-instructies vind je via https://kwikr.nl/instai. Installatie van alle benodigde software is niet moeilijk, maar je bent er wel zo’n twee uurtjes mee zoet. Als de klus is geklaard, kun je Visions of Chaos starten en is de speeltuin geopend.

11 Visions of Chaos

In Visions of Chaos vind je de AI in het menu Mode / Machine Learning, die is onderverdeeld in de categorieën PyTorch en TensorFlow. Die laatste bevat als belangrijkste onderdelen Deep Dream en Style Transfer, maar deze zijn ook beschikbaar als PyTorch-variant, dus we concentreren ons op dat platform.

De eerste keer dat je een onderdeel wilt gebruiken zal het de automatisch de benodigde neurale netwerken en Python-scripts downloaden.

Met alle mogelijkheden die je tot je beschikking hebt, kunnen we een jaargang PCM’s vullen, dus we bekijken er slechts een paar.

12 StyleGAN3

Ga om te beginnen naar StyleGAN3. Je ziet dat Model file daar standaard een van de Faces-modellen is. Klik op Generate Image om een willekeurig portret te maken.

Je kunt gegenereerde afbeeldingen manipuleren met behulp van tekst. Zet daarvoor een vinkje bij de bovenste optie, Style with CLIP. Laat de standaardtekst staan en genereer nogmaals een afbeelding.

In het vrijwel oneindige domein van alle mogelijke gezichten heeft de opgegeven instructie het oorspronkelijke portret nu in iets totaal anders veranderd. Genereer je een video, dan zal StyleGAN3 voor het gekozen model beelden in elkaar laten overvloeien (in ons geval gezichten), wat herinnert aan het aloude ‘morphing’, maar dan automatisch en veel vloeiender. Gebruik je CLIP in combinatie met video, dan start deze met een willekeurig portret en zie je hoe dit verandert in iets dat hopelijk voldoet aan de gegeven opdracht. Probeer bijvoorbeeld ‘a caricature of Tom Cruise’. Na het genereren van de beeldjes krijg je een FFmpeg-venster te zien waarmee je ze kunt combineren tot video. Je hebt hier veel bewerkingsmogelijkheden waar we hier niet op in kunnen gaan. Klik voor nu op Build en hoop op de gewenste karikatuur.

©PXimport

13 Text-to-image

Het tweede onderdeel van Visions of Chaos dat we bekijken is de optie Text-to-image. Klik je op de naam achter Script, dan zie je een enorme waslijst aan beschikbare AI’s waarvan de beste van een asterisk zijn voorzien. Allemaal hebben ze zo hun eigen instellingen, maar er zijn ook veel overeenkomsten.

Als voorbeeld gaan we aan de slag met Multi-Perceptor VQGAN+CLIP v3. Hierin worden de gemaakte afbeeldingen beoordeeld door twee verschillende CLIP-modellen voor meer betrouwbaarheid. Laat de standaard inputprompt voor wat hij is en klik op Generate om je eerste TTI-kunstwerk te produceren. Het eindresultaat laat enkele minuten op zich wachten waarbij het beeld tussentijds steeds wordt bijgewerkt. Je kunt het proces overigens versnellen door vooraf Number of cutouts bijvoorbeeld te halveren.

Waar je in StyleGAN bij dezelfde Random Seed hetzelfde plaatje te zien krijgt, is dat bij TTI niet het geval. Hier zorgt het getal er alleen voor dat een nieuw plaatje met dezelfde prompt een vorige niet overschrijft. Je vindt gemaakt beeld overigens in de map Documenten\Visions of Chaos.

Omdat niet elke prompt meteen iets moois oplevert, kun je bij Batch / Input prompt with different seeds meerdere exemplaren achter elkaar genereren. Hier vind je ook de mogelijkheid om een lijst met prompts of willekeurige input op te geven waarmee je je pc een nachtje kunt laten werken.

©PXimport

14 Ingenieur

Het verzinnen van opdrachten die interessant beeld opleveren, kan een flinke puzzel zijn waarvan de oplossing bovendien per AI verschilt. Niet voor niets wordt deze kunst ‘prompt engineering’ genoemd. Behalve de feitelijke prompt, zoals ‘a landscape’ kun je er kwalificaties aan toevoegen die we modifiers noemen. Voorbeelden zijn: ‘in summer’, ‘at dawn’, ‘by Vincent van Gogh’ of ‘in impressionist style’. Ook kun je modifiers toevoegen voor materialen (‘made of glass’) of technieken (‘a pencil drawing’).

Sommige AI’s werken het best met dit alles in een lange zin (an oil painting of a park by Georges Seurat), terwijl andere het beter doen wanneer de prompt in stukken is gehakt (a park | oil painting | by Georges Seurat). Bij sommige AI’s kun je elementen zelfs extra nadruk geven door direct achter een trefwoord een dubbele punt en een cijfer te zetten waarbij hoger meer nadruk betekent. Alleen met experimenteren kom je er achter wat voor jouw favoriete AI het beste werkt.

15 Volop in ontwikkeling

Hoewel we slechts een fractie van de vele ontwikkelingen hebben kunnen bespreken, is duidelijk dat er volop interessante dingen gebeuren op het gebied van AI voor beeldbewerking. Als het gaat om Tekst To Image, gaan deze zelfs zo hard dat het niet onwaarschijnlijk is dat er al weer betere modellen beschikbaar zijn op het moment dat je dit artikel leest. We kunnen dan ook alleen maar eindigen met een klassieke zin uit de wereld van de strip: wordt vervolgd!

Online bronnen

Naast de in het artikel genoemde links, zijn er veel andere bronnen om zelf aan de slag te gaan of om informatie op te doen. Een kleine selectie:

www.openai.com/blog/dall-e

Informatie over het grootste TTI-systeem DALL-e.

https://kwikr.nl/pestudie

Een studie naar prompt engineering (pdf).

www.artbreeder.com

Maak, combineer en manipuleer afbeeldingen en korte video’s.

www.gaugan.org/gaugan2

Maak fotorealistische landschappen op basis van een schets.

https://kwikr.nl/dalmini

Een TTI-systeem.

https://rudalle.ru/en

Een groot TTI-systeem, het Russische antwoord op DALL-e.

https://kwikr.nl/fbnnr

Facebook-groep met afbeeldingen en video’s die we niet in dit artikel konden tonen.

Valve heeft laten weten dat het eigenlijk al de bedoeling was dat we de prijs en releasedatum van de vorig jaar aangekondigde Steam Machine zouden weten. De bekendmaking van deze details is echter uitgesteld door het aanhoudende tekort van geheugen en opslag.

Dat liet het bedrijf weten in een blogpost. Daarin praat het bedrijf niet alleen over de Steam Machine - het aankomende apparaat van Valve waarmee pc-games op televisie gespeeld kunnen worden - maar ook de nieuwe Steam Controller en vr-headset Steam Frame.

"Toen we deze producten in november aankondigden, gingen we ervan uit dat we de specifieke prijzen en lanceringsdata nu wel al hadden kunnen delen", zo stelt Valve. "Maar de tekorten op het gebied van geheugen- en opslagcomponenten waar onze hele bedrijfstak mee kampt, zijn sindsdien behoorlijk toegenomen.  De beperkte beschikbaarheid en oplopende prijzen van deze cruciale onderdelen hebben ons ertoe gedwongen om onze plannen voor vraagprijs en levering bij te stellen (vooral voor de Steam Machine en Steam Frame)."

Valve laat weten dat het nog altijd de bedoeling is dat alle drie de producten ergens in de eerste helft van dit jaar verschijnen. "Er moet echter nog wel wat werk worden verzet voordat we de definitieve prijzen en lanceringsdata kunnen vastleggen, zeker gezien het feit dat de factoren die hierop van invloed zijn heel snel kunnen veranderen. We houden jullie zoveel mogelijk op de hoogte terwijl we proberen die plannen zo snel mogelijk rond te krijgen."

Stijgende RAM-prijzen

De aanhoudende tekorten en alsmaar stijgende prijzen voor geheugen zijn dus de oorzaak van het feit dat we de prijs en releasedatum van de Steam Machine nog niet weten. Prijzen van RAM (Random Access Memory) stijgen alsmaar doordat er massaal RAM nodig is om het alsmaar populairder wordende AI werkende te houden, en daardoor zijn er ook steeds minder componenten beschikbaar om de RAM te produceren. Onlangs gingen er al geruchten dat dit ook voor intern uitstel van de PlayStation 6 kan leiden.

Over de Steam Machine

De Steam Machine is een kubusvormig apparaat dat Steam-games af kan spelen. Het apparaat kan op televisie of een monitor aangesloten worden. In de Steam Machine zit een 'semi-custom' AMD-videokaart. In combinatie met FSR-upscalingtechniek is het in principe mogelijk om games in een resolutie van 4k en met zestig frames per seconde te spelen, zo wordt ook in de nieuwe blogpost benadrukt.

SteamOS dient als besturingssysteem, al wordt dit wel aangepast om het op een groter scherm bruikbaar te maken. Er zullen twee varianten van de Steam Machine beschikbaar komen: één met 2 TB aan opslag en één met 512 GB aan opslag. Tot slot kan ook de voorkant van de Steam Machine verwisseld worden om het apparaat een ander uiterlijk te geven.

Wil je snel een moderne website zonder ingewikkelde code en geavanceerde CMS-instellingen? Google Sites is verrassend veelzijdig! Je bedenkt een geschikte titel, voegt pagina’s toe en publiceert tot slot de volledige website met één klik. Lees hoe je binnen enkele uren een volwaardige website bouwt en vervolgens beheert.

We laten in dit artikel stapsgewijs zien hoe Google Sites werkt. Na afloop heb je voor jouw hobbyproject, vereniging of eetclubje een mooie website gebouwd. Technische kennis is niet nodig en ook heb je geen krachtige hardware nodig.

Site openen

Voor Google Sites is een Google-account vereist. Heb je dat nog niet, dan kun je jezelf gratis registreren. Ga in dat geval met een willekeurige browser naar www.kwikr.nl/gglac en doorloop via Account maken het aanmeldproces.

Je start eenvoudig met een nieuwe website. Ga naar https://sites.google.com en log zo nodig in met jouw Google-account. Er zijn diverse sjablonen beschikbaar. Daarmee kun je bijvoorbeeld vlot een portfolio, helppagina of fotogalerij optuigen. Wie zijn of haar website liever zelf wil vormgeven, begint het beste vanaf nul. Klik op Lege site om het ontwerpvenster te openen.

Misschien heb je al een onderwerp voor jouw website bedacht. Klik linksboven op Geef de naam van de site op en typ een relevante naam. Bedenk ook alvast een paginatitel. Zo krijgt de beginpagina van je website alvast wat smoel.

Korte rondleiding

Voordat je daadwerkelijk begint met 'bouwen' is het nuttig om even de indeling van Google Sites te verkennen. Rechts zie je drie vaste tabbladen voor het creëren van je site. Gebruik het onderdeel Invoegen om allerlei contentblokken op de pagina te plaatsen, zoals tekstvakken, afbeeldingen en knoppen. Met het onderdeel Pagina’s bepaal je de structuur van de website, terwijl je met Thema’s het uiterlijk aanpast.

Tijdens het ontwerpen wil je tussentijds wellicht zien hoe de website er aan de voorkant uitziet. Klik dan rechtsboven in de knoppenbalk op Voorbeeld (pictogram met laptop en smartphone). Gebruik de opties rechtsonder en zie hoe de pagina schaalt op een smartphone, tablet en desktop. Je klikt linksboven op het pijltje om weer terug te keren naar het ontwerpvenster.

Een pluspunt is dat Google Sites automatisch het concept opslaat. Behalve jijzelf ziet niemand de inhoud van de website. Pas wanneer je klaar bent om live te gaan, kun je de boel publiceren.

Openingsbeeld

Met het toevoegen van een openingsbeeld en een logo krijgt je website wat meer persoonlijkheid. Zweef met de muisaanwijzer boven het blok met de paginatitel en klik op Afbeelding / Uploaden. Selecteer nu een foto op je pc of laptop en kies Openen. Het gekozen beeld verschijnt direct op je website. In plaats van een lokaal opgeslagen afbeelding kun je ook beeld van een online bron selecteren, zoals Google Afbeeldingen, Foto’s of Drive. Klik in dat geval op Afbeelding / Selecteren.

Elke serieuze website heeft een eigen logo. Dat voeg je makkelijk toe. Zweef met de cursor linksboven de naam van de website en kies Logo toevoegen. Klik onder Logo op Uploaden en selecteer de gewenste afbeelding op je computer. Bevestig met Openen. Je voegt eventueel een alternatieve tekst aan het logo toe. Op die manier weten mensen met een visuele beperking wat het logo inhoudt.

Je kunt in hetzelfde menu ook een zogeheten favicon toevoegen. Dit kleine pictogram verschijnt in het tabblad van de browser. Nuttig voor de herkenbaarheid van jouw website. Klik rechtsboven op het kruisje om de instellingen te sluiten.

Titel en broodtekst

Wie weet wil je jouw website vullen met interessante artikelen en mooie foto’s. We beginnen met het toevoegen van tekst. Ga in het rechterdeelvenster naar Invoegen en kies Tekstvak. Klik achter Normale tekst op het kleine pijltje en kies Titel, Kop of Subkop. Je typt vervolgens de tekst. Gebruik de opties in de werkbalk om onder andere het lettertype en de grootte te wijzigen. Verder verander je eventueel de kleur en voeg je desgewenst een emoticon toe.

Klik achter de zojuist getypte titel en druk op Enter. Je kunt nu naar hartenlust een artikel tikken. Maak belangrijke woorden bijvoorbeeld vet of onderstreep een opvallende zin. Daarnaast voeg je ook makkelijk een opsomming met nummers of opsommingstekens toe. Je maakt de openingspagina op die manier aantrekkelijk voor jouw toekomstige bezoekers.

Foto’s toevoegen

Een website met voornamelijk tekst is natuurlijk saai. Voeg daarom ook leuke foto’s toe. Ga naar Invoegen en klik daarna op Afbeeldingen / Uploaden. Je bladert op de computer naar de fotomap. Selecteer één of meer afbeeldingen en bevestig met Openen. Het beeld verschijnt meteen op de website. Je sleept de foto met ingedrukte muisknop eenvoudig naar de beoogde plek. Plaats op die manier bijvoorbeeld drie kiekjes naast elkaar.

Bepaal zelf of je een kleine of grote foto op de website wilt publiceren. Klik eerst op een afbeelding om deze te selecteren. Je past het formaat simpel aan. Doe dat door de blauwe bolletjes te slepen. Als je slechts een gedeelte van de afbeelding wilt gebruiken, maak je een uitsnede. Klik in de werkbalk boven het geselecteerde beeld op het pictogram Afbeelding bijsnijden. Alles wat binnen het fotokader valt, is op de website te zien. Gebruik zo nodig de schuifregelaar om in te zoomen. Sluit de bewerking via het vinkje.

Je kunt ook nog een bijschrift onder de afbeelding plaatsen. Selecteer een foto en klik in de werkbalk op het pictogram met de drie puntjes. Via Bijschrift toevoegen verschijnt er onder de afbeelding een tekstkader. Typ nu een relevante zin.

Diavoorstelling

Wil je een heleboel foto’s laten zien? Wanneer je tientallen kiekjes aan een pagina toevoegt, wordt het al gauw een rommeltje. Google Sites bevat hiervoor een slimme oplossing. Creëer met een zogeheten afbeeldingscarrousel een soort diavoorstelling van jouw favoriete foto’s.

Ga in het rechterdeelvenster naar het onderdeel Invoegen en scrol zo nodig een stukje omlaag. Kies Afbeeldingscarrousel en klik op Afbeelding toevoegen. Wijs nu via het plusteken en Afbeelding uploaden twee of meer foto’s aan. Zodra je op Openen klikt, verschijnen ze in het overzicht. Wijzig desgewenst de volgorde door een kiekje met ingedrukte muisknop te verplaatsen.

Je kunt nog wat opties van de diavoorstelling wijzigen. Klik rechtsboven op het pictogram van het tandwiel om de instellingen te openen. Beslis of je de diavoorstelling automatisch wilt starten. Je kunt hierbij de snelheid van de presentatie aanpassen. Kies tussen Snel, Medium, Traag en Erg traag. Geef ook aan in hoeverre je bijschriften wilt weergeven. In dat geval voeg je bij elk beeld een tekst toe. Zweef hiervoor boven de foto en klik op de spraakballon. Je kiest nu Bijschrift toevoegen, waarna je de tekst typt. Via Invoegen verschijnt de afbeeldingscarrousel op de webpagina.

Contentblok

In de voorgaande tips heb je artikelen en beelden als afzonderlijke blokken aan de website toegevoegd. Het is natuurlijk mooier wanneer tekst en beeld vloeiender in elkaar overlopen. Dat regel je met zogenoemde contentblokken.

Navigeer in het rechterdeelvenster naar het onderdeel Invoegen. Merk op dat er zes verschillende contentblokken beschikbaar zijn. Kies bijvoorbeeld voor een afbeelding met aan de rechterkant een alinea. Hierbij staan tekst en beeld dus naast elkaar. Je kunt als alternatief ook drie plaatjes tonen met daaronder evenzoveel bijpassende teksten. In dat geval kies je voor een lay-out met drie kolommen.

Heb je een geschikt contentblok op het oog? Sleep dat dan met ingedrukte muisknop naar jouw website. De inhoud is nog leeg. Het staat je vrij om een verse foto te selecteren en nieuwe tekst te typen. Bovendien kun je ook een bestaand tekst- en beeldblok naar het contentblok slepen.

Overige tekstopties

Google Sites heeft nog meer bruikbare tekstopties in huis. Wil je bijvoorbeeld veel informatie compact presenteren, kies dan bij het onderdeel Invoegen voor Samenvouwbare groep. Typ hierbij eerst een korte kopregel en tik een uitgebreidere uitleg in het hoofdtekstvak. Dit is het gedeelte dat kan ‘uitklappen’.

Voor lange pagina’s is een automatisch gegenereerde inhoudsopgave een goede toevoeging. Als je op Inhoudsopgave klikt, verschijnen alle koppen van de bewuste pagina onder elkaar. Klikt de bezoeker op een kop, dan navigeert diegene direct naar de bijbehorende tekst. Wanneer je op een later moment een kop verandert, wijzigt de inhoudsopgave vanzelf mee.

YouTube-video

Op YouTube is er over bijna ieder onderwerp wel een filmpje te vinden. Je kunt zo’n video desgewenst op je website publiceren. Dit noem je ook wel het embedden van een video. Overigens hoeft deze content niet per se van jezelf te zijn. Je kunt namelijk elk YouTube-filmpje aan jouw website toevoegen.

Ga naar het onderdeel Invoegen en kies YouTube. Mogelijk dien je hiervoor wel een eindje omlaag te scrollen. Je zoekt vanuit Google Sites rechtstreeks op YouTube. Typ één of meerdere trefwoorden en probeer interessant videomateriaal te vinden. Overigens plak je net zo makkelijk een link van een YouTube-video in het invoerveld. Klik op een geschikte video en bevestig rechtsonder met Invoegen.

Het filmpje verschijnt op de webpagina. Aan jou de taak om een geschikte plek te kiezen. Je kunt het videokader naar eigen inzicht verslepen. Pas verder ook de afmetingen van het filmpje aan. Dat werkt op soortgelijke wijze als je eerder met foto’s hebt gedaan. Versleep dus de blauwe bolletjes.

Plattegrond

Soms is het nuttig om een plattegrond op de website te plaatsen. Wellicht wil je bijvoorbeeld een routebeschrijving naar een specifiek adres toevoegen. Dankzij een verhelderend kaartje weet de bezoeker precies waar hij of zij terechtkan.

Klik in het onderdeel Invoegen op Kaart. Er komt een nieuw Google Maps-venster tevoorschijn. Zoek naar de locatie waarvan je een plattegrond wilt toevoegen. Je kunt bijvoorbeeld op de naam van een bedrijf of straat zoeken. Google Maps plaatst een rood markeringsteken op het kaartje, maar dat kun je naar eigen inzicht verplaatsen. Tevreden? Publiceer deze plattegrond dan met Selecteren op de webpagina.

Extra webpagina’s

Tot dusver hebben we alleen de beginpagina onder handen genomen. Een website bestaat meestal uit meerdere webpagina’s. Die kun je makkelijk toevoegen. Open in het rechterdeelvenster het onderdeel Pagina’s. Je ziet hier als het goed is de homepage al staan. Zweef met de muisaanwijzer boven het plusteken en kies Nieuwe pagina. Bedenk een relevante naam, waarna je via Klaar deze pagina daadwerkelijk aan de website toevoegt.

Er verschijnt nu een leeg ontwerpvenster. Alleen diverse vaste elementen zijn van de beginpagina overgenomen, zoals de websitetitel, het openingsbeeld en het logo. De paginatitel is al voor je ingevuld, maar die kun je eenvoudig wijzigen. Merk op dat er rechtsboven een menu zichtbaar is. Bezoekers kunnen zo tussen verschillende pagina’s van jouw website navigeren. Vul iedere nieuwe pagina onder meer met tekst-, beeld- en contentblokken zoals je in eerdere tips hebt geleerd.

Submenu’s

Als je flink wat webpagina’s hebt toegevoegd, wordt het al gauw onoverzichtelijk. Je lost dit euvel op door submenu’s te gebruiken. Klik achter de naam van een pagina op het pictogram met de drie puntjes en kies Subpagina toevoegen. Je geeft deze pagina een naam en bevestigt met Klaar. Merk op dat de subpagina onder de hoofdpagina wordt weergegeven. Bovendien verschijnt er in het navigatiemenu van jouw website nu een pijltje met onderliggende pagina’s. Zorg zo voor een logische navigatiestructuur.

Thema wijzigen

Met een thema wijzig je in één keer de opmaak van jouw website, zoals het lettertype en de kleuren. Google Sites heeft van zichzelf enkele standaardthema’s in huis. Klik in het rechterdeelvenster op het onderdeel Thema’s en kies onder Gemaakt door Google een van de suggesties. Het uiterlijk wijzigt meteen. Bij ieder thema kun je een kleurtje en letterstijl kiezen.

Je kunt ook zelf een nieuw thema creëren. Daarmee heb je meer invloed op de vormgeving van jouw website. Klik in de rechterbalk onder Custom op het plusteken. Geef het nieuwe thema een naam. Je kunt eventueel een logo en bannerafbeelding (openingsbeeld) toevoegen. Wanneer je dat in een eerdere tip al hebt gedaan, laat je deze opties leeg. Klik op Volgende. Je selecteert een mooi kleurenpalet en klikt wederom op Volgende. Kies nu voor de titels en hoofdtekst een prettig lettertype. Sluit via Thema maken het venster.

De naam van je nieuwe thema verschijnt in het rechterdeelvenster. Je kunt nu allerlei details aanpassen. Klik maar eens op Kleuren en verander de vormgeving van de achtergrond, titels en hoofdtekst. In de overige opties wijzig je onder andere de regelafstand, sitebreedte en positie van het navigatiemenu. Er is zéér veel mogelijk!

Publiceren

Ben je helemaal tevreden over jouw website? Hoog tijd om het openbaar te maken! Klik rechtsboven op de blauwe knop Publiceren. Het (gratis) domein begint altijd met https://sites.google.com/view/. Het einde van deze url kun je zelf verzinnen. In ons voorbeeld is de volledige link https://sites.google.com/view/curacao-tips.

Is de websitenaam al bezet, dan geeft Google Sites dat netjes aan. Bedenk in dat geval iets anders. Overigens zijn er ook mogelijkheden om een eigen domeinnaam te koppelen, maar daar zijn kosten aan verbonden. Je dient de beoogde url dan eerst bij een geschikte domeinprovider te kopen. Klik tot slot op Publiceren. Bezoekers kunnen nu je gepubliceerde website bewonderen.