2026
Agenlab — Webflow template
Agenlab is a Webflow template for creative studios, with 15 pages. I built it with a team of AI agents I set up for it. I wrote the brief, made the choices, fixed what was off and decided when something was good enough to ship.
Every section started as a small lab. I had four working versions built side by side on the real page, picked one in context and usually tweaked it. Whenever I corrected something, I wrote it down as a rule, so the next page already started better. Those rules, the versions I didn't use and the whole workflow turned into a playbook I can use on the next project.
I built everything in code first and then pushed it into Webflow through the Webflow MCP, as native classes, variables, components and interactions.
I worked on Figma and the code at the same time, using the Figma MCP to keep them in sync. The Figma file is what gets handed off, with the design system, every template on desktop and mobile, and a pin on each element that moves. Each pin links to its trigger, timing and easing, so whoever picks it up can see how the animations work without opening the code.
Made with
- Webflow
- Figma
- Claude Code
- MCP
- GSAP
2026
Div Supply — design & code resources
Div Supply is a membership of design and code resources: components, templates, color palettes, icons and Claude Skills. It's for people who build products with Lovable, Bolt, v0, Cursor or Claude Code, and for designers and developers working in React or Webflow.
I ended up making three pages for it. A waitlist, so people can leave their email and know when it's out, with the signups going to Loops. A landing page where the idea was to bring in a lot of movement, with motion I made in After Effects and Jitter and interactions all over it. And the app itself, the dashboard with every resource, the search, favorites, settings and all the pages in between. That one was the tricky part, figuring out how to split all that information so it's still easy to find.
I designed it in Figma and built it in Next.js with Sanity, Supabase and Stripe, through agentic coding in Claude Code. A platform this size gets hard to keep track of, so I gave the repo rules of its own. There's a spec for the platform and for its features, notes in each folder on how things stand, and a status file that gets updated after every task, so I always know where the project is and every new session picks up where the last one stopped. Five review agents check security, performance, the design system, the CMS and that status file whenever their part of the code changes.
Made with
- Figma
- Next.js
- Sanity
- Supabase
- Claude Code
- Unicorn Studio
2026
Visual experiments
These are experiments. Some started as launch posts, some as a way to try a visual or graphic style I wanted to test, and some were just me having fun while working on something else.
Most of them start with a small question, like what a template would look like on an old computer, or how the Div Supply asterisk would look made of cheese. I try something, see if it works and keep going if it does.
The tools change with the idea. Sometimes it's Blender, sometimes Midjourney or ChatGPT, and then Figma or After Effects to put it together. Some of these end up in a launch post, others just live here.
Made with
- Figma
- Midjourney
- ChatGPT
- Blender
- After Effects
2026
Texture Generator — mesh gradients
Texture Generator makes mesh-gradient backgrounds with grain, entirely in the browser. You drag color points around the canvas (double-click adds one, up to twelve), stretch them into wide bands, warp the field with noise and set the grain, then download a PNG, JPEG or WebP at any size up to 8192 pixels a side. Seven presets and three kinds of randomize (everything, colors only, positions only) are there for when you don't know where to start.
It all runs in one WebGL2 shader. Each point is a soft blob, and colors blend in OKLab by default, so two hues meet through a natural middle instead of turning muddy. The grain is generated in the same shader and scaled to the final size, so what you see in the small preview is what you get in the 4K file, which is rendered fresh at full size, not upscaled.
Every setting fits in a link: copy it and the texture opens exactly as you left it, or save it as JSON and load it later. It's React and plain WebGL with no other libraries, built through agentic coding in Claude Code and deployed on Vercel.
Made with
- WebGL
- React
- Claude Code
- Vercel
2026
Journey — Webflow template
Journey is a Webflow template for creative studios, agencies and freelancers, published on the Webflow Marketplace. It has 16 pages and six CMS collections (works, blog, team, categories, notifications and legal) and ships with its Figma file. I designed and built it end to end: the visual direction, page structure, CMS, components, responsive behaviour and interactions.
The brief was a site that feels like an experience, not a brochure, so motion carries the message: a cinematic mouse trail, hover reveals that follow the cursor, counters that run on scroll, an infinite marquee, a two-panel navigation and a notifications panel fed by the CMS. Underneath, the system stays quiet: Overused Grotesk, an off-white page with black cards, faint column lines and a single red accent.
The hard part was making Webflow's native IX3 interactions and embedded GSAP code (ScrollTrigger, SplitText and Inertia, with Lenis for smooth scroll) run as one, with no stutter where they meet. Fullstack, the next template, was built on Journey's layout.
Made with
- Figma
- Webflow
- Claude Code
- GSAP
- Lenis
2020 — 2024
C6 Bank
C6 Bank is one of Brazil's largest digital banks, backed by JP Morgan. I spent four years there working across brand and product, side by side with the branding and product teams, in a place that held a high bar for every screen and every piece that went out.
On the product side I designed interfaces for the mobile app and the digital-banking products. On the brand side I worked on the visual systems the brand, product and marketing teams shared, and on what was built from them: campaigns, websites, landing pages and marketing pieces.
I was also art director on C6's own typeface, created together with the branding team. And I managed three junior designers, guiding their visual output, the quality of their work and how it was carried out across brand and digital projects. Along the way I received C6's Catalise Award.
- Role
- Senior Product Designer
- Client
- C6 Bank
- What I did
- Product UI for the app and digital banking; brand and product visual systems; campaigns, websites and landing pages; art direction on the C6 typeface; managing three junior designers.
Made with
- Figma
- Design System
- After Effects
- Illustrator
- Photoshop
2026
Fullstack — Webflow template
Fullstack is a Webflow template for creative agencies. It's built around a fictional studio that takes a brand from identity all the way to production code, with about fifteen pages, three versions of Works and Contact, two of the Blog, and projects and posts in the CMS.
The idea was to bring in a lot of movement, animation and interaction. A good part of it is native Webflow, built with IX3, and a lot of it is GSAP on top of that. You see it right on the home, with a marquee that bends along an arc as you scroll, work cards that stack up and headlines that scramble into place.
This one was made before the Webflow MCP existed. I built the whole site code first with agentic coding in Claude Code, starting from a written style guide and plain HTML, CSS and JS for every page. To get it into Webflow, I created Webflow Converter, an app that turns that code into Webflow pages.
Made with
- Webflow
- Claude Code
- GSAP
- Midjourney
2026
MT-1 — cassette player
I've always loved the way Teenage Engineering designs things, and I kept wondering what a Spotify player would look like if they'd made one. I pictured an old-school cassette deck, and MT-1 is that idea, a 3D object you can play with in the browser.
It started as a concept image I made with GPT. I wanted the model to stay true to that picture, which meant a lot of groundwork before anything reached Blender. I split the job into separate skills in Claude Code and measured every dimension from the image, and only then started modeling through the Blender MCP.
Getting it to feel right took a lot of back and forth. I'd look at a render, decide what felt off, reshape a part or swap a material and try again, writing small scripts along the way whenever I saw a way to make each pass better.
The site came last. I chose Three.js with React Three Fiber to keep the deck alive in the browser, where you can turn it, play it and flip it to side B. Spotify's own player went blurry inside the little 3D screen, so I hid it to handle the sound and designed the deck's screen myself.
Made with
- Blender
- Three.js
- React
- Claude Code
- MCP
2026
BrewBot — coding game
BrewBot is a game I made based on The Farmer Was Replaced. I really liked how that game teaches Python by having you program a little drone on a farm, so I wanted to make the same thing for JavaScript, with my own theme. In mine you fly a coffee dripper turned drone around a café floating in the sky.
I wanted learning to feel like playing. The drone collects beans, grinds them, pulls espresso and bakes cakes, and what it earns unlocks new stations and new parts of the language, from simple function calls and loops all the way to classes. I also made the editor only suggest what you've already unlocked, so it never gets ahead of you.
The hardest part for me was running the player's code. Every move had to wait for its animation, and an endless loop couldn't freeze the game, so I made the code run in the background where you can pause it, go line by line or stop it. I built the 3D with React Three Fiber and modeled the drone and the stations in Blender through Claude Code and the Blender MCP.
I made it in one afternoon, when Claude Fable came out, mostly to test the Blender MCP. There's a lot that could still grow, but for something that was only a test it came out surprisingly good, and it was a nice way to test all the skills I have.
Made with
- Three.js
- Blender
- Claude Code
- MCP
- CodeMirror
2026
macOS — portfolio template
macOS is a Webflow portfolio template. I've always liked portfolios that look like a computer desktop, so I wanted to make one that feels like a real Mac. Instead of pages you get apps, with the projects in Finder, the about in Keynote, the blog in Notes, the contact form in Mail and the resume in Preview, and a couple of small games hidden in a folder.
I spent a lot of time on the little details that make it feel real. Windows open, drag, resize, minimize to the dock and jump to the front when you click them, and the dock grows under your cursor like it does on a Mac. I did all of it with GSAP, and on a phone it turns into simple full-width windows.
To get it into Webflow I used Webflow Converter, an app I built before the Webflow MCP existed. I wrote the whole site code first with agentic coding in Claude Code, and the converter turned it into native Webflow pages. I only used the Webflow MCP for the variables and custom code. I kept the projects and the blog as regular CMS collections, so whoever buys it can edit everything in Webflow.
Made with
- Webflow
- GSAP
- Claude Code
- MCP
- Figma
2026
Agentic — hero animation
Agentic is an experiment, not a finished template. It's the home page for a fictional studio that designs identities and builds them into websites. I didn't want another hero with a mockup, I wanted to show the work happening, so I made a browser window with a design tool inside, pulled apart into layers, with cursors, comments and selection boxes like the ones in the Webflow Designer.
As you scroll, the layers come together and the window turns to face you, then the whole thing lands in its spot in the next section. Webflow's native interactions couldn't do what I had in mind, so I wrote it all in GSAP and ScrollTrigger.
I went through a lot of ideas before getting here. My first one was a small site for an e-bike brand, but it didn't fit a serious studio, so I moved the hero to the design canvas and kept testing with agentic coding in Claude Code until I found the one I liked.
Made with
- Claude Code
- GSAP
- Lenis
- Playwright