CardForge

Inspiration

We love card games. When we were younger we would try to create our own cards on paper and even

What it does

Each player gets a turn to choose an active card to play. Using this card, you can deal damage to other cards and heal yourself during your turn. Your goal is to knock out as many players as you can while keeping your characters at high health! When you are knocked out, you may substitute another card from your deck. Combined with a tried and true concept, with a modern UI and infinite customization, we have built a modern card game that’s a lot of fun.

How we built it

Our game is built for the web, accessible through a browser. It is TypeScript from end-to-end of the stack. The logic is decoupled into two code repositories. One for the frontend, another for the backend, both of which are linked in the submission. On the backend, we are running a NodeJS and an Express server. To allow real-time two-way communication between this server and the client, we utilized WebSockets and a powerful framework called Colyseus. On the front end, we've built an aesthetic and intuitive UI built using VueJS, TypeScript, and an in-house, custom-designed style framework.

Challenges we ran into

The main challenge we learned was syncing the state across all clients through web sockets. None of us had experience with web sockets before, and some of us did not have experience with other server paradigms either. As such, we learned a lot about web sockets and state management through hands-on practice. We also discovered natural language processing, specifically object detection and sentiment analysis using the English Lite model.

Accomplishments that we're proud of

We managed to make a functional game where the cards play back and forth properly

What we learned

We learned two-way communication with web sockets and game design.

What's next for CardForge

We want to expand the amount of players and make the interface more robust.

Built With

• css
• english-lite-model
• html
• javascript
• machine-learning
• natural-language-processing
• node.js
• typescript
• vue.js
• web-sockets