EXE Portfolio: a dossier that boots

Most portfolio templates are the same page with different fonts: hero, grid, contact form. A recruiter scrolls thirty of them a day. EXE Portfolio bets on a different memory hook: the site behaves like software being operated, and behaving like software is itself the proof of competence a portfolio exists to give.

The metaphor is carried all the way through, not worn as a skin. The boot decrypts a dossier, the hiring pitch plays out as a scripted terminal session, and even the cursor is part of the HUD.

The CV.EXE boot looks like a JavaScript set piece, but the typing is driven by CSS. JavaScript does exactly two small jobs: it unmounts the overlay when the boot finishes and releases the page scroll. If JS never arrives, the content is still there underneath; nobody gets trapped behind a black screen.

Under prefers-reduced-motion the whole sequence collapses from about three seconds to a brief fade. That is the discipline worth copying from this build: an intro is a state you enter and exit deliberately, with an exit that works even when the fancy path cannot run.

The dependency list is next, react and react-dom. There is no GSAP, no framer-motion, no animation runtime at all: every effect is CSS or a few lines of requestAnimationFrame. The scramble effect that resolves headings out of random glyphs runs its rAF loop only while animating, then stops, so an idle page costs nothing.

The HUD cursor works the same way: the ring, dot and label move on translate3d transforms, never top and left, so the compositor does all the work and the layout is never invalidated. That is why the site stays smooth on low-end hardware.

The section that would be a bulleted skills list in any other portfolio is a terminal session here: connect to the recruitment mainframe, access the dossier, run the hiring process, watch the checks pass. The script is data, not markup, so rewriting the pitch for your own CV means editing an array of entries rather than rebuilding a component.

The terminal skin is defined as a few dozen CSS custom properties in one place. Restyling the entire dossier, from the phosphor green to the panel chrome, is an edit to that token block rather than a hunt through components. Buyers rebrand it by writing their own skin, and the source ships with the system that makes that a small job.

Start with the boot loader, because it teaches the build's general discipline: CSS does the performance, JS does the bookkeeping, and reduced motion is a first-class path. Then read the scramble hook to see the self-stopping rAF pattern, and the terminal script data to see how the pitch is authored. The token block in the global stylesheet is where your own rebrand begins.