cv

Inspiration

I wanted to create a CV website that breaks away from the conventional layouts by turning the experience into an interactive retro 8-bit game. The idea was to combine my passion for coding and gaming into a unique, engaging portfolio that feels like exploring a classic game world while showcasing my professional journey.

What it does

The site mimics an 8-bit game environment where users navigate through different CV sections (About, Skills, Experience, Projects, Contact) using keyboard controls or scroll wheel. A pixel-art hero character moves smoothly between sections, which are styled as different game levels with retro fonts, neon colors, scanline effects, and game-like UI elements such as progress bars and achievement badges.

How we built it

We used React and TypeScript for the application structure, enhanced by Tailwind CSS for pixel-perfect retro styling. Keyboard navigation was implemented via a custom hook that listens to WASD and arrow keys, while smooth scrolling and animations simulate hero movement. We integrated pixel fonts, sprite animations, and CRT-style visual effects to evoke authentic 8-bit aesthetics. Testing was set up using Vitest and React Testing Library to ensure reliability.

Challenges we ran into

Ensuring accessibility with keyboard and mouse navigation without breaking the retro experience. Fixing initial visibility issues where section content was clipped or hidden behind layers. Balancing nostalgic visuals with modern responsive design for different devices. And last but not least was the error message about the end of the free trial (

Accomplishments that we're proud of

Achieved a fully interactive game-like CV with seamless keyboard and scroll navigation. Incorporated authentic 8-bit graphics and UI elements, including animated pixel hero and HUD indicators. Developed a comprehensive test suite covering keyboard input, animations, navigation flow, and accessibility. Successfully deployed a production-ready, responsive site with retro styling

What we learned

Combining modern React techniques with classic game design principles creates engaging user experiences. Accessibility can be maintained even in highly stylized, unconventional interfaces by thoughtful keyboard and mouse support. Testing is crucial for interactive features like keyboard navigation and animations to prevent regressions. Small UI details like scroll throttling and z-index layering significantly impact usability and polish.

What's next for cv

Sure, for now this site is very fishy one, so I need to add true content Add more interactive “levels” or mini-games that highlight specific skills or projects. Integrate AI-powered assistants or chatbots styled as game characters to guide visitors. Add sound effects and music with toggle controls for full retro immersion.

Built With

• react
• taiwind
• typescript
• vitest