JozeDzn
CLICKPLAY
Folio 2026

Web / 2026

Folio 2026

FigmaAstroReactGSAPLenis
All Work

This site started as a very tidy Figma file and slowly turned into my personal lab. It brings together most of what I do: visual direction, code, motion, 3D, and the bad habit of moving something two pixels only to move it back an hour later. Folio 2026 isn't trying to look like an agency or sell a grand creative manifesto. The goal is simpler: the way I work should be obvious before anyone reads a project description.

I wanted a portfolio with a point of view that was still fast, clear and easy to move through. If an animation looked great on its own but made navigation annoying, it wasn't doing its job. If the layout only worked on my monitor, neither was the layout.

From a tidy Figma file to a messy browser

The visual language started in Figma: oversized type, a lot of black, acid green and pink. The real questions showed up in the browser. What happens when a headline changes language? Where does a card land on a narrow screen? How long can an intro run before it becomes the thing you want to skip? Most of the useful decisions came from tuning rhythm and proportion while using the actual site.

Motion with a reason to be there

GSAP runs the opening wave, reveals, counters and small pointer reactions. Lenis handles smooth scrolling and stays synchronized with ScrollTrigger. I didn't want every empty space to move. The animations that stayed either introduce a section, explain a change or make an interaction feel better. Everything else is just noise.

Two languages, one voice

Spanish isn't a button that swaps text on top of the English site. It has its own routes, metadata and shareable case-study URLs. The browser suggests a language on the first visit; after that, the visitor's choice wins. I also rewrote the copy to get rid of portfolio filler and keep the kind of voice I would actually use outside this page.

The invisible work still counts

Astro generates static pages so the content arrives quickly and is readable in the initial HTML. React only stays where interaction needs it. The site also has canonicals, hreflang, structured data, a sitemap, social previews, keyboard navigation and a reduced-motion mode that never hides the content. It isn't the flashy part, but it is what keeps the site from falling apart outside the demo.

Still moving

It's called Folio 2026 because it is no longer that first version, and because I don't want to freeze it as a finished piece. Projects and images will change, and a few decisions that feel brilliant today probably will too. That's part of the point: the site also records how my judgment keeps changing.

Building my own portfolio reminded me of something obvious: designing the page is easy; deciding what deserves to stay is the actual work.