PabloZarate™ Hero animation

A design engineering case study

Context

My portfolio has been my learning lab since 1999: I hacked table layouts to escape the 800x600 grid, wrote ActionScript when Flash ruled the world, customized WordPress when browsers moved on (hello PHP), and eventually settled into Adobe Portfolio when a custom stack stopped fitting my professional pace. It looked like me on the outside, and under the hood it hurt — no semantics, poor SEO, questionable accessibility. The same way a good carpenter cares about the wood inside the furniture, that gap bothered me for years. AI gave me the chance to close it, and to use my own website as the case study.

Homepage of pablozarate.com on desktop
Homepage of pablozarate.com on a mobile viewport

My focus

  • ⦿Design and build as a single motion, working two agents in parallel: Claude planning and orchestrating like a director, Codex implementing like an engineer — it was Codex that proposed moving from static HTML to a modern stack.
  • ⦿Keep every aesthetic decision mine. The AI built what I specified, which is why there's no slop in sight: replicating my site pixel by pixel took one prompt and the time it took to make a coffee; the judgment behind it took 25 years.
  • ⦿Spend the time I saved on what I hadn't planned: accessibility, backward compatibility, password-protected case studies, and a tailor-made CMS — part of designing properly is having the conviction to build bespoke when that's the right call.
  • ⦿Design for the new first reader. Agents reach this site before people do, so it declares who I am in structured data, tells each bot what it can do with my content, and renders complete before any script runs.
The tailor-made CMS built for this site
The projects page of pablozarate.com
The PabloZarate Lab WebGL playground at lab.pablozarate.com

Outcome

A site that loads in under a second, scores 99/100 on performance, and explains itself to humans and machines alike — designed, built and shipped by one person. I wrote the full story on Substack. Design engineering is just the old craft with new tools.