AIM ONLINE CASE · GLHF Bezoek live →
CASE · 002 · GAMING / GAMIFICATION LIVE OP GOODLUCKHAVEFUN.NL 2025 — 2026
PRESS START

Good Luck
Have Fun.

Een interactieve 3D-wereld die jongeren bereikt zoals geen folder of LinkedIn-post dat ooit kan. Voor het bureau dat merken en jongeren verbindt via gaming, esports en gamification.

3D interactieve wereld
6+10 stations + coins
3 × doelgroep-landingen
0 / 6 0 / 10
GLHF
· DE 3D-WERELD ·
PRESS START
WASD
OM TE RIJDEN R
Klant GLHF · Good Luck Have Fun
Sector Gaming · gamification
Jaar 2025 — 2026
Scope Strategie · design · build
Stack Astro · Three.js
01 · het pronkstuk

De 3D-wereld.

Een speelbare wereld op je toetsenbord. Rijd door zes stations, verzamel tien coins, raak de bullseye. Aan het einde wacht een leaderboard met de snelste ontdekkers.

0 / 6 0 / 10
GLHF
· wereld klaar om te verkennen ·
PRESS START
WASD rijden
knal door de GLHF letters
R reset

Stations

Zes paviljoenen met info per doelgroep. Rijd erheen, panel opent automatisch.

Coins

Tien verzamelobjecten verspreid over de wereld. Verzamel-mechaniek met SFX.

Leaderboard

Snelste ontdekkers worden bewaard. Persoonlijke rank na voltooien.

Bullseye

Raak de target en het contactformulier popt open. Gamification als conversie.

02 · de brief

"Hoe bereik je een
generatie die niets van je wil?"

GLHF moest een eigen plek krijgen waar drie hele verschillende doelgroepen (bedrijven, onderwijs, overheid) elk hun antwoord vinden. Geen brochure-website. Een speelse hub waar de boodschap zelf het bewijs is.

Advertenties. Folders. Standaard lessen.
Glijden langs ze heen.

De opdracht: bouw een site die aantoont wat GLHF kan, door het zelf te doen. De homepage moest een gamification-les op zich zijn. De 3D-wereld moest het hardste argument leveren: jongeren spelen het spel, niet alleen lezen erover.

En het moest werken voor B2B-bezoekers van bedrijven, beleidsmakers en docenten. Drie doelgroepen, één wereld.

DE PROBLEMEN
  • × Traditionele B2B-sites halen jongeren niet.
  • × Drie doelgroepen vragen drie verhalen.
  • × GLHF moet zelf bewijzen dat gaming werkt.
  • Een speelbare hub die zichzelf verkoopt.
03 · drie doelgroepen

Eén wereld,
drie verhalen.

Vanuit de 3D-wereld vertakt de site naar drie eigen landingen. Elk met eigen taal, eigen voorbeelden, eigen call-to-action.

01 / BEDRIJVEN

Voor bedrijven

EMPLOYER BRANDING GEN Z RECRUITMENT TEAMBUILDING

Bereik Gen Z-talent waar ze écht zitten. Employer branding via esports-events, teambuilding met serieuze game-mechanics, recruitment-campagnes die niet als recruitment voelen.

naar landing →
02 / ONDERWIJS

Voor onderwijs

DIGITALE GELETTERDHEID ESPORTS PROGRAM LESPAKKET

Esports als talentprogramma, gaming als lesvorm voor digitale geletterdheid en burgerschap. Met lesmateriaal, evaluatie-tools en docenttraining inbegrepen.

naar landing →
03 / OVERHEID

Voor overheid

GAMING HUBS PARTICIPATIE SERIOUS GAMES

Gaming hubs als laagdrempelige fysieke ontmoetingsplekken, jongerenparticipatie via serious games, digitale weerbaarheid en beleidsadvies voor gemeenten.

naar landing →
04 · het systeem

Het visuele systeem.

