SEP 23, 20261 min read

I rebuilt my portfolio as a notebook (and hid a Mac inside it)

Why my site went from a full macOS desktop to a page of lined paper — and why the desktop is still in there, one button away.

  • design
  • web
  • arctiq os
An After Effects timeline from a recent project

For a while my portfolio was an operating system. You landed on a macOS desktop with windows, a dock, a terminal full of easter eggs and nine playable games. People loved poking around in it — but a lot of them never found the actual work.

So I flipped it. The front page is now a sheet of lined notebook paper, and Arctiq OS lives one click away at /os.

Why a notebook?

Most of my ideas start on paper anyway. I wanted the site to feel like my desk: sticky notes, polaroids held on with washi tape, a big pixel name in a Figma-style selection box. Retro, but not dusty.

A few rules I set for myself:

  • Everything readable first. Big headings, short paragraphs, real text for search engines.
  • No emojis. Every little decoration is an SVG icon so it looks the same on every phone.
  • It has to feel great on a phone, not just survive on one.

The fun bits

The ID badge in the About section hangs on a simulated strap. Grab it, pull it, throw it — it stretches and swings back. Under the hood it's a tiny Verlet rope:

// every frame: move each point by its velocity, add gravity…
p.x += (p.x - p.px) * DAMP;
p.y += (p.y - p.py) * DAMP + GRAVITY * dt * dt;
// …then pull neighbouring points back to their rest distance

Booting the OS plays a 1-bit pixel wipe — black squares rain down the screen, then the desktop dissolves in. Coming back does the same in white.

What I learned

Constraints make better design. Picking three fonts, five colours and one texture (paper) made every new section easier, not harder.

Ideas are worthless. Execution is everything. But you need ideas first.

More soon. If you want to talk about a project, the contact form at the bottom of the home page goes straight to my inbox.