CSS
This project taught me that CSS is so much more than just styling. I discovered how you can add interaction and animation with CSS alone, no JavaScript needed, using tricks like :has() and :checked.
I got to play around with techniques like scroll-driven animations, gradients, grid, container queries and masks. Not everything clicked right away, but applying these directly in my own control panel project taught me a ton.
Browser Tech
I used this project to design and build a form, and ended up learning a lot about HTML structure, validation and accessibility along the way. I worked with CSS and JavaScript validation, sessionStorage and datalists, and found myself focusing more and more on how a user actually moves through a form rather than just the technical side of things.
A big takeaway was that native HTML can already do a lot, and custom solutions aren't always better, especially when it comes to complexity and accessibility. I also learned to think more carefully about usability, clear labels, and supporting different users through things like aria-attributes and proper error messages.
Hackathon
I took part in a hackathon with team The VOID, where we built a website for SRON - Nebula Xplorer in 4 days. It was an intense, but working with my teammates was genuinely fun and I learned a lot from it.
Working in a team meant we had to switch gears fast and make decisions under real time pressure. In the end our team took first place, which made the whole thing even more rewarding.
API
The Sky Above is an API based website made with Astro and is live on OnRender. It takes your location and shows you the position of the sun and moon above you. You can also search for any city in the world and compare those positions to each other.
Working with APIs like geolocation, Open-Meteo and astronomy data showed me how powerful external data can be when you combine it well. Building with APIs was genuinely satisfying, but it also demanded a solid understanding of async code, documentation and structure.
HCD
For this project I had to make a website that was only usefull for one person, this person is Darice. She became deaf at a later stage in her life, she wanted a website that would make her enjoy watching films more. I ran several rounds of testing with Darice, who ended up playing the biggest role in sharpening my concept. The first tests made it clear that my ideas were still too abstract and that I was focusing too much on color and visual effects. Her main feedback was that clarity, calmness and being able to follow who's speaking matter way more than decorative elements.
Based on that feedback I adjusted the design step by step. Colors became less dominant and more supportive, while I put more emphasis on subtitles, speaker indication and subtle animations that support the content instead of distracting from it.
The end result is an interface that's less experimental and visually busy, but fits her needs much better: clear, readable and easy to follow. The feel now comes not from standalone effects but from small, subtle interactions that strengthen the experience without disrupting the text.
Meesterproef
As the final project of the Web Design and Development minor, I worked with a team to build a digital learning platform for Stichting Mensenkenners, an organization that trains staff in (semi-)public spaces to interact more inclusively with people with disabilities. 8 out of 10 interactions in public spaces feel uncomfortable for someone with a disability, not because of physical barriers, but because of social awkwardness.
We turned their existing in-person training into a self-paced online platform with a personal dashboard, interactive modules on awareness, perspective and accessibility, a disability simulator and progress tracking. It's built with HTML, CSS and JavaScript in Astro, Supabase for authentication and the database, and a custom API for the course content.
FC Hyena remake
For this frontend assignment I rebuilt the FC Hyena website completely from scratch. Along the way I also improved its accessibility by adding both light and dark mode, and making sure it works well with screen readers and other assistive tech.
You might actually recognize the layout, I used it as the foundation for this very portfolio.
Love Me
Love Me is a playful little interactive website where you press buttons to keep a heart beating just right.
It's built with pretty basic JavaScript, this was one of my first times using JavaScript, so it holds a special place for me.
Public City Jazz
For this assignment I designed a multi-device interactive poster for Public City Jazz, styled after the house style of the Municipality of Rotterdam.
Alongside the prototype I also made a motion poster in Adobe Illustrator, inspired by a track from one of the performing artists.
pinq your ponq
For this Human Computer Interaction assignment I designed an extension of the pinqponq website, letting users customize their own bag.
'pinq your ponq' sticks closely to pinqponq's original house style, and was made as a static prototype in Adobe Illustrator.
