The Architecture of a Quiet Notebook

The Core Thesis

We are living through a period of extreme digital noise. For my personal site—the space where I bridge my professional life as a technology strategist with my work at Humanity First and my obsession with AI—I wanted the opposite of noise. I wanted a “quiet notebook.”

The vision was simple: a fast, accessible, and ultra-minimalist single-page site that feels more like a private ledger than a portfolio. In a world where we reach for React or Next.js by default, the real challenge was to see how much I could strip away while still feeling “premium.”

The Blueprint

I chose a stack that’s increasingly rare in 2026: Vanilla HTML and CSS. No build steps, no node_modules in production, no client-side hydration. Just 165 lines of semantic HTML and a carefully tuned CSS system font stack.

The logic flow was built around a “Swiss-minimal” aesthetic: monochrome, heavy on whitespace, and typographic-first. I used CSS variables for theme management (light/dark mode) and a flexbox layout that remains rock-solid from a mobile device to a Pro Display XDR.

The Pivot Points

Building “simple” is rarely easy. We hit two main technical hurdles during the agentic implementation phase:

1. The Style-vs-System Struggle: Initially, we explored more “dynamic” preloader concepts (like ASCII collapse or tessellating shutters). While technically interesting, they felt like noise. We had to pivot back to a cold-load experience. The breakthrough was realizing that speed is the best animation.

2. The Deployment Void: Moving from a local environment to Infomaniak’s managed hosting isn’t as seamless as a Vercel push. Standard GitHub Actions for FTP often failed on nested directory permissions or pathing errors. I spent more time debugging the SFTP handshake than writing the CSS.

The Breakthrough

The breakthrough came when we stopped trying to use high-level “black box” deployment actions and went back to basics: lftp. By writing a raw mirroring script, we gained precise control over the sync process, ensuring that .git and node_modules never touched the production server.

The “Golden Prompt” wasn’t a piece of UI; it was the instruction to “abandon the fancy wrapper and give me the rawest shell command possible for a mirrored sync.”

lftp -e "set sftp:auto-confirm yes;
  open sftp://user:password@host;
  mirror --reverse --verbose \
    --exclude .git/ \
    --exclude node_modules/ \
    ./ /home/clients/site_root/;
  quit"

This snippet solved the final friction point. Once the deployment was “braindead simple,” I could focus purely on the content of the Now and Work sections.

Reflection

Building this site in early 2026 taught me something vital about the “Director” role of a developer. As agentic coding becomes the standard, the job is no longer just writing syntax—it’s about preserving intent.

If I hadn’t been firm about the “quiet notebook” thesis, the AI would have happily generated a 40MB Framer Motion landing page. The skill of the future is knowing when to say “no” to the power of the tool to preserve the soul of the project. My site is now a 8KB file that loads in 100ms. In 2026, that is the ultimate luxury.