Mac

A browser-sized desktop environment: a menu bar, a dock, a few windows, and a different way to wander through a body of work.

A dark aubergine plate with the Mac claim and title.
A dark aubergine plate with the Mac claim and title.

Stack TypeScript · Next.js · CSS · Motion

Most portfolios are a single scroll with sections. Mac asks a different question: what if the portfolio behaved like the place where the work was made? A menu bar, a dock, a desktop, a few windows. The visitor can open a project, move it around, and leave it where they found it.

It is not a replacement for this index; it is a second entrance to the same body of work, with a different set of affordances. The conventional pages remain the primary path, and the desktop is an experiment in what a portfolio can feel like when it borrows the grammar of the machine the work was made on.

The interface

The desktop is a stage. The wallpaper sets the temperature, the menu bar carries the time and a short status, and the dock holds the things worth opening: work, writing, about, contact. Windows are draggable, stackable, and closable. The interaction is familiar enough that nobody needs a tutorial, and strange enough that it feels like a place rather than a page.

The constraint was to keep it useful. A novelty desktop that only opens one window is a screensaver. The windows have real content: project detail, essays, a short profile, and a contact card. Search is a command palette, not a fake Spotlight that returns nothing.

The build

Next.js and TypeScript with a small window manager written for the project. The manager owns z-index, focus, position, and persistence. Window state is stored in memory, not in a database; the point is a session, not a workspace. Motion is used for opening and closing, with a reduced-motion path that swaps the animation for a simple fade.

The performance budget was the hard part. A desktop invites a lot of chrome: gradients, shadows, blur. Those are expensive and they fight the content. The final version uses flat surfaces, one accent, and a limited set of shadows. It looks like a desktop because of the composition, not because of the effects.

NOTE

The best compliment the project received was that it felt like a place someone had lived in. That is a higher bar than “nice animations.”

What I would keep

The dock. It is the navigation, the state indicator, and the personality of the whole thing in one row. A good dock is a map you can read at a glance.