Why I built a portfolio with two modes
Most portfolios pick one aesthetic and commit. Mine has two — a geek IDE mode and a classic mode — and I think the constraint of supporting both made each one better.
When I started this portfolio, I had two ideas I couldn't choose between.
The geek mode felt like home. VS Code aesthetic, draggable tabs, a terminal at the bottom of every page, ASCII art, scanline effects. It's the version of me that loves the craft — the one who spent a Saturday tuning Framer Motion easing curves.
The classic mode felt necessary. Clean, generous whitespace, big typography. The version of me that knows recruiters and hiring managers don't want to learn keyboard shortcuts to read about my experience.
I tried to pick one. I couldn't. So I built both.
The constraint forced better decisions
Supporting two modes meant I couldn't lazily reach for theme-specific magic numbers. Every color became a CSS variable. Every layout had to work in both contexts. Every interactive element had to make sense whether you were in the IDE or in a magazine layout.
The Zustand store ended up clean:
mode: "geek" | "classic"
theme: ThemeId // 4 themes per mode
language: "EN" | "VI"A single source of truth, persisted to localStorage, and an inline script in <head> that reads it before React hydrates — so there's no flash of wrong theme.
The hidden cost
Two modes means double the surface area to test. Every new component needs both a geek styling and a classic styling. Some components only exist in one (the terminal doesn't appear in classic — it would feel out of place).
A simpler portfolio would have shipped 6 weeks earlier. But this one feels like mine in a way a single-mode site wouldn't have.
Would I recommend this approach?
For most portfolios: no. Pick one mode, polish it to a mirror finish, and call it done. The value of a portfolio is in the writing, the projects, the case studies — not the layout system.
But if the dual mode is part of the story you're telling — that you're someone who cares enough about UX to build the same site twice — then maybe. Just budget twice the time.