This game’s story started a couple of years ago on a wall above our daughter’s bed as a cute poster, only to evolve into a physical card game, and then a mobile one that implemented Web Monetization ’s receipt verifier service , and even offered an NFT to the mix.
Play FOREST CUTIES now!
It is quite similar to NSHex Roulette’s making of, as it also started as an analog prototype and managed to turn into a mobile experience. Here’s how Ewa explain the origins:
When I started running MamaDesigner.pl blog, my main goal was to create cute looking designs to decorate children’s rooms. One of the first obvious ideas revolved around animals, and so the wall poster collection was created.
Our daughter Kasia liked them a lot, and the blog readers did as well - it was the most downloaded content on the website. That’s why I decided to refresh the collection a bit.
In the third year from the start I decided to expand the collection by adding posters with new forest animals, the physical card game, and even baby birth announcement and baby shower certificates.
Sweet looking forest animals took everyone’s hearts by storm, so when Andrzej suggested we could build and release a mobile web game with them, I said yes immediately. We’ve focused on making it as kid-friendly a possible, with Kasia being our very first tester, and it turned out great. It’s the first game created specifically for kids right from the start, but definitely not the last one.
You know, if you’re an adult, then you are totally fine to play it as well, so don’t stress about it too much!
Last piece for the Grant for the Web
As part of our Grant for the Web grant we’ve organized the Web Monetization category in js13kGames 2020, conducted the Gamedev.js Survey 2021, and organized the Web Monetization category in Gamedev.js Jam 2021. On top of that, we’ve experimented with creative content creation and ways Web Monetization could benefit the players: from publishing NSHex Roulette which unlocked stats for monetized users, through Body Guard having probabilistic revenue sharing (and supporting Artist Rescue Trust and Phaser ), to Forest Cuties showcasing receipt verifier service and unlocking exclusive content for paying Coil members.
Web Monetization through receipt verifier service
As you may know, using document.monetization to verify if someone is a paying Coil subscriber is fast and simple, but can be easily spoofed, since it’s all happening on the front-end side of things. Someone with enough knowledge could alter the code and pretend to be a monetized user. Not that it makes any sense as they’re suppose to support the creators they are visiting, not pretend to be one and seeing “thank you for your support” messages for free. Still, if this is going to be a business and you want to release a product you spent a lot of time creating, you’d like to verify if someone is actually who they say they are before you allow them to access your exclusive content.
You can have your own verifier, keep the content on the server and send it after the positive verification, but since our games are front-end only, I decided to go with the simpler approach - using a publicly available verifier service and embedding an encrypted piece of content which will be decrypted if the visitor is truly a paying Coil member.
In our case, the three unique cards are being unlocked for the player, but this happens after visiting the Web Monetization screen within the game first and being verified that they are indeed a monetized user.
Implementation
To implement the request verifier service two things have to be done - first, the payment pointer have to be modified for the payment to go through the verifier first, instead of going directly:
<meta name="monetization" content="$webmonetization.org/api/receipts/%24ilp.uphold.com%2Fk4eJGQUDF9nw" />
You can use any of the verifiers, or host one yourself, but the easiest way to do this is to use the one hosted by the WebMonetization.org website themselves.
Second, the actual exclusive content have to be encoded, so it will only be accessible after positive verification - you can do it using the Exclusive Content Generator provided by the very same website as well:
As you can see, all you have to enter is your original payment pointer, and the secret message that will be encrypted. In the case of Forest Cuties, that’s a JSON object with details of the three cards being unlocked: thier description, image urls, etc.
After clicking Generate you can paste the code into your HTML file. Here’s how the whole thing look like:
There’s also a link to the script that does all the magic. You can apply all the code, and put everything in your index.html: monetization meta tag with verifier url, encrypted content, and the script that does the decryption. As soon as the visitor is confirmed as a monetized user, the encrypted message will appear within the exclusiveContent div. Then, a JavaScript code can pick it up, treat as a JSON object and read the data, which ultimately unlocks the extra cards for the player.
NFT with OutPlay Games via Paras Marketplace
This is something we’ve started exploring - the whole concept of NFTs (Non-Fungible Tokens) and Web 3 games on a blockchain. We’ve got only positive memories from having the Decentralized category in Gamedev.js Jam 2021, where both Outplay Games and Paras Marketplace partnered with our event.
Now, thanks to their efforts again, we can offer you a unique Forest Cuties NFT! It can be bought for 40 NEAR , and there’s only 60 tokens total - make sure to grab yours! You can support us, and in exchange the game will offer three in-game cards only for those who own the NFT.
This should be implemented in the next couple of weeks, and will be announced through our social media channels.
Summary
I think it all went well, and I’m happy we were able to publish the game, implement Web Monetization features, and offer the NFT. After all it is a very simple game about matching the same pictures, but I do hope you’ll like the card collecting aspect of it, especially since the animals are indeed cute, and you can learn some cool facts about them in the process.
Top comments (0)