Makersnota
Hoe deze showcase is gebouwd
Nachtbloei is een conceptdemo van Weblify: een studio die snelle, doordachte websites bouwt voor Vlaamse KMO's en zelfstandigen. Deze pagina legt kort de ontwerp- en technische keuzes achter de showcase uit, voor wie onder de motorkap wil kijken.
Het concept
Nachtbloei is een fictieve, derde-generatie vuurwerkfamilie uit Hasselt, ontworpen als showcase binnen een reeks van vijf Weblify-portfoliosites. 90% van de site is een technisch cueblad: monochroom, tabulair, bijna zonder beweging. Op één exact scrollpunt (het aanvangsschot in de opdracht-tijdlijn) detoneert de pagina in het enige volle-kleur-moment van de site, waarna alles terugvervaagt naar grijs.
De techniek
De burst is geen video: het is een echte Three.js-scene met een eigen vertex- en fragment-shader. Elk deeltje krijgt een startsnelheid, een zwaartekracht-boog en een drag-demping (een exacte exponentiële-integraal, geen benadering), plus een verbrandingstemperatuur-kleurramp gebaseerd op reële pyrotechnische metaalzout-chemie: goud van strontium/houtskool, cerise van strontiumzouten, cobalt van koperchloride, het lastigst te bereiken kleur in echt vuurwerk en daarom ook het zeldzaamst in de simulatie. Trail-decay komt van gestaggerde spawn-vertragingen per staart-punt, niet van een aparte trail-textuur.
De drempel, geen scroll-koppeling
De burst is doelbewust NIET doorlopend aan de scrollpositie gekoppeld. Een IntersectionObserver op de aanvangsschot-rij triggert de sequentie precies één keer wanneer die rij voor +60% in beeld is; daarna speelt de simulatie haar eigen, vaste tijdslijn af (~3,9s) los van verder scrollen. Dat is bewust: het moet aanvoelen als een grens overschrijden, niet als een geleidelijke onthulling.
Toegankelijkheid van het signature-moment
Bij prefers-reduced-motion wordt Three.js zelfs niet gedownload: een statisch, al-bevroren SVG-frame in dezelfde kleurramp toont de kleur-payoff, gevolgd door een trage (900ms), waarneembare kleur-fade terug naar het cueblad. Geen deeltjesbeweging, geen geluid, content blijft volledig leesbaar.
Nieuwsgierig naar een gelijkaardig traject voor je eigen zaak? Neem contact op via atelier@nachtbloei.be.