TLB/Logs

I finally built my personal website

As many designers know, building for yourself is harder than building for a client.

That's partly why I worked on v1 / v2 / v3 / v3-final and v3-final-final of my portfolio and none of them saw the light of day. Or should I say, the light of production.
Eight years after graduating, I've never really had a portfolio or a personal site.

The need has been growing on me lately. A personal site is different from a social media account anyway. Instagram, X, and the rest are interesting for reach, but let's be honest: as users, we don't control much. I wanted something that was mine.

A new way to ship

A few months ago, something kind of magical happened for designers and idea people: agentic development. With tools like Cursor, Codex and Claude Code, the barrier to shipping a website or a simple project has dropped close to zero. You can now have an idea, write it or say it out loud, and an LLM-powered agent can handle the dev process end to end.

Claude Code running in the terminal
Claude Code running in the terminal

My goal was simple: ship an imperfect version quickly, on a stack that lets me update content and iterate as I go.

So I sketched the structure with Claude chat in the desktop app. I loosely described what I needed and the ideas I had in mind, and we iterated on a starter prompt to put in Claude Code.

I use Claude in the desktop app to kickstart any new idea
I use Claude in the desktop app to kickstart any new idea

The stack

  • Claude Code in the terminal as my coding agent
  • Node.js for the infrastructure
  • MDX based on markdown for articles (logs)
  • Vercel for hosting (free tier)
  • Vercel Analytics to track visits

I wanted something light, flexible and easy to maintain.

From prompt to canvas

On the design side, my process evolved with new AI tools and workflows. I started by putting ideas straight into the terminal. It got me past the blank page and into a first version which helped me decide what I really wanted for my personal website because I could now see it live. Building a first crappy version (v1) helped me sharpen what I actually wanted and, just as importantly, what I didn't want. Interacting with this v1 made me realize, among other things, that I didn't want a full-width grid but rather a centered narrow container.

To summarize the first part of my process: I started with "code", dropping ideas into the terminal, testing interactions, etc., and then I went back into Figma because at this time, the canvas environment was better suited for exploring the solution space, and that first pass is what pointed me toward the current direction.

v1 — fully vibe-coded (no design)
v1 — fully vibe-coded (no design)

Back in Figma, I was able to explore new layouts, shapes, colors, typographies, etc. It was really interesting to discover a new way of shaping things: describing ideas with voice or text and seeing it instantly live. Doing back and forth with design and code is now an important part of my design process.

v2 — exploring layouts on the Figma canvas
v2 — exploring layouts on the Figma canvas

From canvas to production

This way of using AI seems pretty common now but it still feels magical: translating Figma screens to production-ready code. At this point I had some screens designed in Figma, ready to be integrated into code. So I exported my homepage screen and asked Claude Code to code it with all the features and specs I didn't even ask for (like hover states, etc.)

From then on, I iterated step by step asking Claude Code to try X and change Z until the result felt good enough, one screen at a time, one prompt at a time.

Crafting micro-interactions

What I learned

AI is not a magical tool. Of course you can "build anything" on paper, but the paradigm shift is in knowing what to ask, how to articulate things and ideas, and what to prioritize to make the result good and relevant to the purpose.

Starting in the terminal gave me something to react to. Going back to Figma let me redesign without re-prompting every micro-decision. Neither tool was enough on its own, and that's the actual shift.

The bottleneck is now the "good enough" instinct. Claude Code, Codex or Cursor will ship whatever you accept. Most of my time wasn't spent building but articulating micro design decisions like "smaller, less text, try that etc..".

We as users now have plenty of tools to explore new workflows, new ways of trying out ideas and expressing our creativity.

What's next

This site is a logbook. A place to share experiments as soon as a creative spark or idea hits.

I wasn't really comfortable with the idea of separating what I'm working on and who I am because what I'm building is part of myself. What's more, whom you worked for is not enough to highlight who you really are.

Now the goal is to keep this website alive and update it as projects and new adventures come up. It's a living thing, and I hope it'll stick with me for a while.

Thanks for reading me and welcome to my little corner of the internet.

/TLB