SUPOPS – Pre-order formulier voor Tropical Icesticks


SUPOPS – Pre-order formulier voor Tropical Icesticks


Voor SUPOPS, een merk dat vrolijke, tropische ijsjes verkoopt, heb ik een volledig interactieve en gebruiksvriendelijke pre-order website gebouwd. Het doel van deze website was om klanten eenvoudig en snel hun bestelling te laten plaatsen, zonder ingewikkelde administratie of loginsystemen. Alles draait om gemak, uitstraling en plezier – precies wat bij het merk SUPOPS past.


De kern van het project was een overzichtelijk pre-orderformulier waarmee bezoekers via hun telefoon of computer hun favoriete smaken konden aanklikken, het gewenste aantal konden opgeven en hun contactgegevens konden achterlaten. Deze gegevens worden automatisch verzonden naar het e-mailadres van SUPOPS via Formspree, een dienst waarmee je gemakkelijk formulieren kunt afhandelen zonder back-end.


Het formulier is visueel aantrekkelijk ontworpen, met een vrolijke achtergrond in verloopkleuren (limegroen naar roze) en speelse animaties. Bij het selecteren van smaken verschijnt een kleurrijke bounce-animatie en zodra de gebruiker op ‘Bestel Nu’ klikt, volgt er een vrolijke confetti-explosie over het scherm. Na het indienen van het formulier verschijnt een bedankpagina en wordt de bezoeker automatisch teruggestuurd naar de startpagina.


De smaken worden gepresenteerd als gekleurde kaarten met emoji’s van fruit, zodat de gebruiker niet alleen tekst leest, maar ook visueel wordt aangesproken. Dit maakt het selecteren intuïtiever én leuker, vooral op mobiele apparaten.


De site is gebouwd in plain HTML, CSS en JavaScript, zonder gebruik van frameworks, om de snelheid en laadtijd zo laag mogelijk te houden. Alle elementen zijn volledig responsive opgebouwd met behulp van flexbox en media queries, zodat de layout zich aanpast aan zowel grote schermen als mobiele telefoons. Ook bij de kleinste schermgroottes blijven knoppen, tekst en animaties goed zichtbaar en klikbaar.


Een belangrijke wens van de opdrachtgever was dat klanten geen prijzen te zien kregen en het echt puur om smaak en hoeveelheid draaide. Ook moest het formulier eenvoudig te beheren zijn, zonder dat er een CMS of database aan te pas komt. Formspree bleek hiervoor de perfecte oplossing.


Wat dit project bijzonder maakt, is de combinatie van eenvoud in techniek en speelsheid in ontwerp. Het resultaat is een laagdrempelige én aantrekkelijke bestelpagina die volledig past bij de uitstraling van SUPOPS.


SUPOPS – Pre-order formulier voor Tropical Icesticks


Dit project laat goed zien hoe je met beperkte middelen een volledig functionele, professionele én visueel unieke pagina kunt neerzetten. Ik ben verantwoordelijk geweest voor het volledige ontwerp en de implementatie – van wireframe tot frontend tot e-mailkoppeling.