How I Built My 8-Bit Portfolio with Claude Opus 4.5 on Antigravity

Source: Dev.to

The Vision: Cyberpunk Meets Nostalgia

My long‑standing fascination with the aesthetic of old‑school video games and the neon‑soaked visuals of cyberpunk fiction naturally guided my vision. When rebuilding my portfolio, I aimed to create a digital experience that felt like stepping into a futuristic arcade—a place brimming with pixelated fonts, glowing terminals, and nostalgic scanlines.

The challenge was to make it more than just a gimmick. A portfolio needs to be functional first: it must showcase real work, be accessible, and actually help me connect with potential collaborators and employers. The 8‑bit aesthetic had to enhance the experience, not get in the way of it.

Starting with Design, Not Code

Before writing a single line of code, I spent time in Figma mapping out the experience. I’m a firm believer that jumping straight into code leads to endless refactoring later. Having a visual reference meant I could make design decisions without the pressure of implementation looming over me.

The design process helped me establish the color palette—electric cyan, neon green, sunset orange, and deep‑space purples against dark backgrounds. I mapped out the sections:

• Hero – my name in pixelated glory
• About – a story‑driven bio
• Skills – animated progress bars
• Projects – displayed as terminal windows
• Contact – a command‑line‑style form

Enter Claude: My AI Pair Programmer

Here’s where things got interesting. I’d been experimenting with AI coding assistants, but my experience with Claude Opus 4.5—via an agentic coding platform called Antigravity—was different from anything I’d tried before.

Instead of treating the AI as a fancy autocomplete, I approached it as a true collaborator. I described what I wanted to build, shared my design files, and watched Claude help me scaffold the entire React project structure. It suggested component architecture, helped set up GSAP animations, and even caught accessibility issues I would have missed.

The magic wasn’t just in code generation—it was in the back‑and‑forth. When something didn’t look right, I could describe the problem in plain English. When I wanted to add a feature like a typing animation for my tagline, Claude didn’t just write the code; it explained the approach and suggested alternatives I hadn’t considered.

Bringing It to Life with Animation

A static portfolio feels lifeless, especially one going for a retro‑gaming vibe. I leaned heavily on GSAP and ScrollTrigger to create moments of delight:

• Hero section with a dramatic reveal
• Skill bars that fill as you scroll past
• Project cards that float in with staggered timing

One of my favorite touches is the holographic projector in the hobbies section. Hover over a hobby category and watch the CRT monitor flicker to life with details about that interest. Small interactions like this transform a portfolio from a static résumé into an experience people actually want to explore.

The Technical Stack

I intentionally kept the stack simple. Fancy frameworks are great, but for a personal portfolio I wanted technology that would be easy to maintain and update years from now. React and CSS aren’t going anywhere.

Lessons from the Process

1. AI‑assisted development shines when treated as collaboration, not delegation. I still made every design decision and wrote plenty of code myself, but having an intelligent assistant to bounce ideas off accelerated the whole process.
2. Constraints breed creativity. The 8‑bit theme could have been limiting, but it actually made decisions easier. Every component had to pass the “does this feel retro‑futuristic?” test, preventing feature creep and keeping the design cohesive.
3. Accessibility still matters, even with a gimmicky aesthetic. The portfolio works with screen readers, respects reduced‑motion preferences, and maintains proper color contrast despite the neon‑heavy design.

Building this portfolio was a rewarding blend of nostalgia, modern tooling, and AI partnership—proof that the future of development can be both retro‑inspired and cutting‑edge.

# Write all the neon. Good design is inclusive design.

## What's Next

A portfolio is never truly finished—it evolves as you do. I'm already planning to add a blog section for deeper technical writing, integrate some live project demos, and continue refining the animations based on feedback.

If you're thinking about building your own portfolio, my advice is simple: have fun with it. This is the one website where you get to be completely yourself. Make it weird, make it personal, make it something you're proud to share. And if you've got an AI assistant ready to help, don't be afraid to lean on it. The future of development is collaborative—even when your collaborator is a large language model.

*Please check out my personal portfolio **[https://portfolio.jeffdev.studio/](https://portfolio.jeffdev.studio/)** for more info about me and blog posts.*