Olisa Umenyiora

Case study

olisa.io OS

A working retro operating system hidden underneath my portfolio. Four eras, draggable windows, little apps you can actually open, and an AI ant living in the system tray. A nostalgic project I build for fun, and one I am still very much filling in.

Personal project, still in progressOpen the OS

See it live

This is the real thing, running right here. Drag a window, open an app, switch eras. It is a work in progress, so expect a few rough edges, and it is happiest on a desktop screen.

olisa.io/os/xpLive
Open the live site

The idea

The portfolio you just came from is the calm, quiet part. I wanted the opposite hiding underneath it: the computers I grew up on, rebuilt in the browser, simply because it would be fun to make. Peel the page back and you land on a desktop you can actually use.

What is in it

Four erasWindows XP, Windows 98, Windows 7 and Mac OS 9, switched from a little retro file cabinet.
One set of componentsEvery window, taskbar and start menu is the same React component, restyled per era. No copy-pasted themes.
Real little appsA browser, a terminal, Notepad and My Documents, in draggable, resizable windows with sound.
Oli, the AI antAn ant colony living in the system tray. Oli leads a few named sub-agents, ages from your first visit, and is wired to take a real AI brain through an API.

How it works

The interesting part is that the four operating systems are not four codebases. They are one set of components wearing different clothes.

1One set of React components builds the desktop, windows and menus2A data-theme attribute picks the era: xp, win98, win7 or mac3Per-era CSS and a config object restyle everything4Out comes four operating systems with no duplicated components

Still building it

It is not finished, and that is sort of the point. Windows XP is the most complete; the other eras share its bones and I fill them in when I feel like it. This is the project I open when I want to build something with no brief and no deadline.

The stack

Frontend
Next.js 16 (App Router)React 19TypeScript
Windows & motion
react-rnd (drag + resize)Framer Motion
State
Zustand (per-OS window store)
Theming
xp.css98.css7.csshand-written Mac OS 9 themeconfig-driven CSS variables
AI
Oli ant colony (API-ready brain)
Open the OS← Back to olisa.io