Inspiration

Classic arcade games, especially the iconic Pong, served as the project’s inspiration. We aimed to re-create the nostalgic experience of playing Pong while giving it a modern twist. Our version is accessible through a web interface and has different difficulty levels to challenge today’s gamers. Our interpretation of the project honors the original game while providing a fresh take that still offers nostalgic kicks.

What it does

We've created a cyberpunk-themed version of Pong, accessible after logging in through our home page. Once logged in, you can choose your desired difficulty level and start playing using your keyboard as the controller. The cyberpunk theme was incorporated using a neon color palette and stock cyberpunk visuals, enhancing the classic Pong experience with a sleek, high-tech vibe.

How we built it

We built the game using the React library. An advantage of this choice is that it allowed us to create reusable components not only for different parts of the UI but also for different pieces of logic that control the game itself. For example, we created a component for each paddle. These components are very similar to each other, and if we ever wanted to use them again, we could easily drop them into a project without rewriting the styles. We also created a component for the ball and another for the scoreboard, which is rendered in three parts to accommodate the three possible game modes. React helped in structuring all of these elements, giving me a road map for where the ball and paddles are supposed to go.

Challenges we ran into

One of the principal obstacles was devising the computer-controlled paddle for the AI. We wanted to give the human player a fair chance while still making the game challenging, so we built in a certain percentage to make the computer paddle mess up now and then. Getting the right mix of challenging and fair was not always easy, and we can't say that we have totally solved that problem. At least, the game feels smooth and responsive in a way that's satisfactory for basic gameplay.

Accomplishments that we're proud of

What we consider to be noteworthy achievements in this venture are primarily how we used React to control the game state and how that contributed to the overall smoothness of the gameplay experience. We think we did a good job with the difficulty selection feature, which, in my mind, adds a level of customization necessary to make the game accessible to a variety of players. The UI also looks futuristic and minimalist in a way that is engaging but also straightforward, which works well for an interface in a game that is supposed to be made for humans to interact with.

What we learned

This project illuminated a lot of things about React for us, specifically real-time updates and animations. We delved into handling game state efficiently while maintaining smooth reactivity. We also took a long look at UX in terms of gameplay, such as difficulty and control intuitiveness. We wouldn't say we are experts now, but we certainly have gained valuable insight into how to use React with interactive game logic, along with how to use hooks effectively for a dynamic gaming experience.

What's next for CyberPong

We hope to improve some features, such as stronger authentication measures and smoother gameplay!

Share this project:

Updates