Hello! I’m Dylan Brouwer, a Dutch digital designer and Webflow developer working on the intersection of name design, UX, and movement. I assist manufacturers and inventive groups craft expressive web sites that really feel daring, intuitive, and constructed to face out.
Whereas I work principally in no-code (Webflow is my playground), I’ve all the time been excited by the overlap between design and improvement. What actually lights me up is how right this moment’s instruments let designers like me carry interactive experiences to life, while not having to put in writing every thing from scratch.
A couple of years in the past, I by no means imagined I’d have the ability to construct the form of expressive, animated, interaction-rich websites I create right this moment. Certain, I’m not your traditional “technical dev,” however with Webflow, some front-end fundamentals, a little bit of ChatGPT, and sources like Osmo Provide in my toolkit, I can get surprisingly far. And actually, that feels fairly superior.
It’s additionally a bit surreal (and form of humorous) to be featured in a Designer & Developer Highlight. For a very long time, I didn’t even contemplate myself a developer. Codrops has been an enormous supply of inspiration for me all through my journey, so it’s an actual honor to share my work right here.
Portfolio ©Design by Dylan
- Kind: Private portfolio
- Tech: Webflow, GSAP (ScrollTrigger), Spline, Osmo Provide
- Collab: Alexis Sejourne (Inventive Developer)
- Web site: https://www.dylanbrouwer.design/
Your individual portfolio is all the time the toughest, proper? You need it to impress fellow designers, really feel like you, and nonetheless work for potential shoppers who simply wish to get a way of what you do. My new web site is an try and stability these issues, daring visuals, {smooth} interactions, and sufficient respiratory room to make the UX really feel calm and intuitive.
Probably the most complicated piece was the homepage hero: I needed to indicate a looping showreel video inside a rotating 3D show mockup, with each components responding to scroll. That turned out to be loads trickier than anticipated.
I first generated a rotating mockup video utilizing Midjourney and turned it into a picture sequence animated with GSAP ScrollTrigger. Then, with the assistance of Alexis Sejourne, we created a clip-path masks for the embedded video that matched the mockup’s display and synced completely with the scroll animation. Getting that scroll sync to really feel fluid was a technical puzzle, however the finish end result actually brings the web page to life.
This undertaking taught me how you can design with goal, not simply to impress, however to speak. My previous portfolios leaned an excessive amount of on the expertise aspect, however this time I centered on readability and circulate, designing one thing expressive, however not overwhelming.
Palmer Dinnerware
- Kind: Product web site / interactive expertise
- Studio: Created at UNCOMMON
- Tech: Webflow, GSAP, Vanilla JS
- Collab: Alexis Sejourne (Inventive Developer)
- Web site: https://www.palmer-dinnerware.com/
At UNCOMMON, we reimagined the web site for Palmer Dinnerware as a digital canvas slightly than a conventional e‑commerce catalog, an area the place guests may discover the total assortment in a tactile, immersive method. As a substitute of clicking by pages, customers scroll or drag by a visible showcase that brings the craftsmanship of every piece to life.
The idea was easy however bold: make the web site really feel like an expertise, not only a store. You’ll be able to filter merchandise by coloration, form, or dimension immediately throughout the canvas, or swap to a structured grid view. Dive deeper into a group, and also you’re guided by a curated, horizontal scroll lookbook designed to evoke temper and storytelling.
The most important problem was bringing this interactivity to life, particularly balancing scroll, drag, and click on interactions seamlessly. Movement performed a key position: GSAP’s Flip plugin gave us buttery-smooth transitions and a way of physicality that matched Palmer’s model. On the technical aspect, Alexis Sejourne jumped in to assist carry the homepage expertise collectively, particularly in syncing the drag and scroll habits with the real-time filtering of plates throughout the canvas. His experience was essential in making every thing really feel fluid and intuitive with out compromising efficiency.
Constructing this with Webflow and customized JavaScript was an amazing train in pushing no-code to its limits whereas protecting efficiency and UX high of thoughts. It’s a kind of uncommon initiatives the place design, dev, and idea all clicked completely.
Dolsten & Co.
Dolsten & Co. is a brand new AI-first artistic studio with a daring id, and we needed their web site to really feel simply as alive and expressive. The standout characteristic? A looping 3D flower animation that begins as a preloader after which transitions seamlessly into the homepage hero, reacting subtly to scroll for added depth and movement.
That animation was the core technical problem. Working with Yan Paul Dubbelman, who created the gorgeous 3D flower, we used two transparent-background movies: one for the preloader, and one other for the idle animation. Utilizing a GSAP timeline, we synced them completely so the transition felt seamless, whereas additionally layering in scroll-based rotation for added interactivity.
What makes this undertaking particular isn’t just the end result, however the pace: we went from design to improvement in simply two weeks. It was an amazing reminder that with the precise focus, staff, and instruments, you may carry a high-quality, interactive web site to life, even on a decent timeline.
Mythic Codex
- Kind: Experimental Web site (Awwwards Masterclass Venture)
- Tech: Webflow, GSAP, WebGL
- Guided by: Niccolò Miranda (Awwwards Masterclass)
- Web site: https://mythic-codex.webflow.io/
Mythic Codex was the results of a 10-week artistic deep dive throughout Niccolò Miranda’s Awwwards Masterclass, a course that pushed my limits like no undertaking earlier than.
From selecting a story-driven theme, crafting a novel visible course, and designing a full UI to implementing customized code, animations, and even a WebGL interplay, this undertaking was a full-stack artistic problem. It was the primary time I touched WebGL, and that half alone was intense. The technical complexity was actual, however it additionally opened a brand new door: studying how you can code alongside ChatGPT, debug stay points, and method technical issues with curiosity as a substitute of worry.
Past the tech, what caught with me most was the artistic self-discipline it demanded. Niccolò’s course of taught me how you can assume extra conceptually, how you can translate summary concepts into tangible interactions, and how you can preserve the why behind the design entrance and heart, even when issues get complicated.
This undertaking actually expanded my concept of what’s attainable inside Webflow when mixed with code, and it marked a shift in how I method storytelling by digital experiences.
Wrapping Up
After nearly 10 years working in-house (principally in design-led roles) I lastly made the leap to go full-time freelance. I’ve been freelancing on the aspect for a number of years, however this yr felt like the precise second to go all in.
Proper now, my largest problem (and motivation) is shaping this subsequent chapter: discovering the precise collaborations, pushing my expertise additional, and constructing a artistic profession by myself phrases. I lately began working with Future Three Studio on an thrilling redesign for Aardvark E-book Membership (Canada), plus an excellent enjoyable web site for Pizza Amici, a pizza meals truck firm (Netherlands). And there’s extra within the pipeline. I’m stuffed with vitality and may’t wait to see what this yr brings.
If you wish to comply with alongside, take a look at my work and updates on Instagram and Linkedin. Let’s go!
