Super Battleship Party

Main logo
Battleship
Blackjack
More Blackjack
Game Area

Inspiration

Inspired by games like Ultimate Tic-Tac-Toe, Super Battleship Party takes on a similar theme by every move of the "main" game requiring a win in a "sub" game. These sub games are short but fun, and add a unique twist to the well-known Battleships game.

What it does

Players can join another player's game by entering their generated code. Once joined, both players will be sent to the battlefield! Here, they are first tasked with placing their battleships. They can rotate them and preview where they want them to go before placing them.

Once both players have placed their battleships, the game will begin! Players will take turns to guess where the enemy has placed their battleships. For each guess made, a minigame will begin! These vary from Tic-Tac-Toe to Blackjack. This is where it gets interesting... The loser of the minigame will have the missile fired in their tile. This means that even the player who was initially attacking could end up damaging their own battleships! Not only does this provide a new outlook to the classic Battleships, but it also adds a large amount of strategy to the game. Would the enemy player risk firing in a square in which they also own a ship? Is the enemy player using reverse-psychology to get in your head? These questions all help you find your own strategy not for figuring out what your opponent is doing, but for figuring out what you want your opponent to think!

For each time a player successfully hits an enemy ship, they receive another turn. The first player to destroy all other battleships in the sea wins!

May the best Battleshipper win!

How we built it

Frontend is built using:

React
Typescript
Tailwind
WebSockets - to connect to the server
Github Pages - to host the web-page

Backend is built using:

ExpressJS
express-ws (express websockets)
Heroku - to host the server

Version Control: Git / Github

Challenges we ran into

Trying to get WebRTC (with two different libraries) to work before giving up and creating a hacky WebSocket server
So many merge conflicts (times force pushed into main = 2)
Connecting the two clients together with a simple way to send/receive data in the UI and the game logic.

Accomplishments that we're proud of

Getting everything working and in a state we're happy with
Having enough time leftover to make the UI's look nice with animations
Very clean way of declaring minigames
Having a working network
Having it deployed on a proper domain

What we learned

Planning ahead of time is very beneficial
Git branches are actually useful when multiple people are working at the same time (who would have known?)
A more detailed dive into React