Settings

Theme

Snake in a QR Code

itsmattkc.com

318 points by phit_ · 82 comments

Reader
19 threads
skrebbel

If you want to see a variation of this concept in the wild, in active use by lots of people, check out PICO-8 cartidges.

PICO-8 is a virtual game console. I.e. it's an emulator for an oldschool game console that doesn't exist in reality. It's designed to be easy to code for while maintaining the limits and aesthetics of old game computers

PICO-8 games are, of course, distributed on cartridges. However because it's a virtual console, the cartridges are virtual too: they're PNG files.

Try browsing PICO-8 games here: https://www.lexaloffle.com/bbs/?sub=2&cat=7

Press the play button the play a game right inside the web browser, but be sure to click the little "Cart" link right below the playing area to see what's going on. You'll see it open a little PNG file.

That PNG file is the cartridge. It contains the entire game.

The file format is explained here: https://pico-8.fandom.com/wiki/P8PNGFileFormat. Obviously, because PICO-8 carts are purely digital, the format doesn't need any of the contrast, the error correction features or the orientation markers that QR-codes have. You can't take a picture of a cart with your phone and play it. You need the exact same, byte-for-byte PNG file. But it's still super cool.

  • muxator

    This is the coolest thing in ages. The game's code is steganographically embedded in a PNG image containing the screenshot of the game! Wow

    • read_if_gay_

      Steganography is cooler for sure, but can't PNGs already store arbitrary data in the header? IIRC, the game Spore did that so you can exchange creatures by sending images.

      • nacs

        I think the issue with that is that many image hosting sites optimize their images or at the least strip unnecessary data and EXIFs.

        So at any point while being copied from person to person, that game data could be lost.

  • nlawalker

    Games for the “Redshift” game console in the Zachtronics game Exapunks work the same way. They copied the idea from PICO-8: https://mobile.twitter.com/zachtronics/status/10277956046744...

  • svachalek

    This is very cool, and gives me a thought, what if you did it without "cheating"? That is, what if the whole game including its rules were in the picture? Something like Conway's game of Life but less shape-dependent, maybe utilizing the color to generate behaviors.

  • bentpins

    Nintendo back in 2001 came out with the e-Reader that would plug into a Gameboy Advance and read cards with data printed on them. You'd have to scan a few "stripes" of data, but it there were several NES games that you could run if you had the right cards. The cards held the data for the games, rather than them being already on the cartridge https://en.wikipedia.org/wiki/Nintendo_e-Reader

    • deergomoo

      I was always gutted that thing never came out in Europe. I had tons of Pokémon cards with the stripes and nothing to use them with.

  • rahimiali

    You should turn this comment into a blog post. Your writing is captivating. You made this ecosystem sound a lot cooler than the web pages you linked to.

    • skrebbel

      Thanks! I'm humbled :-)

      That said, I think the PICO-8 ecosystem is a lot cooler than I made it sound :-)

      EDIT, try watching this demo for example: https://www.youtube.com/watch?v=UR3MXKIefAI It's a demo, not a game, so not interactive and hence youtubeable. Tell me that isn't cool (and remember, it fits in is cartridge png).

  • ehsankia

    I don't know if I'm stupid, but those anyone have an example PICO-8 PNG? I can't find one in either of the two links you sent, nor on the internet. Am i missing something here?

    • kaoD

      Click "Cart" on the bottom left of the BBS entries.

      E.g. on https://www.lexaloffle.com/bbs/?tid=29967

      Takes you to https://www.lexaloffle.com/bbs/cposts/4/44467.p8.png

      • ehsankia

        Huh, so the PNG actually looks like a real cartridge? How are they able to do that? Is the data section hidden in a non-visible part of the file, or are they able to somehow encode it in there while still having it look visually like a cartridge?

        • giantrobot

          https://pico-8.fandom.com/wiki/P8PNGFileFormat

          The images are RGBA PNGs. So for each display pixel there's a byte for each color channel and the alpha channel. The two least significant bits in each byte are a quarter of a PICO-8 data byte. Those bits are read from a channel byte and concatenated in RGBA order to get a data byte.

          Using the LSBs for each channel means the those swizzled bits won't contribute very much to that pixel's color value. At worst it would just look like noise in the image.

          Also by putting the data inside the image data of a PNG it won't be stripped off by some optimizer or hosting service.

  • stOneskull

    that 'top-down adventure tutorial' is great. basically teaches you everything. thanks for sharing pico-8.

  • 83457

    This was the first thing that came to mind. If PICO-8 ever comes out with a mobile version, having a way to load a game by QR Code or some sort of game image would be cool.

rob74

