Login

How MidBoss encodes a player’s game data in shareable ‘death cards’

<div style="margin: 5px 5% 10px 5%;"><img src="https://www.sickgamedev.win/wp-content/uploads/2018/01/how-midboss-encodes-a-players-game-data-in-shareable-death-cards.jpg" width="646" height="363" title="" alt="" /></div><div>Promoting a game by automatically embedding screenshots in social media sites is a common practice, particularly among developers whose games live on those social media platforms, as well as mobile developers.
However, Emma “Eniko” Maassen, of <a href="https://kitsunegames.com/">Kitsune Games</a>, put a new spin on this for her indie roguelike <a href="https://midboss.net/">MidBoss</a> (not to be confused with 2064: Read Only Memories dev MidBoss), a traditional standalone PC game.
When a MidBoss player finishes a run—usually by dying—they can post a “death card” with the circumstances of their death or transcendence to Twitter. The embedded image doubles as a save files to allow other players to replay from the same seed or salvage loot from the failed run, since all of the information is <a href="https://en.wikipedia.org/wiki/Steganography">steganographically</a> encoded into the PNG image file.
Maassen sat down with Gamasutra to talk about the challenges and advantages of using stenography to share more than just text and pictures on social media.
Questions and answers have been edited for brevity and clarity.
<h2>Dead, to begin with</h2>
Where did the idea of MidBoss‘s death cards initially come from?
Emma “Eniko” Maassen: I like finding a place for old stuff I never really used in my projects. When we were working on the trailer for MidBoss, we came up with an idea to show parts of the game as trading cards in the trailer to show the volume of content in the game.
I made a card design for that, and that actually made it in the trailer. Around the same time, Alphabear was exploding on Twitter. And we’d been getting some feedback from people that they were sad there wasn’t a meta progression system, like in (for instance) Rogue Legacy.
<img alt="" src="https://www.sickgamedev.win/wp-content/uploads/2018/01/how-midboss-encodes-a-players-game-data-in-shareable-death-cards.jpg" />
I decided to use the moment of the player’s death since most runs end in death in MidBoss. The story that most players share with others when they talk about their experiences in roguelikes is how they died.
<blockquote class="twitter-tweet">
Got obliterated by an evil warlock! <a href="https://twitter.com/hashtag/LikeAMidBoss?src=hash&ref_src=twsrc%5Etfw">#LikeAMidBoss</a> <a href="https://t.co/CU2RMAQRKi">pic.twitter.com/CU2RMAQRKi</a>
— Jay Allen (@a_man_in_black) <a href="https://twitter.com/a_man_in_black/status/953143185647308800?ref_src=twsrc%5Etfw">January 16, 2018</a></blockquote>
I realized that I could combine my [already-made] steganography library with the card design [from the trailer], make it shareable on social media like Alphabear, and came up with the grave goods system (using the cards to carry over items from your inventory to a new game) to soften the blow of not having meta progression.
You had already developed a steganography library before working on MidBoss?
I created a library to do image steganography while I was working on the in-game music instrument playing system for Shroud of the Avatar.
<blockquote>
<h6>“I was playing Champions Online. A friend sent me their character customization settings, but it was a picture that I could load into the game. It was like magic, so I looked up how they could’ve done it and [first] came across steganography.”</h6>
</blockquote>
Years ago, I was playing Champions Online. A friend sent me their character customization settings, but it was a picture that I could load into the game. It was like magic, so I looked up how they could’ve done it and [first] came across steganography.
[A couple years later,] Shroud of the Avatar was taking submissions for game content from backers, and one of their stretch goals had been a system where you can play instruments in game to make music. Mabinogi, which I used to play, and Archeage used MML files to do that. Lord of the Rings Online [and later Terraria] used ABC files. I [created] <a href="https://www.shroudoftheavatar.com/forum/index.php?threads/framework-for-playing-instruments-in-game-using-mml-or-abc-notation.14740/">a framework that could parse the player-transcribed music for all of these games</a>, to give me access to this wealth of playable music. (You can find the source code for the library <a href="https://github.com/Enichan/textplayer">on my Github</a>.)
[As part of this project,] I created a library to do image steganography to be able to hide the music file data within a music scroll image with the actual notes printed on it. That experiment never went anywhere, though. I was working on this in my spare time and I just didn’t have the time to figure out all the intricacies of rendering the bars of music into an image to share.
I cleaned [this framework] up, made it open source, and submitted it [to Shroud of the Avatar developer Portalarium]. It took a while for them to get around to implementing it, but Richard Garriott mentioned how easy the library had been to integrate for them. I was awarded the <a href="http://sotawiki.net/sota/Order_of_the_New_Britannia_Empire">Order of the New Britannia Empire</a>, an actual medal they award to community members that perform outstanding contributions for the game. It was a very positive experience for everyone involved.
<h2>Encoding memorials with stenography</h2>
Can you walk through how your steganography implementation works in MidBoss?
It’s relatively simple. It takes the binary or byte data you want to encode and the RGBA color information of the image. Then it goes through all the bits in the data you want encoded and overwrites the least significant bit of each color channel to match. That means the colors will only ever be off by 1 from the original, which is imperceptible to the human eye. There’s 4 color channels or 4 bits of encoded data per pixel, so every two pixels represent one byte of the encoded data. Death cards are 405×506 pixels in size, so they can hold at maximum about 405*506/2 bytes, minus some transparent pixels, or about 100 kilobytes of data.
Programs don’t respect the values of the RGB channels for a fully transparent pixel, so I only put data in pixels that had a certain minimum alpha value so they weren’t completely transparent.
I also add a header with the text “BINDATA” in ASCII to the data so I can check if an image contains encoded data, followed by a 4-byte integer containing the length of the data payload in network endian, so that I know how much data there is to read.
What information is saved in a MidBoss death card?
MidBoss saves its game in a zip file that contains a number of XML files. I chose XML early on because I wanted the saves to be hackable [by players]. Inside the save zip is a “header.xml” file which saves everything about the game that isn’t specific to a certain floor. That means the game version, seed, game settings, how potions are discovered and which have been discovered, all of the player’s stats, abilities, forms, equipped items, inventory, etc. Even the stats that are tracked for that specific game.
<img alt="" src="https://www.sickgamedev.win/wp-content/uploads/2018/01/how-midboss-encodes-a-players-game-data-in-shareable-death-cards.png" />I already had all of this information available so the easiest thing is to just store that information in the card, but the text takes up a lot of space. A save header for someone at the end of the game might be around 65 kilobytes; I don’t think I’ve ever seen one over 80 kB. Fortunately, text compresses really well, so I use the deflate algorithm to compress the data before encoding it into the death card image. Once you deflate the header, it’ll basically always be under 10 kB, and is usually between 3 and 6 kB.
<h2>Getting the images onto Twitter and back again</h2>
Once death card images are generated, how do you export them to social media?
I’m a PC only developer [and] I never wound up with enough time to add sharing functions to platforms besides Twitter, so my research focused on that.
I had to make sure to pick a format that would fit Twitter’s image sizes. I wanted the whole card to be visible without having to click on it, and I definitely didn’t want it to be resized. That’s how I came up with the height of 506 pixels, and the width was basically as high as I could get away with while still having the cards feel rectangular enough instead of feeling square.
It turns out that Twitter will re-encode a PNG image that has no transparent pixels as JPG instead, so the data becomes corrupted. That’s why the design for death cards always have some transparent pixels in the corners. As for any other platforms, I just hope that the transparent pixels and the small size gets around their image re-compression rules. (I tested death cards on Discord, and they worked there.)
Since I was only targeting Twitter, getting around those rules was almost easier than getting the image from the game up on Twitter and back into peoples’ games. [At first], I didn’t want to mess with OAuth by creating a Twitter application at all. Unfortunately Twitter doesn’t have web intents that let you post images–only text.
What I eventually did is when you click the button to share a card on Twitter the game creates a temporary html file on your local drive which has the image as embedded base64 data. That html file contains a form where you can customize your tweet, and the text and image are then posted to my server. Then my server goes through the OAuth loop and posts the tweet.
And how did you set up re-importing the cards back into the game?
I started with simple drag & drop, which was problematic enough when dragging a file on your local disk onto the game. [It was] inconsistent on Windows due to VAC and various permission settings, but it mostly worked. From browsers, though, it was awful. Some browsers would just give me the url to the image instead of the image itself, some would bizarrely serve me a BMP image, and half the time it just didn’t work at all.
<img alt="" src="https://www.sickgamedev.win/wp-content/uploads/2018/01/how-midboss-encodes-a-players-game-data-in-shareable-death-cards-1.jpg" />
MidBoss automatically detects URL links to possible death cards in the clipboard
Eventually I got exasperated with the whole thing and created an option which periodically checks your clipboard for text links to images, but only while the game is active in the foreground. If it thinks it’s found a link, it’ll fetch it to a temporary file (assuming the image is not too big), and checks if it is in fact a death card. If it is, it asks you if you want to import it. This way, all you have to do is right click the image and copy the image location to your clipboard.
Do you have any advice for anyone looking to improve on your export/import setup?
As for getting the image to Twitter, I think creating a local drive html form to post the data worked great. If you’re ever in that kind of situation, I highly recommend that solution. The real hell was getting the card back into the game.
I’m pretty sure the clipboard trawling caused anti-virus software to freak out about the game, although I can’t confirm that. Don’t do that. Instead ask for the player to paste a link to the image into your game instead. I’d already designed for a more seamless import experience so I couldn’t fall back to that.
I ran into issues with that method on Linux (and maybe Mac?) because, unlike .NET on Windows, Mono doesn’t integrate with an operating-system-level cache of valid SSL certificates. I think that’s mostly fixed now, but don’t hold me to that across all distros. Inevitably, the safest and most reliable way to get a death card into your game is to download the file into your DocumentsMidBosscards folder.
<h2>When stenography works, and when it doesn’t</h2>
What are the advantages and disadvantages of steganography over visually-interpreted encoding? For example, barcodes, QR codes, or Snapchat’s Snapcodes.
[Steganography is] completely intolerant of loss. If anything re-encodes the data in the image your data becomes corrupt. Someone much smarter than me could maybe figure out ways around that but I’m pretty sure the impact of the data on the visuals would be more pronounced and the amount of storage you’d get would go way down.
[However], it certainly looks cooler. It has this magical element of “Whoa, this image has my entire inventory in it?”. I’m no expert on other ways of encoding data, [but they] are more about creating a very small amount of data that’s resistant to all sorts of data loss, so they usually just point at something, an url, an identifier, etc. For something like what death cards do, you’d have to host the actual data externally in a central location, and that’s not something I could do with MidBoss.
How well have death cards worked out for you as a social media promotional strategy?
Unfortunately it’s really hard to track what effect, if any, it had. According to the Steam achievements about 4.6% of players have exported a card on Steam. That’s less than 300, which isn’t great. On the other hand I know that the players who did engage with the system really liked it and around launch <a href="https://twitter.com/hashtag/LikeAMidBoss">the #LikeAMidBoss hashtag on Twitter</a> was pretty lively. [In particular], one YouTuber called SirTapTap even said that <a href="https://twitter.com/SirTapTap/status/867880772862181377">that hashtag “is how you engage and create a community on social media”</a>, and recommended other devs study it.
I think it was a worthwhile system and a success, but because the game had a pretty severe lack of coverage from press, it didn’t sell nearly enough copies to make this system shine and cause real virality.
How do you plan to you iterate on or improve on the death card system, in MidBoss or any future games?
I think I’ll definitely come back to sharing data on social media via images, I think it has a lot of interesting possibilities. I’d plan for it earlier next time and make sure to integrate more platforms. And like I said earlier, I’d make a system where players can import by providing the game with the URL, either for the image or the actual social media post.
As for MidBoss, I always planned to do special unlockable themes during holidays, as well as cross-promotional themes that would have the look of other games, unlocked for anyone who owned that game and MidBoss on Steam. I didn’t get around to doing that: release depression hit me pretty hard after MidBoss launched, because it performed so far below what we hoped it would.
I’m still planning to do the cross-promotional themes. I can’t really say which games we’ll be working with yet though, in case any of our deals with them fall through. (If you’re reading this and have a game on Steam and would like to do the card cross-promotion, feel free to contact me <a href="mailto:[email protected]">via email</a>.)
</div>

xSicKxBot