G2A REDESIGN
G2A Redesign is a frontend reimplementation of the G2A website, the world's largest video game key marketplace. The project started as a progressive learning exercise and evolved section by section, incorporating new HTML and CSS techniques in each iteration. Its value lies in the pixel-perfect fidelity to the mockup previously designed in Adobe XD, demonstrating the ability to translate a visual design into functional code.
Development — Web
> g2a-dev@mission-control:~$ diagnostics --run ERROR: The project required mastering semantic HTML and modern CSS from scratch, without frameworks or external libraries to abstract away layout complexity. WARN: Each new section had to incorporate techniques that had not been practiced before: flexbox, grid, media queries, CSS animations, and hover transitions. CRITICAL: The implementation had to be pixel-perfect against the Adobe XD mockup, with a maximum tolerance of 2px deviation in each measured component.
The implementation progressed section by section: header with responsive navigation and hamburger menu, hero section with a promotional image carousel, product grid with hover effects that reveal price and discount, and footer with links organized by category. All CSS was written without preprocessors or frameworks, using custom properties to maintain color consistency. Media queries cover three main breakpoints, ensuring functionality from 320px to desktop screens.