Terug naar Portfolio

Digitaal

Brouwerij Rolduc

Eén website voor bezoekers, bierliefhebbers en horeca, met een webshop, een bierpakket naar keuze en een besloten bestelportaal.

De homepage van Brouwerij Rolduc
Context
Klantopdracht voor Brouwerij Rolduc
Jaar
2025–2026
Rol
Ontwerp, bouw, uitrol en onderhoud
Team
Solo; de brouwerij leverde foto's, teksten en feedback
Techniek
HTML, CSS en JavaScript, Tailwind CSS, Supabase, Resend, pdf-lib

In het kort

Brouwerij Rolduc brouwt sinds 2013 abdijbier op Abdij Rolduc in Kerkrade. Ik maakte één website voor drie groepen: bezoekers van het proeflokaal, mensen die bier bestellen en horecazaken die inkopen via een besloten portaal. Samen met de brouwerij testte en verbeterde ik de site in meerdere rondes, met een pilot bij vier horecazaken.

Aanleiding

Hierna 02 Mijn rol

De brouwerij wilde één website voor drie groepen: bezoekers van het proeflokaal en de rondleidingen, mensen die bier willen bestellen, en horecazaken die bij de brouwerij inkopen.

Online betalen hoefde niet. Je bestelt vooraf en betaalt bij het afhalen in de Abdijwinkel.

Mijn rol

Hierna 03 Onderzoek

Ik maakte de site alleen: ontwerp, bouw, uitrol en onderhoud, en het contact met de brouwerij. De brouwerij leverde de foto's, de productinformatie en feedback.

De eerste versie ontwierp en codeerde ik zelf, van de kleuren tot de opbouw. Ik weet precies hoe de site in elkaar zit, zodat ik er altijd zelf iets aan kan toevoegen of weghalen. Ik houd de code schoon en licht. Zo kan Google de site goed lezen en kost elk bezoek weinig energie.

Lees meer over mijn rol

Naast de site ontwierp ik etiketten voor de brouwerij, zoals die van Zondig Genot, Vrome Tinus, Joepeman en de specials, het blik van de Blonde Non en het eenvoudige ontwerp op de dozen. Ook de Blonde Non in 3D, te koop in de Abdijwinkel, is van mij.

Vier etiketten van Brouwerij Rolduc: de flessen van Zondig Genot, Vrome Tinus en Joepeman en het blik van de Blonde Non
Fig. 1 Etiketten die ik ontwierp voor Zondig Genot, Vrome Tinus, Joepeman en het blik van de Blonde Non. Joepeman is hier een mockup op een fles.

Onderzoek

Hierna 04 Ontwerp en prototype

Voor de webshop keek ik hoe grote webwinkels werken, zoals Coolblue, Bol en Picnic. En ik zocht de regels voor online drankverkoop uit: allergenen vóór de aankoop, prijs per liter en een leeftijdscheck.

In online reviews schreven bezoekers dat de brouwerij lastig te vinden is op het abdijterrein. Daarom kreeg de bezoekpagina een apart blok over de weg op het terrein.

Lees meer over onderzoek

Uit zoekwoordrapporten bleek dat er vaak op 'abdijbier' wordt gezocht. Dat woord staat nu in de titel en de eerste zin van de homepage.

De webshop van Brouwerij Rolduc met filterknoppen per soort en het aantal producten, een zoekveld en sorteren
Fig. 2 De webshop: filteren met aantallen, zoeken en sorteren, zoals bij grote webwinkels.

Ontwerp en prototype

Hierna 05 Testen en iteraties

De vormgeving volgt de abdij: donkergroen voor de kloostermuur, goud voor het bier en verder veel rust. Het sierlijke lettertype staat alleen bij de naam.

Ik controleerde het contrast van alle kleurcombinaties. Goud is daarom nooit tekstkleur op wit.

Lees meer over ontwerp en prototype

De toon is warm en Limburgs: 'je' voor bezoekers, 'u' voor de horeca. Alles staat in een huisstijlgids voor de brouwerij.

Productpagina van Kloeëster IPA met de prijs per fles en per liter, het eerstvolgende ophaalmoment en een melding over 18+
Fig. 3 Productpagina: prijs per liter, het eerstvolgende ophaalmoment en de leeftijdsgrens staan direct bij de knop.
De bierpakketbouwer: kies het aantal flessen en de bieren, en zie rechts de doos vollopen
Fig. 4 Het bierpakket naar keuze: de doos vult zich terwijl je kiest.

Testen en iteraties

Hierna 06 Resultaat

Na feedback van de brouwerij op het horecaportaal kwam er een duidelijke bevestiging bij Opslaan: een klant dacht dat de knop kapot was. Leveren kan nu alleen op donderdag, en de bestelmail werd een pakbon om te printen.

Een testronde als klant, op desktop en mobiel, plus een codereview vond vier fouten die tot een verkeerde levering konden leiden. Daarna volgde een pilot met vier horecazaken.

Lees meer over testen en iteraties

De brouwerij gaf eerder al een lijst met tekstwijzigingen. Die heb ik doorgevoerd.

Fouten uit het echte gebruik bootste ik na, loste ik op en testte ik opnieuw. Zo bleef de webshop bij sommige bezoekers laden door oude bestanden in hun browser.

Het bierpakket begon bij maximaal 12 flessen. Op verzoek van de brouwerij gaat het nu tot 24, met een doos die meegroeit.

De oude webshop op een telefoon, met het label Voorheen
Fig. 5 Voorheen: de webshop op een telefoon.
De vernieuwde webshop op een telefoon, met het label Nu
Fig. 6 Nu: productkaarten met prijs per liter en een knop om direct te bestellen.
Het bestelscherm van het horecaportaal op een telefoon: zoeken, filteren en per product een aantal kiezen
Fig. 7 Het horecaportaal, stap 2 'Kiezen', met demogegevens.

Resultaat

Hierna 07 Wat ik leerde

De site staat live, met webshop, productpagina's, cadeaus, een bezoekpagina in drie talen en een besloten bestelportaal voor 69 horecazaken.

De brouwerij past producten, prijzen, foto's en voorraad zelf aan. De homepage laadt nu 1,8 MB in plaats van 9,2 MB, de webshop 0,9 MB in plaats van 15,6 MB.

Bekijk brouwerij-rolduc.nl (opent in een nieuw venster)

De bezoekpagina met een luchtfoto van Abdij Rolduc en snelle feiten over openingstijden, parkeren en bereikbaarheid
Fig. 8 De bezoekpagina, in het Nederlands, Duits en Engels.

Iets vergelijkbaars nodig? Vertel over je project

Wat ik leerde

Hierna Meer werk
  • Goed werken met Supabase, en hoe ik een duidelijke, prettige webshop bouw.
  • Een veilige login bouwen, met een optie voor als je je wachtwoord vergeten bent. Die gebruik ik nu ook op andere websites.

Meer werk

Alle projecten

  • Branding

    Sanctus Fusion

    Het eigen bier van een café, alleen van de tap: van etiket en brandboard tot taplens, tafelkaart en shirt.

  • Digitaal

    Klankstad: WMC Kerkrade 1951

    Een tweetalig keuzeverhaal over het eerste Wereld Muziek Concours, waarin de grijze mijnstad per hoofdstuk weer kleur krijgt.

Een website of interactief verhaal laten maken?

Vertel me wat je in gedachten hebt. Je krijgt antwoord van mij persoonlijk, meestal binnen 3 tot 4 werkdagen.

Neem contact opof mail naar mijn e-mailadres