project screenshot 1
project screenshot 2
project screenshot 3

Clash Of Cards

Clash of Cards is a web app game based on Monster Cards as NFTs. You play your monster cards, win coins, buy rare and super rare cards and have your own collection of NFT Monsters.

Clash Of Cards

Created At

BuildQuest

Winner of

trophy

πŸŠβ€β™€οΈ Sequence Pool Prize

trophy

πŸ₯ˆ OP Games - Best HTML5 Games using BuildQuest Sponsor SDKs / APIs

trophy

πŸ… Best Use of Chainlink

trophy

🎨 Best design in gaming or metaverse project

trophy

ETHGlobal Finalist

Project Description

Clash of Cards is a web game based on Monster Cards as NFTs. You play your monster cards, win coins, buy cards and have your own collection of NFT Monsters. The NFTs are of three categories based on rarity; common, rare and super rare.

You start the game by launching with sequence or meta mask, staking 50 tokens out of the 100 you receive when you start, and receive starting deck of common cards. You select 8 cards you want to take to battle your opponent. Before the battle begins you are given at random, 4 out of the 8 selected cards. Then you start battle and have a face off with the opponent based on heath and damage points. If you win, you get more coins to buy more cards, and it costs you 50 tokens you staked if you lose the battle.

There is a Card Market for you to buy and sell monster cards, and also a weekly leader board, where you can earn more cards if you come in the top 10 contenders.

How it's Made

Clash of cards is a fully web3 game, which lives on the Polygon Testnet, without the use of any servers, and is built using a variety of frameworks, tools and libraries. Firstly, the cute NFTs and the website wireframes were designed in Figma. The website was brought to life in Angular with animations, wallet integration and game client logic.

The NFTs were generated by mixing and matching different colors, accessories, etc. using TypeScript (https://github.com/NaikAayush/clash-of-cards/tree/main/nft-art-generator). The NFTs were then uploaded to Pinata (and by extension, IPFS), which made it very simple to pin and manage NFTs on IPFS.

We then made our own token - the Clash of Cards coin - to act as a unit of currency within our game. It is an ERC20 token that can be swapped and exchanged on the Polygon testnet. These coins can be used to buy NFTs on our custom marketplace.

The game match-making and game logic is implemented in a custom contract written in Solidity (https://github.com/NaikAayush/clash-of-cards/blob/kontrakt/smart-contracts/contracts/MatchMaking.sol). We have integrated Chainlink keepers to periodically poll for matches and perform the actual match-making. This was a particularly hacky solution but we think it’s a good use case for chainlink keepers.

Overall, we think that the game has a beautiful aesthetic, works well and even though it was our first NFT project, we managed to integrate it into our first web3 game. Notion board to track our tasks -https://internal-samba-949.notion.site/Buildquest-ec9a96273b84452c98282471a58f9963

background image mobile

Join the mailing list

Get the latest news and updates