# Game items for Heno.

By [sweetman](https://paragraph.com/@sweetman) · 2023-10-31

---

Heno.’s video game, Relief, is now free-to-play. [Available to play for free on iOS, Android & Desktop](https://play.mynameisheno.com/). Heno. is pioneering a model for musicians to create immersive, multidisciplinary, experiences with their music releases. Expanding stories and building worlds. In this article we explore the newly open-sourced model, and how you can follow Heno.’s model by adding a video game to your next song release. We’ll start with the overall roadmap Heno. used, then dive deeper into how [Heno.](https://www.instagram.com/mynameisheno) executed his roadmap.

1.  pay-2-play
    
    1.  early access
        
2.  free-2-play
    
    1.  release the song [on streaming platforms](https://open.spotify.com/track/5aDNHHNXc16VktqV1gSq23)
        
3.  powerups
    
    1.  onchain => in game
        

Pay-2-Play
----------

Pay to play is the traditional model of video games. Pay a one-time fee to unlock lifetime access to the game. Heno. wanted to take this model a step further by putting the unlock onchain.

![](https://storage.googleapis.com/papyrus_images/1f1fee00bc2f0cf0902b68180cab05d1.png)

Originally, we released the game behind a paywall for early access. For $7 (0.003ETH) you could buy early access to Heno.’s video game on Zora. To token-gate a video game we needed 2 things

1.  a function to check if the player has unlocked the game.
    
2.  a function to pay-to-play to unlock the game.
    

To check if a player has unlocked the game I wrote a `fetchBalance` function like this

     const fetchBalance = useCallback(async () => {
        if (!address) return
        setLoading(true)
        const balanceOf = await dropContract.balanceOf(address)
        setBalance(balanceOf.toNumber())
        setLoading(false)
      }, [dropContract, address])
    

This code first enforces the player has connected their wallet. Then, we lookup how many `tickets` the player owns with `balanceOf`. If the `balanceOf > 0` the player has already paid to unlock the game. If the `balance` is `0`, they haven’t unlocked the game and should be prompted to buy the early access `ticket`.

To allow a player to `pay-to-play` I wrote a `mint` function like this

    const mint = async () => {
        setMinting(true)
        await mintWithRewards()
        await fetchBalance()
        setMinting(false)
      }
    

This code calls the `mintWithRewards` function on Zora’s Protocol. Once the player has purchased their `ticket`, we `fetchBalance` again, which updates the balance (see above for code) and unlocks the game.

The results looked like this:

![Pay-2-Play - Relief by Heno.](https://images.mirror-media.xyz/publication-images/McGdJ6bDK9QcpEfzSJWY-.png?height=1588&width=2880 "null")

Free-2-Play
-----------

Once Heno. released the song, [Relief](https://open.spotify.com/track/5aDNHHNXc16VktqV1gSq23), on streaming platforms, it was time to make the game more accessible to his fans globally. That meant removing the paywall, open-sourcing the code & turning the early access tickets into power-ups.

Removing the paywall was easy. Add a big `START GAME` button to start the arcade game. No credit card required.

![](https://images.mirror-media.xyz/publication-images/EsVxuLNVc0vBGEPiKtZOn.png?height=816&width=1262 "null")

Open-sourcing the game was also pretty easy. We use Github to store the website code. I simply went to the settings in Github and changed visibility to `public`. Now, anyone can use the model Heno. built by [downloading the open-source code here](https://github.com/SweetmanTech/Heno-Relief-Game).

![open source code](https://images.mirror-media.xyz/publication-images/vpSU6futaCZ37Zct54fuG.png?height=220&width=458 "null")

Powerups
--------

Heno. wanted to reward the players who supported his vision early on. The idea he came up with was to give anyone who owns the early access `ticket` powerups in the video game. With 3 different tickets, he assigned power-ups to each

*   heart - 10 extra lives
    
*   camera - easier enemies
    
*   money - $100 extra in game
    

![](https://images.mirror-media.xyz/publication-images/qqbaFLORGLk92AP6xFYp0.png?height=1590&width=2880 "null")

These rewards are stackable. If you own a camera & a money `ticket` you’ll get easier enemies AND extra money in game. If you own 3 hearts, you’ll start the game with 30 extra lives. There’s other combos players can unlock by combining these tickets. I won’t give away all the combos here. Buy tickets here to unlock powerups in game.

I worked closely with [DaCircus](https://twitter.com/DaCirkus) to build a way to bring items from onchain => in game. It was actually pretty challenging to figure out a way to send messages from the NextJS website I was building with the Godot video game DaCircus had built. After numerous pair-programming session together and lots of questions to ChatGPT we found a solution:

    const channel = new MessageChannel()
    
    const callGodotFunction = () => {
        const iframe = document.querySelector("#godotGame") as HTMLIFrameElement
        if (!iframe) {
          return
        }
        const spotifyMoney = deviceId ? 5 : 0
        iframe.contentWindow.postMessage(
          [heartCount, cameraCount, moneyCount, spotifyMoney, address || ""],
          "*",
          [channel.port2],
        )
    }
    

The magic lives in `postMessage` function. In the NextJS website we lookup how many, and which type, of tickets the player has. We also give an option for players to connect their Spotify account to stream Relief on Spotify, which pays Heno. per stream. Once a player has connected their wallet and / or Spotify account, they click `START GAME` which calls the `callGodotFunction` (above) to start the game with powerups.

![Powerups: 5 extra lives & $100](https://images.mirror-media.xyz/publication-images/3NmvW2iI8NN90hCjSWgWt.png?height=1580&width=2880 "null")

I want to take a second to highlight the importance [DaCircus](https://twitter.com/DaCirkus) played in this. He built the entire game on his own. He was the designer for all assets in the game too. He was the main developer & designer on this project. I simply helped publish his game to an easy-to-use website & plugged in the web3 functionality.

Thanks for taking the time to read! If you wanna keep going, here’s some links

1.  Play Relief by Heno. - [play.mynameisheno.com](https://play.mynameisheno.com/powerup?code=AQAxV8nYg6ba8ze6KGYEJ0RBDQ5FIdWJi7CZLxwMqRxwj2FI1XM33nS3x9FW2h4nRDoocQ2jxV1EKCXFrCjalJG5Mn9RbLXlT0YU9pzEUMxiDt3duW5wDaP0RKlYo2ArMiXGNvpQqQjDIjT7HYOw54F8Eyq1pqi7LXt2Hw24LaeeywCJwJClBiUMr_lPRYhk3RwV3Nj9p2e45Cr8rwJPm7mlzJzn_g9Av-2cWEW0P8X7psv_YQTZs1EOeFZA2DvzwFaQQ-WaogRZnoO1SSwBQ-jMYudLCQTnjfjp9kPWmJw7aGS0TCteP4DSyQ&state=QVVb4jM7SK7mM7no)
    
2.  Collect the Tickets to earn Super Powers - [zora.co/heno](https://zora.co/collect/zora:0x71fc87edd0a98a847c9bb838bc05577ef907f299)
    
3.  Download the Code to build your own game - [github/sweetmantech/Heno-Relief-Game](https://github.com/SweetmanTech/Heno-Relief-Game)
    
4.  Stream Relief on Spotify - [open.spotify.com](https://open.spotify.com/track/5aDNHHNXc16VktqV1gSq23)

---

*Originally published on [sweetman](https://paragraph.com/@sweetman/game-items-for-heno)*