Holland Casino
Holland Casino, een van de bekendste entertainmentbedrijven van Nederland, heeft zijn digitale platform vernieuwd in samenwerking met Touchtribe. Om in de dynamische casinobranche te blijven excelleren, was het noodzakelijk om het digitale platform te moderniseren en optimaliseren met wendbaarheid en digitale efficiëntie als uitgangspunt. Deze ingrijpende verandering betrof de vestigingen website, werkenbij-website en corporate website. In deze case study gaan we dieper in op de achtergrond van dit project, de implementatie en de uiteindelijke resultaten.
Composable
Headless CMS
Storyblok
Full Stack Web development
2023
Content Management System (CMS) Modernisering
De systemen die voorheen werden gebruikt - Playtech voor de vestigingen websites en Drupal voor de Corporate en Werken-bij websites - sloten niet meer aan bij de gewenste manier van werken. Playtech, primair een online casino software, bood beperkte CMS-functionaliteit, terwijl de gebruikte Drupal end-of-life was, wat betekende dat het noodzakelijk was te upgraden of over te stappen op een nieuwe oplossing. Daarnaast was er een wens voor decentraal contentbeheer.
Minimaliseren van platformbeheer
Met een interne infrastructuur op basis van AWS, was het voor Holland Casino belangrijk een architectuur te ontwikkelen die minimaal hosting onderhoud en infrastructuurbeheer vereiste. Uitgangspunt voor ontwikkeling van het platform was dat het interne AWS team niet belast werd met extra verantwoordelijkheden.
Om hun content management uitdaging aan te pakken, koos Holland Casino voor de headless CMS oplossing van Storyblok. Dit CMS maakt het mogelijk om content centraal te beheren, terwijl het flexibel genoeg is om content naar verschillende platforms te distribueren, zoals een corporate website, werkenbij website, en diverse vestigingen websites. Storyblok werd onder andere gekozen vanwege de preview-functionaliteit, waarmee contentmanagers hun wijzigingen direct op de website kunnen zien.
Om een uitzonderlijke digitale klantervaring te garanderen, is snelheid cruciaal. Iedere Holland Casino vestiging heeft een eigen website waar speluitleg, evenementenkalenders en restaurant menu’s te vinden zijn. Daarnaast is het ook mogelijk om poker reserveringen toe te voegen en reserveringsmogelijkheden. Om de websites en content zo snel mogelijk te kunnen serveren is voor static site generation gekozen. Het Gatsby framework, gebaseerd op React, kwam hiervoor als de ideale keuze naar voren. Gatsby genereert een statisch pakketje HTML-, CSS- en JavaScript-bestanden die zeer snel worden geladen. Alle content wordt vooraf gegenereerd, waardoor er niets meer gegenereerd hoeft te worden bij het opvragen van een webpagina.
Een dynamische website biedt flexibiliteit, maar het gebruik van statische content resulteert in snellere laadtijden. Met Gatsby's statische benadering moest er een oplossing worden gevonden voor previews van content. Hoewel er een kleine vertraging is bij het bekijken van draft content, werd dit als een aanvaardbaar compromis beschouwd.
Om een consistente gebruikerservaring op iedere website van Holland Casino te waarborgen, is een design-system geïntroduceerd. Het design-system maakt efficiënt gebruik van het framework over alle websites heen. De controle en het beheer van het design ligt bij het designteam. Per website is een thema configuratie opgezet voor verschillende segmenten
Samen met Holland Casino denken wij altijd na over innovatie, ook binnen de codebase. Zo zijn wij nu bezig met het implementeren van een gegenereerd design system op basis van design tokens. Dit zorgt voor consistentie en een goede samenwerking met design.
Om het AWS-team van Holland Casino te ontlasten, werd gekozen voor een cloud-gebaseerde infrastructuur met Amazon Web Services (AWS) voor hosting. De content voor de verschillende websites wordt geplaatst op de S3 buckets van Holland Casino. Bij het gebruik van technologieën die gebruik maken van server-side rendering wordt de laatste versie van content bij het opvragen van de pagina gegenereerd.
Omdat Holland Casino Gatsby inzet, wat zorgt voor static site generation, wordt de laatste content vanuit Storyblok niet opgehaald bij het opvragen van een pagina. Voor deze uitdaging wordt er gebruikgemaakt van Pipedream. Pipedream is een laagdrempelige oplossing die minimale programmering vereist om API's te koppelen. Storyblok heeft de mogelijkheid om een notificatie door middel van een webhook te krijgen op het moment dat er content gepubliceerd wordt. Deze notificatie komt binnen bij Pipedream, waardoor er vervolgens een rebuild en nieuwe deployment van de website gedaan wordt. Hierdoor is de website bijgewerkt met de laatste versie van de Storyblok content.
Om efficiëntie te verhogen, is het beheer van het CMS bij Holland Casino naar binnen gebracht, waardoor het team dit makkelijk kan overnemen. Touchtribe integreert compleet met de IT omgeving van Holland Casino, zodat ontwikkeling soepel verloopt. Een uitdaging ontstond in het beheren van verschillende websites vanuit een enkele codebase. In eerste instantie werd gekeken naar een gedeelde Gatsby configuratie, maar het differentiëren tussen de drie websites (Corporate, Werken-bij, en vestiging) bleek lastig. Dit werd opgelost door het ontwerpen van vier losse packages in een Github mono repository.
De samenvoeging van meerdere codebases in een mono repository heeft de samenwerking en het beheer van code gestroomlijnd, wat op zijn beurt het onderhoud van de infrastructuur efficiënter maakt. Bovendien heeft deze aanpak bijgedragen aan een snellere uitrolsnelheid en publicatie van website-inhoud.
Holland Casino blijft innoveren, met aandacht voor zowel technologie als klantbeleving. Er wordt gekeken naar de integratie van content via kiosken in het casino door middel van een webapp die gekoppeld is met Storyblok. Ook is er aandacht voor de voortdurende optimalisatie van de vestigingenwebsite, met de nadruk op functionaliteiten en klantbehoeften. met deze ontwikkelingen plaatst Holland Casino zich aan de voorhoede van technologische vernieuwing in de entertainmentsector.
Wilt u ook gebruikmaken van alle voordelen die headless development te bieden heeft? Bel Gert op 06-55716180. Of laat een bericht achter via het formulier en we nemen binnen 1 werkdag contact met u op.