Cool, so all the 1k demos/intros from Assembly (https://archive.assembly.org/2019/1k-intro) could also be distributed via QR code... the 4k intros unfortunately not. Maybe it's time for a new category ;)

gitgud

I wonder if snake could fit in a data uri, like this:

https://bytex64.net/code/datasnake/

Taniwha

I crossed my eyes and stared for ages, still could not see the snake, I hate these magic eye things

MStrehovsky

Here's another Snake game that can fit in a QR code, this one written in C#: https://twitter.com/MStrehovsky/status/1214955696556515331

(It doesn't need a .NET runtime; it's fully self-contained and runs on Windows as a native app.)

kevincox

I wish more QR-scanners supported data URLs. I think it would be very cool to distribute tiny web-apps via QR code.

squid_demon

Don't worry. There is no malicious code contained within this QR code!

  • dheera

    Yeah I'd much prefer it be a javascript: URL that did all the magic in the browser. Much safer, cross platform, and it would probably work out of the box in existing QR reader apps.

    • ant6n

      But the snake in a QR code probably works offline

      • dheera

        A javascript: URL can work offline. Try this: javascript:document.write("hello world");

        Note that if you cut and paste into Chrome it may delete the "javascript:" part and you will have to add that back.

        • ALittleLight

          Can a QR code convert to JavaScript like that? i.e. instead of opening a webpage it just executes some JavaScript.

  • Shared404

    That's what I thought about as soon as I read this. Seems like a great malware installation vector.

    Just print out stickers and put them up at restaurants, stores...

outadoc

Too bad virtually no one will flash it using a Windows device.

bovermyer

Might be interesting to print this on business cards and distribute at conventions or something like that.

  • fyfy18

    "Please run this binary from my business card". I guess it's easier than leaving USB drives in the parking lot...

    • z3t4

      You could run it in a VM.

      • pugworthy

        YOU could perhaps, but your average target hasn't much of a clue what a VM is, let alone how to set one up.

        And keep in mind, malicious software is going to be challenging, and there are much more clever ways to use QR codes.

        E.g., imagine some store that has QR codes on the product aisles to access information on a product via a URL. I make a fake website that spoofs the legit product page, but offers the user a special "Buy online and save 25%" offer, which of course they are very tempted by due to the steep discount.

  • jamesrascal

    QR code’s support vCards as well. I use QR code that will pop up and ask you to add me to your contacts.

    All the data is stored in the QR code.

  • orthecreedence

    And we're back to punch cards. Full circle =]

aarondf

If you want to play snake in Excel, you can do that too!

https://aaronfrancis.com/2013/remaking-cellphone-snake-in-mi...

fiatjaf

I'm still waiting for someone to make an app that encodes and decodes large data into multiple QR codes that are displayed in a moving sequence.

That would be the best way to transfer files in physical locations.

ariasemi

Really cool!

He also made a video about it: https://www.youtube.com/watch?v=ExwqNreocpg

pxi

It's a cool idea. Here's another one; a Mira fractal generator in SmallBASIC:

https://smallbasic.github.io/images/screenshots/mira.bas.png

brassattax

I was looking for the snake in the QR code itself (and found it!) before reading the article

  • codetrotter

    Wait, you found a snake? I am confused. Anyways, I too looked for it at first because I expected the game to be visually embedded in the QR code as well. I was a little disappointed that it was not the case. Imagine a game embedded in the QR code that when you load it, either directly is able to reconstruct the QR visual itself, so like some sort of quine https://en.m.wikipedia.org/wiki/Quine_(computing) but with the visual QR being considered the “source” kind of in this case and the thing bring output. Or weaker but still cool if the game uses the camera to load a QR and then you play on it.

    • codetrotter

      Thinking about it a bit more it could be like the PICO-8 mentioned elsewhere ITT but instead of a PNG the QR fantasy console would work by loading programs from QR and initializing the display with the QR visual itself and then the code from the QR is exectuted and is able to access the “video memory” to read in the starting state and then you can play a game where you consume the QR visuals for example with snake. Probably needs to make the snake colored so that you can tell eatable QR visuals apart from your snake. Other games include Breakout and perhaps Pong. Frogger. Etc etc

    • taylorconor

      Could be a really fun variation on quinesnake: https://github.com/taylorconor/quinesnake

  • Antip0dean

    I nearly started looking for it - thinking of the SIRDS images that were popular year ago - until I noticed the position markers. It's almost like we're trained in memes...

tgsovlerkhgsel

The HTML5 version converted to a data URL would be a more accessible demo than a windows executable I think, especially if it supported mobile input.

Unfortunately, scanning large QR codes doesn't seem to work too well in practice :(

agumonkey

a new vector emerges

  • devy

    I was thinking about the same thing! Although the original QR code spec did allow binary payloads[1], smartphones and cameras weren't ubiquitous in mid 90s. But they are now. Transmitting computer virus or malware within the QR code binary payload might just be as easy as pointing your camera lens to the QR code. Since the QR code image is only machine readable not human readable, it would be indistinguishable, neither any digital signature to prevent it from being altered.

    [1]: https://en.wikipedia.org/wiki/QR_code#Storage

  • jimkleiber

    You mean for viruses? Because that's what I was thinking

captn3m0

Am I the only one who thought this would be a game with the roaming around inside a QR code?

qwertox

Initially I was looking at the QR-code and thinking about punchcards, code golf and javascript, but reading that it contains a Windows executable was a surprise.

inlined

Am I the only one unwilling to run a non-sandboxed process I found on a tech demo?

  • athorax

    especially with the included disclaimer

      ...slightly larger than the executable shown in the video because I decided to add a little more functionality
  • userbinator

    As the demoscene would say, "your loss". It's unfortunate that security hysteria has put such a damper on creativity.

    Besides, that binary is small enough that it would be far easier to analyse than the piles of other software you use every day.

Keyboard Shortcuts

j
Next item
k
Previous item
o / Enter
Open selected item
?
Show this help
Esc
Close modal / clear selection