This project is mainly inspired by The Million Dollar Homepage. Although it was a revolutionary concept that remains fresh to this day, the website is severely outdated and is barely getting traffic in 2022 as it is largely a product of the web 1.0 times. We intend to revamp the underlying concept for the web 3.0 era by transforming it into The Million Dollar Dapp.

What it does

Pixel Protocol is a decentralized application where users mint Pixels on a 1000 x 1000 public canvas as a piece of advertisement, a form of expression or even as an opportunity to earn passive income. Individual pixels are represented by Non-Fungible Tokens (NFTs) on the blockchain which adhere to the ERC721 standard.

Pixel Protocol comprises two main components, the NFT component and the Lottery component.

NFT Component The NFT component governs the placement of pixels on the public canvas.

When users mint a Pixel, they are claiming ownership of a pixel at a particular coordinate on the canvas. The fee for minting is determined by the underlying pixel's coordinates on the canvas, which in turn determines how strategically located the pixel is. Pixels at the center of the canvas would be significantly more expensive than those at the corners.

After calling the mint function with the desired color as input, the Pixel at that coordinate now belongs to them. The underlying pixel is now reflected on the canvas, and should they wish to, they can mint more Pixels and gradually increase their presence on the public canvas. There are no restrictions on what can be created on the canvas. They can use the Pixels to advertize, spread a message, or simply let their creative juices flow. After all, it is a decentralized application.

Lottery Component Users can stake their Pixels in the Lottery contract for other players to bid for their Pixels. When players bid for a pixel, they can choose whether or not to override the current color. Either way, they gain ownership of the Pixel if they win the game. However, if they were to lose, they incur no losses beyond the lottery fee.

The outcome of the game is determined using Chainlink VRF, which allows blockchain-based applications to request for random numbers on-chain. In order to win, the random number generated for each round must fulfill certain criteria specified in the smart contract. Once the bid is successful, the Pixel will be transferred to the bidder. In other words, the original staker loses ownership of their Pixel.

Considering that they risk losing ownership of their Pixels, the system is designed such that the chances of winning is low and the rewards are lucrative enough for users to be incentivized to stake their Pixels. Currently, the lottery fee is pegged to the minting fee of the pixel and most of it is transferred to the staker. In other words, 10 rounds of unsuccessful bidding provides the staker an ROI of 1000%.

The Lottery component brings gamification to the Dapp. It provides an opportunity for bidders to claim ownership and override the content of a Pixel at the desired coordinates and a source of passive income for stakers.

How we built it

The front-end is built using NextJS and Moralis, with web3uikit for UI support. The back-end consists of a node server that communicates the canvas state to connected clients in the front-end through WebSocket.

Our Dapp is governed by two solidity smart contracts, one for the NFT component and the other one for the Lottery component. In the Lottery contract, we utilized Chainlink VRF to address our need for a reliable on-chain RNG. Unit tests is done via Hardhat.

Challenges we ran into

Initially, one challenge that we ran into was that we could not get our Chainlink VRF callback function to work. Eventually, we found out that gas limit we set for our callback function is too low. We took some time to figure it out and when it finally worked, we were immensely relieved.

For the frontend, it was a quite challenge to render the canvas responsive to user gestures and user-friendly to navigate across. We encountered various bugs when it comes to panning, zooming and dragging of the canvas, which we managed to solve in the end.

Accomplishments that we're proud of

We were proud to be able to fulfill all our objectives within less than a month, considering that we had little to no experience building a decentralized application. Furthermore, our final product worked out well and performance-wise, it was better than expected.

What we learned

Although we only used Chainlink VRF in the end, we were compelled to do research on the other Chainlink services (Price Feed, Keepers, etc.) at the initial stage. Overall, we learned a lot about the different services and what Chainlink strives to do as a whole. The Chainlink ecosystem was exciting to explore and the takeaways were immense.

For our Dapp frontend, we learned how to use Moralis and web3uikit, two very useful libraries that complement each other and saved us a significant amount of development time. We also learned how to use WebSocket to reflect the changes to the canvas in real-time.

Ultimately, we learned how to work as a team and use our individual strengths and expertise to create something that is far greater than what we could achieve individually.

What's next for Pixel Protocol

Currently, Pixel Protocol is deployed on the Polygon (Mumbai) testnet. Once we have further optimized the project, we intend to deploy it to the Matic mainnet in the foreseeable future for the web3 community.

Our immediate follow up to the project would be to include an image attribute for individual Pixels. We have considered two options, generative image and image set by the NFT owner. This would bring additional value to Pixels and allows for a robust NFT marketplace, which is also in the works.

In the future, we may even consider expanding the canvas. However, the initial 1000 x 1000 canvas will take centerpiece on the site so that early adopters are rewarded.

Built With

Share this project: