This site existed in my head for two years.
The concept was clear: a surface that looks flat, almost austere, and that reveals a depth in three dimensions the moment you interact with it. Simple shapes, a circle, a square, proportions on the golden ratio. Calm as the normal state, movement as the reward.
The idea was not missing. The time was.
The problem was never the idea
I have been doing motion for a long time. Long enough to have animated with TweenMax under Flash, twenty years ago: the ancestor of GSAP, before GSAP was called that. Movement, curves, timing: that is ground I know.
But one thing has not changed in twenty years: 3D on the web eats time. Three.js is powerful and thankless. Between the idea of a scene and the version that runs at sixty frames per second on a phone, there are days of work. Weeks if you count the back and forth, the memory leaks, the business of syncing scroll and rendering.
When you are freelance, that time is time you do not have. It goes to clients. The personal project waits its turn, and its turn never comes. Two years of the concept sleeping in a corner, complete but unfeasible within a freelancer’s time budget.
Then the means of production changed
Not the idea. The means. That is a distinction I find important: AI invented nothing in my place. The concept had been there for two years, whole. What changed is that the cost of production fell to the point of making feasible what had not been.
Here is how it went, step by step.
01 · Setting the message before drawing anything
Redoing a portfolio means first redoing your positioning. My old site said « I build websites ». The trade had changed under my feet without the sentence following.
I spent the first phase entirely in text. No mockup, not a pixel: just formulating what I actually do today, now that AI has taken over repetitive execution and my work has shifted towards decision.
The result comes down to three verbs: imagine, decide, orchestrate. AI executes.
That step cost nothing in production time, but it conditioned everything. A site whose message is vague stays vague, whatever the quality of the code.
02 · Storyboarding the movement, not the screens
My concept is temporal. The background moves, reveals itself, comes back to calm. A frozen mockup cannot describe that: it shows an instant, not a sequence.
So I worked in storyboards rather than mockups. Each interaction cut into four frames: the resting state, the trigger, the reveal, the return. In total low fidelity: grey boxes, no colour at all.
That is where Claude Design came in, to produce those sequences quickly and test several of them. Three home page structures, two project list ones. I kept one. The rest went in the bin without regret, because nobody gets attached to a grey box.
Twenty years earlier, that exploration work would have taken days. Here, a few hours.
03 · Answering the only question that mattered
The whole concept rested on a technical bet: making readable HTML blocks coexist with a 3D scene in the background, synchronised, without killing performance or accessibility.
If that bet did not hold, there was no point going further.
So before drawing anything, I had a minimal prototype built. A WebGL canvas in the background, a few blocks over it, each block doubled by a shape in the scene, the whole thing synced to the scroll. Ugly, bare, visually uninteresting. Just an answer: does it hold.
It held. And that is exactly the kind of test I had been putting off for two years because, on its own, it represented several days of setup. Here the prototype was standing in a fraction of that time. The unblocking, literally, happened there.
04 · Iterating from the terminal
With the prototype validated, it had to become a real site. That phase happened in fast iterations, in the terminal, with AI piloting the execution.
That is the phase where the assistance is most spectacular: a lot of code, repetitive structures, adjustments in a loop. And it is also the most treacherous. The model produces code that works, but that reproduces what it has seen most: the responsive of ten years ago. Breakpoints everywhere, frozen pixels. Every pass required correcting the heading.
That is where twenty years in the trade earn their keep. Not in writing the code, but in seeing immediately when it is heading the wrong way.
05 · Rebuilding properly in Astro and EVA CSS
A prototype is not a site. Once the concept was proven, I rebuilt everything under Astro: static generation, zero superfluous JavaScript, typed content collections for projects and notes. The 3D and the animations loaded on demand, never imposed.
All the styling rests on EVA CSS, my design system. That is not misplaced pride, it is the right tool for this particular case. A constrained system (fluid scales, OKLCH tokens) produces predictable output. And when AI generates a component leaning on a closed vocabulary, it goes wrong far less than on free-form CSS.
99% fewer breakpoints. The scale breathes between two bounds instead of jumping from step to step.
The design system, which I have been refining for years, found its best ally there: it makes assisted production reliable.
06 · A back office without a server
A portfolio lives, it gets updated. I wanted to be able to write a note or add a project without opening any code, and to be able to reproduce that setup for my clients.
I settled on Sveltia CMS. Light, no database, no server. The interface writes directly into the repository, the commit restarts the build, the site is up to date in a minute. The whole configuration fits in one file.
07 · Deploy and forget
Netlify. Repository connected, automatic rebuild. That part should never become a topic, and it did not.
What I take from it
The concept of this site has not moved in two years. Nor have the skills: I was already doing motion, CSS, art direction. The golden ratio I was already using in a client framework years ago.
What changed is the cost of production. What took weeks of thankless execution now takes a fraction of that. And that shift changes something fundamental in the trade: value no longer sits in the ability to produce, but in the ability to decide what to produce, and to judge whether it is good.
The ideas I had been carrying for two years were the same. I was simply, finally, able to get them out of the drawer.
One obvious thing remains, and it is quickly forgotten: knowing in ten seconds whether a scene is right, whether an animation rhythm holds, whether a build is clean, does not get improvised. It comes from twenty years of having done it by hand. The tool that replaces execution makes the experience of execution more precious, not less.
The drawer is empty now. It was about time.
This site, you are on it. EVA CSS is open source: eva-css.xyz.