Gaming-DNA dat ook werkt in een wethouder-presentatie. Helder, herkenbaar, schaalbaar over alle touchpoints van homepage tot HUD.

KLEUREN · KERN

Palet

Gradient green→purple als signaal, cyaan en coin voor accenten.

#0A0A0E
#22D37E
#9146FF
#7EC8F0
#FFC93D
TYPOGRAFIE

Stack

DISPLAY · SPACE GROTESK
Bereik jongeren.
BODY · INTER
Wij spreken hun taal.
ACCENT · PRESS START 2P
PRESS START
COMPONENTEN

UI-elementen

PIXEL BUTTONS HUD COUNTERS LEADERBOARD DIALOG POPUP XP-BAR PORTAL FADE SPEECH BUBBLE TOUCH-CONTROLS
4 / 6 7 / 10
SPEED
05 · features

Wat hier in zit.

De wereld is één pronkstuk. Maar onder de motorkap zit nog veel meer dat de aandacht vasthoudt en omzet in actie.

FEATURE.001

Custom 3D engine op Three.js

Eigen 3D-wereld in de browser. Rijbeweging, collision, speech bubbles voor de Geoffrey-avatar, portal-transities tussen paviljoenen. Werkt op desktop met WASD/pijl-toetsen, mobiel wordt netjes geredirect naar de leesbare versie.

FEATURE.002

Live leaderboard

Snelste ontdekkers worden gerangschikt en opgeslagen. PHP-backend voor scores.

01 Anika V. 02:14
02 Niels T. 02:42
03 Stijn de J. 03:01
FEATURE.003

9 gamification-technieken

De homepage is zelf een les. Negen psychologische triggers, allemaal toegepast en uitgelegd.

curiosity gap goal-gradient variable reward progress bar scarcity unlock loop
FEATURE.004

Bullseye contactflow

Raak de target en het contactformulier opent automatisch. Conversie als beloning, geen formulier-bumpsteen. "Bullseye! Laten we praten."

FEATURE.005

Tweetalige stack

Volledige NL en EN versie naast elkaar. Astro i18n met aparte /en/ URL-tree en taalwissel op elke pagina, ook midden in de 3D-wereld.

FEATURE.006

SEO-stack die past bij een speelbare site

Schema.org Organization en WebSite markup, OG-images per pagina, speakable specifications voor stem-zoekmachines, noscript fallbacks die zelfstandig leesbaar zijn. Speelse buitenkant, harde infrastructuur eronder.

06 · stack

De stack.

Astro voor de schaalbare basis, Three.js voor de wereld, eigen scripts voor de game-loop en leaderboard. Snel, modern, onderhoudsvriendelijk.

01

Astro · static site framework

Snelle build, i18n out-of-the-box, content collections voor blog en cases.

Astro 6
02

Three.js · 3D engine

WebGL-renderer voor de speelbare wereld. Custom physics, collision detection, portal transitions.

Three.js
03

Leaderboard backend

PHP-endpoint voor het opslaan en uitlezen van snelste tijden, met server-side validatie en privacy by design.

PHP
04

Schema.org structured data

Organization, WebSite en WebPage JSON-LD op alle pagina's voor optimale vindbaarheid en AI-citatie.

JSON-LD
05

Tweetalig (NL + EN)

Aparte /en/ URL-tree, taalwissel op alle pagina's incl. de 3D-wereld. SEO-tags per locale.

i18n
06

Touch-controls + mobile fallback

Joystick + GAS/REV pedalen voor mobiele varianten, of redirect naar de leesbare homepage.

Adaptive

"Advertenties, folders, standaard lessen glijden langs jongeren heen. Wij spreken hun taal."

GLHF · op de homepage
PRESS [START] TO CONTINUE

Klaar voor jouw eigen
speelbare site?

Een 3D-ervaring, een gamified funnel, of een complete merkenervaring. Wij bouwen het van eerste storyboard tot deploy.

Bekijk de live site Start het gesprek