How the Red Balloon Game Utilized the MetaMask Delegation Toolkit for a New Web3 Experience

Learn how the MetaMask Red Balloon game used the Delegation Toolkit to achieve a new web3 user experience.

by Kingsley Okonkwo, Omna Toshniwal July 16, 2024
Red balloon feature image

The MetaMask Delegation Toolkit is the result of years of research to make secure and easy-to-use tools for the web3 ecosystem. The toolkit is designed to solve significant UX problems that prevent mainstream web3 adoption & offers tools to unlock new social coordination use-cases. The Red Balloon was a social strategy game played at the EthCC conference in Brussels from July 7th to 9th, 2024. Participants experienced instant onboarding, cost-effective gas sponsorship, and multi-hop delegations for the first time in a web3 game.

The goal of the challenge was to find 10 balloons scattered throughout the conference venue and win 5 ETH as the prize. However, due to the geographical and temporal distribution of the balloons, it was impossible for a single player to find all 10 balloons independently. This game was inspired by the DARPA Network challenge and simulates a difficult large-scope problem that requires decentralized collaboration to solve.

The first person to collect all 10 balloons and claim the win took home the prize money minus any commissions for people whose balloons were used for the win.

This case study discusses how the MetaMask Delegation Toolkit made each feature of the Red Balloon game possible.

Scan to play: featuring instant web3 onboarding

One of the main features of the MetaMask Delegation Toolkit is the ability for users to bypass the typical web3 wallet connection flow, eliminating the need to install a traditional wallet or worry about seed phrases.

For Red Balloon, players onboard the game by scanning a QR code from either a physical balloon or another player who has already onboarded the game. This generates a counterfactual (free and instant) embedded smart account for them in the game web app, after which they can get straight to playing without thinking of creating or connecting a wallet, on-ramping, etc.

Game UI GIF

Collect and share balloons: featuring off-chain delegations

Each balloon in the game was represented by a unique NFT smart contract assigned to a delegator account. This delegator account could issue delegations to players who discovered the corresponding physical balloon, allowing them to assign themselves as holders to claim a win. Here are the two types of delegations we implemented:

  1. Delegations from the delegator account: This allowed a player to receive a special delegation from the delegator account when they found a physical balloon. This delegation then granted the player permission to assign themselves as the balloon holder, which was required to call the win function.

  2. Delegations from peers: Players could also create offers to other players, specifying the balloons they had access to and the commission they required for another player to use that balloon to claim a win. These were off-chain offers, allowing them to be free and instant.

Since the delegator account is entirely embedded within the game experience, playing the game did not require players to review any confirmations, making this an interruption-free experience.

Claim to win: featuring gas-sponsored batched transactions

To win the game, a player needed to be assigned all 10 balloons either by peers or directly from the delegator account before they could call the win function. The first player to achieve this condition was declared the winner and received the prize money, minus any commissions owed to other players who shared their balloon access with the winner.

The MetaMask Delegation Toolkit ensured that the off-chain agreements between players were programmatically enforced. When a player accepted an offer and used the shared balloons to win the game, the commissions were automatically distributed to the respective balloon owners in an atomically batched transaction.

Additionally, this was at no cost to the winner and owners of the balloons, as the game featured gas sponsorship. The only time gas costs incurred were for the batched transaction (transaction hash) of claim win, which included the deployment of the winner’s smart account & transfers to those who won commissions. For a game that engaged 621 players, we had to pay only 57 cents in gas sponsorship, which delivered a gas-free end-to-end experience for all users. This feature provides a growth strategy for developers who want a cost-effective way to sponsor gas fees for their users, ensuring a seamless experience without worrying about transaction costs.

image1

Building better UX in web3

Through the innovative design and practical use of the Delegation Toolkit, the Red Balloon game brings a complex concept to life, allowing players to experience the potential of decentralized coordination and programmatically enforced agreements while offering a seamless onboarding and gameplay experience.

This demonstration not only highlights the unique capabilities of the Delegation Toolkit but also offers EthCC participants a glimpse into the future of web3 UX. Want to leverage the Delegation Toolkit to bring a refined UX to your dapp? Get early access today!

Receive our Newsletter