NHacker Next
  • new
  • past
  • show
  • ask
  • show
  • jobs
  • submit
Show HN: I made a Doom-like game fit inside a QR code (github.com)
cosignal 6 minutes ago [-]
Pardon my dumb query, as I'm a tech novice, but aren't QR just encodings of data? And the max amount of data a QR can encode is like 3kb, which would roughly correspond to 3000 or so plaintext characters. So the achievement here is that this Doom-like game can be run from an executable roughly of that size?
kuberwastaken 10 hours ago [-]
I sometimes pick up random projects just because I can, this was one of those times. I made it as a week long project a while back this year but never shared here, so thought to go for it haha.

I created a game inspired by Doom and the backrooms called The Backdooms under 2.4kb in minified html. (for reference, this entire post would be around 1.8kB haha) I had to use a not popular way of using GZip with Zlib headers (had to write my own script for compressing it, also in the repo) to eventually convert it a size 40 QR code that works right in your browser using Decompressionstream API.

This is of course a very oversimplified description of it, using a lot of the same technologies that DOOM had but combining it with infinite seed based map generation in 2.4kb (QR codes can only store 3kb, which includes changing formats) was pretty hard.

Here are some links about it if you want to nerd out and read more:

Repository Link (MIT License): https://github.com/Kuberwastaken/backdooms

A Hosted (slightly improved) version of The Backdooms: https://kuberwastaken.github.io/backdooms/

Game Trailer: https://www.youtube.com/shorts/QWPr10cAuGc

My Linkedin post about it: https://www.linkedin.com/feed/update/urn:li:activity:7295667...

(PS: You'd need something like https://qrscanner.org/ or something that can scan bigger QR codes and put the text data onto your browser to play it)

My Blogs documenting the process and development in detail:

https://kuberwastaken.github.io/blog/Projects/How-I-Managed-... https://kuberwastaken.github.io/blog/Projects/How-I-Managed-...

sangeeth96 8 hours ago [-]
TIL DecompressionStream, thanks. I managed to shave some more bytes by trimming the HTML bits, raised a PR in case you're interested.
kuberwastaken 7 hours ago [-]
YOU'RE A LEGEND! I just managed to ADD (somewhat of) TOUCHSCREEN SUPPORT, better movement, enemy spawning and damage mechanisms in the space that freed up because of this! Genuinely, thank you, made my month :)
sangeeth96 7 hours ago [-]
Damn, that’s awesome! Glad that was a help :D
collingreen 5 hours ago [-]
Open source victory right here
kuberwastaken 4 hours ago [-]
Absolutely!
r1chardnl 10 hours ago [-]
Your game trailer links to a short called "Fly me to the moon - 19 September 2024". I think this is a mistake?
kuberwastaken 10 hours ago [-]
Should be fixed, sorry haha
dylan604 6 hours ago [-]
Never gonna give you up lives on in new ways
alex_suzuki 4 hours ago [-]
Very cool! You‘ve definitely motivated me to continue my own experimentation in the realm of „what cool stuff can I put in a QR code“: https://strich.io/blog/posts/embedding-webassembly-in-qrcode...
x3n0ph3n3 10 hours ago [-]
I think your trailer video link is bad.
croisillon 10 hours ago [-]
kuberwastaken 10 hours ago [-]
Fixed it! My bad haha
redbell 5 hours ago [-]
Really cool project! TIL about 'data:' URLs—while I was familiar with the 'data:' URI scheme and had used it before, I didn’t realize it could be used as a full URL. Funny enough, I had been thinking about building something similar that fits entirely within a QR code, but I held off because I mistakenly thought it would require an HTTP(s) link. I was heavily inspired by this work: Can you fit a whole game into a QR code?(https://www.youtube.com/watch?v=ExwqNreocpg)
kuberwastaken 5 hours ago [-]
Thank you for your kind words! I was also inspired by this video back in lockdown, I believe, super cool but I went the opposite route for browser based because of more compatibility.

I have them credited in the repo as well :P

teleforce 2 hours ago [-]
In the last Def Con 32 the badge can run full Doom on Pico 2 [1].

[1] Running Doom on the Raspberry Pi Pico 2: A Def Con 32 Badge Hack:

https://shop.sb-components.co.uk/blogs/posts/running-doom-on...

smusamashah 7 hours ago [-]
Please add a few screenshots to the repo. I am on phone and for whatever reason all I could see was 3 buttons and black screen.

Edit: Add a gif instead, you won't have to rely on YouTube with that.

kuberwastaken 5 hours ago [-]
Update: Added a GIF!
kuberwastaken 6 hours ago [-]
Alright! First thing tomorrow :)

Also pushed a commit to hopefully fix the blank screen issue for phones!

xandrius 6 hours ago [-]
Still black screen on Firefox mobile.
kuberwastaken 5 hours ago [-]
Sorry, should be completely fixed now, with a neat little joystick (I presume you're speaking of the hosted verison)
notnmeyer 5 hours ago [-]
ios? same thing on safari, and probably every ios browser
giarc 10 hours ago [-]
I scanned on an iPhone using native QR code scanner and it says "no usable data found".
pudquick 10 hours ago [-]
data: URI URLs aren't supported in it, it has nothing to do with the size / length of the QR code

For example, this self-contained webpage: <html><body>Hi!</body></html>

encoded is: data:text/html;base64,PGh0bWw+PGJvZHk+SGkhPC9ib2R5PjwvaHRtbD4=

If you paste that into a browser, it will render "Hi!". Very short and easy.

But if you encode is as a QR code, it won't work in this situation.

myfonj 8 hours ago [-]
You don't even need the base64 encoding for dataURIs: just throw the text payload after mime-type and a comma:

    data:text/html,<!doctype html><title>Hi!</title><p>Hello.
This is also a valid self-contained HTML document. You have to add `;charset=utf-8`, if you need to go beyond ASCII, and for some browsers watch for URI-encoding of some syntactically significant characters (like `#` and `%`, `?`).

Base64 is indeed good to be "safe" and/or somewhat 'conceal' the payload, but it also makes it larger by 1/3 (every three bytes of input become four characters of the base64 output). So taking the risk some devices would not like raw "ASCII dataURI", the QR of the backrooms QR could shave off 738 bytes.

BTW, this is my "HTML sandbox" for testing stuff in a browsers that I summon daily through keyword bookmark to test simple stuff:

    data:text/html;charset=utf-8;verbatim,<!doctype html><html style="color-scheme:dark light"><title>HTML sandbox 2.0.6</title><meta name=viewport content=width=device-width,initial-scale=1><body style=margin:0;display:flex;height:100vh onload="OT=(DC=document).title,H=(L=location).hash.slice(1)||'',RX=/(^data:.+?(;verbatim)?,)?([^]*)/,A.value=H.match(RX)[2]?H:decodeURIComponent(H)||A.value;T=W=0;E=RegExp('^'+(D='data:text/html;charset=utf-8,'));F=()=>{if(W!=(V=A.value))W=V,M=V.match(RX),I.src=M[2]?V:(M[1]||D)+encodeURIComponent(M[3]),DC.title=NT=((TM=V.match(/<title\b[^]*?\x3E([^]*?)<\/title\b/m))&&(NT=TM[1])&&(NT=NT.trim())&&(DC.title=NT+' @ '+OT))||OT};F()"><textarea autocapitalize=off style=resize:horizontal;width:50vw autofocus id=A onkeyup=clearTimeout(T);T=setTimeout(F,400) onblur=try{history.pushState({},NT,'\u0023'+(S=I.src.replace(E,'')))}catch(e){L.hash=S}><!doctype html><html lang="en" style="color-scheme: dark light;">%0A<meta name="viewport" content="width=device-width, initial-scale=1">%0A<title>%0A%0A</title>%0A<style>%0A%0A</style>%0A<body>%0A%s%0A<script>%0A%0A</script>%0A</textarea><iframe style=border:0;flex-grow:1;width:0 id=I>
reaperducer 3 hours ago [-]
I think I'm going to find this useful.

Duck browser doesn't allow it to be saved as a bookmark, but Safari is fine with it.

myfonj 2 hours ago [-]
Yeah, sadly, top-level dataURIs are increasingly neglected and banished from browsers, mainly because they were misused for scams in the past; for example no modern browser allows navigating to top-level dataURI by clicking a link. Only bookmarks, manual entry, and external invocation (share) work (sometimes).

Anyway, I have put some remarks and docs for that thing into https://gist.github.com/myfonj/c8ce74bf549e19600026ce9022388... , if you are interested.

By the way, this "Backrooms" can also work from non-base64 URI and as such is significantly smaller (https://github.com/Kuberwastaken/backdooms/pull/3#issuecomme...)

kuberwastaken 9 hours ago [-]
I think it's broken for safari but works on chromium based browsers on mobile too. The QR code basically holds the URI URL itself.
pudquick 9 hours ago [-]
I'm saying the primary gateway most iOS users are using for loading a QR code - the camera app - will not present a transition to load your URL in this situation

Whether the resulting HTML game is playable in Safari is a different discussion.

The QR code, as generated, is effectively "not clickable" for most iOS users, unless they are using something other than the most common way to read QR codes on their phone like a 3rd party QR code reading app or similar.

kuberwastaken 9 hours ago [-]
That I agree, yes haha
Jerry2 9 hours ago [-]
I'm kinda relieved that it doesn't work on an iPhone. I often scan codes posted around to save the time typing URLs and running arbitrary code by just scanning a QR code freaks me out.
kuberwastaken 8 hours ago [-]
Ironically, I actually wrote a blog about how casually we do this and how dangerous it's become lol https://kuberwastaken.github.io/blog/Technology/QR-Codes-and...
8 hours ago [-]
Blikkentrekker 7 hours ago [-]
It runs inside a web browser though. This is no different from visiting an arbitrary link and running whatever arbitrary code in the Javascript sandbox of that link and one already knows a q.r. code an take one to an arbitrary link.
dylan604 6 hours ago [-]
This QR code does. But what about a QR using similar designed by someone less honorable? With QR codes, you have no idea what will happen until you scan it. At that point, it could be too late
recursive 7 hours ago [-]
Wait until you hear about javascript on web sites.
kuberwastaken 10 hours ago [-]
Hey thanks for checking it out! You'd need something like https://qrscanner.org/ because most phones suck at scanning larger QR codes.

Also, it won't work on your phone, can't put in that compatibility with size restraints, sadly.

ascorbic 7 hours ago [-]
fwiw, it works fine with the Pixel's built-in QR code scanner. It recognises it as text, not a URL, but it can copy to clipboard and then pasting in the browser works. Obviously I then die immediately because none of the controls work, but you can't have everything.
kuberwastaken 7 hours ago [-]
Hey just wanted to update, crazy timing but I Managed to add kind of some mobile touch support here because of a recent PR to FURTHER optimize it (crazy), so you can actually play it now if you figure out the controls lol
iainmerrick 9 hours ago [-]
You mean the game doesn't work on mobile at all?

What kind of device do you use to scan the QR code, then?

kuberwastaken 7 hours ago [-]
Hey just wanted to update, I Managed to add kind of some mobile touch support here, so if you get an alternate chromium based browser, you can put in the URI to play on mobile too!
iainmerrick 4 hours ago [-]
Nice one!
kuberwastaken 9 hours ago [-]
Nope it doesn't, you can use any QR code scanner that takes image input! I would've loved to include smartphone controls but that would take a LOT of extra bandwidth.
lelandbatey 9 hours ago [-]
You do not need to scan a QR code via a physical camera in your hand directly; any general purpose computer can run a QR code parsing program which accepts arbitrary images as input. It's so easy to do that there exist web pages which implement said QR code scanning in JS. Thus, the parent poster has recommended that you save the QR code .png file to your disk and then use such a piece of software, such as the website they linked, to extract the data encoded in that QR code.

That is how you can use nearly any general-purpose computer to scan a QR code.

iainmerrick 4 hours ago [-]
Or... use a URL.

I'm sure the number of people who've ever scanned a QR code on a desktop computer is more than zero, but not much more.

kuberwastaken 4 hours ago [-]
I think I myself brought that number into early triple digits, but I do also have a hosted version if you're interested!

The reason for doing this project isn't practicality, it's because I can

kuberwastaken 9 hours ago [-]
Indeed! Thank you for explaining this in a way better way :)
jasonjmcghee 10 hours ago [-]
You should update the css for the canvas to be `image-rendering: pixelated` so things look crisp rather than blurry!
kuberwastaken 10 hours ago [-]
I tried that but this just looks more fun and retro haha
thund 3 hours ago [-]
Next project: LLM as a QR code

Or, related: https://www.reddit.com/r/OpenAI/comments/138kbhs/someone_sho...

rezmason 8 hours ago [-]
Keep making cool things, kuberwastaken
kuberwastaken 7 hours ago [-]
Will try my best! Thank you :)
bananaboy 4 hours ago [-]
Very cool! Minor nitpick though: DOOM didn’t use raycasting. This is really a Wolfenstein 3D-like, since Wolf3D did use ray casting.
Bengalilol 6 hours ago [-]
Great crazy thing! I am waiting for the addition of "self contained QR code" to canitrundoom (although I don't know if it can be technically approved).

Yet... that game will now make me think twice before scanning any QR ^^

kuberwastaken 6 hours ago [-]
Haha fingers crossed but hopefully we do make it there.

And yup! It's pretty insane how much you can do with QR codes, wrote about it here if you're interested in reading more :P https://kuberwastaken.github.io/blog/Technology/QR-Codes-and...

frellus 4 hours ago [-]
This stuff is starting to feel closer to Snow Crash than I'm comfortable with, when I saw that QR code I wondered if my brain was being altered :-D Amazing work.
kuberwastaken 4 hours ago [-]
Hahaha Thank you so much!
kuberwastaken 7 hours ago [-]
Update: Managed to add kind of some mobile touch support (literally insane) because of a PR by @sangeeth96 on the repo
Mainan_Tagonist 6 hours ago [-]
After several tries, i managed to play it, sort of, on Brave on my Samsung S9.

Very impressive compression trick, as a proof of concept, it is worthy of praise, congrats.

I imagine this approach could be used for much more practical uses.

kuberwastaken 5 hours ago [-]
Thank you so much haha and yes! It indeed can, I always also like the idea of having QR code game cartridges of sorts haha

(PS I updated the hosted version again and it's much better for mobile controls, try it out if you get the time!)

dylan604 6 hours ago [-]
Or much more malevolent as well. Just because something novel and fun/entertaining can be done does not mean assholes will not use the same techniques for their gain.

PoCs like this are neat and definitely shows some skillz by the author, but now I'm hoping security types take a look at this to see how vulnerable this could be from asshats.

autoexec 5 hours ago [-]
It's already a good practice not to go around scanning random QR codes. Nobody has to go through the trouble of compressing a bunch of code to run in your browser when you can just make a QR code point to any malicious domain on the internet and infect devices all day long.
askvictor 5 hours ago [-]
Firefox mobile on Android gives "Cannot complete request; Additional information about this problem or error is currently unavailable" :(
kuberwastaken 5 hours ago [-]
Interesting, perhaps try a different browser?
deadbabe 9 hours ago [-]
How can there not be even one screenshot of the game in the readme?
kuberwastaken 9 hours ago [-]
Because it kept evolving and it was more related to the development than the game itself.

But if you want to skip the friction of scanning the QR code, you can directly play a hosted version at: https://kuberwastaken.github.io/backdooms/

deadbabe 7 hours ago [-]
It doesn’t work, but I don’t really care to play I just want to see the screenshots of what you made.
ant6n 8 hours ago [-]
Doesnt work on iOS (ipad). A screenshot would be nice.
kuberwastaken 8 hours ago [-]
Yeah, touch devices suck with it but here's the trailer with some gameplay if you really wanna see how it is: https://www.youtube.com/shorts/QWPr10cAuGc
kuberwastaken 7 hours ago [-]
Hey just wanted to update, I Managed to add kind of some mobile touch support here, so if you get an alternate chromium based browser, you can put in the URI to play on mobile too!
kuberwastaken 5 hours ago [-]
Heyo, update: I added a GIF to the repo, hope it's better :)
Barrin92 5 hours ago [-]
Love these minimal game projects. Reminds me of .kkrieger

https://en.wikipedia.org/wiki/.kkrieger

kuberwastaken 5 hours ago [-]
Yess!! Someone told me about it when I posted it on LinkedIn, so cool!
metalman 7 hours ago [-]
I am now waiting for news that someone has bio hacked a cockroach or a fruitfly to play doom, if not autonomously then for the full cold shivers, they are now robotisising insects, which could then be accesed through an interface to play doom on a toothbrush booted from a qr code. Sci-fi is lagging
kuberwastaken 5 hours ago [-]
One day indeed
EGreg 8 hours ago [-]
Reminds me of my submission to Allegro SizeHack 25 years ago, in 2000:

https://www.oocities.org/trentgamblin/sizehack/entries.html#...

I made a PacMan-like game in under 10KB... it was called HackMan :)

But I am most proud of the storyline that came with it!

kuberwastaken 7 hours ago [-]
That is SO cool!
bhavik_dand 8 hours ago [-]
crazy stuff!!
kuberwastaken 7 hours ago [-]
Thank you so much!
Lerc 8 hours ago [-]
I don't want to take away from the achievement because it really is awesome, and should be celebrated.

...but...

It seems like a fundamental design issue to make a QR code game that isn't designed for the platform where QR codes are most used.

kuberwastaken 7 hours ago [-]
Hey just wanted to update, I Managed to add kind of some mobile touch support here thanks to an awesome PR to further reduce the size, so if you get a chromium based browser, you can put in the URI to play on mobile too!
kuberwastaken 8 hours ago [-]
Totally understandable, I can make a snake game inside it fully compatible with mobile but mobile controls just take up a lot of space due to the sheer nature of them haha.

But the compression algorithm is up, feel free to make what you think is awesome and compatible, I'd love to see if you find out hacky solutions to make that work too :P

Lerc 7 hours ago [-]
I might just do something like that. Although I inevitably get caught up in designing some minor tech part.

Last time I attempted something like that I made stack machine texture maker, then embedded it inside a version of TTT that minifies+gzips to under 1500bytes. After a few years of pondering I think there are a few more enhancements to be had.

For reference, This URL has a bunch of textures in it.

https://fingswotidun.com/ttt/#W1s2NCw2NCwxMzExOV0sWzY0LDY0LD...

jerjerjer 9 hours ago [-]
Year 3567: automatic interstellar probe finds remnants a technical alien civilization.

Year 3678, Show HN: I compiled DOOM for an alien CPU architecture.

Vernor Vinge kind of touches this topic a bit in his Zones of Thought series.

kuberwastaken 9 hours ago [-]
Haha I solemnly promise that I'll compile DOOM for an alien CPU architecture if we ever get access to one!
leni536 9 hours ago [-]
flkenosad 8 hours ago [-]
How could one theoretically reverse-engineer a CPU?
flkenosad 8 hours ago [-]
With an electron microscope possibly.
DougMerritt 4 hours ago [-]
Sometimes, sometimes just optical, but in any case, there's even a guy, Ken Sherriff, who has been doing this as a hobby for ages. It's not like this is merely theoretical.

https://www.righto.com/search/label/reverse-engineering

8 hours ago [-]
curtisszmania 9 minutes ago [-]
[dead]
the_arun 10 hours ago [-]
My iPhone camera says - "No Usable Data found" when I scan the QR code.

On a different context, loading a game in QR code also made me to think, can anyone inject a malware script using QR codes?

conradev 9 hours ago [-]
ustad 8 hours ago [-]
Whats that doing? I get some error about some gallery???
kuberwastaken 9 hours ago [-]
That is seriously cool, didn't know those could do that haha
KeplerBoy 10 hours ago [-]
Sure if the parser is broken anything might happen.

Historically there have been exploits for Sony's PSP using modified .tiff images or an exploit for the Nintendo 3DS where a modified .m4a file could be used.

kuberwastaken 10 hours ago [-]
You'd need something like https://qrscanner.org/ because most phones suck at scanning larger QR codes.

Also, it won't work on your phone, can't put in that compatibility with size restraints, sadly

10 hours ago [-]
selfselfgo 8 hours ago [-]
[dead]
Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact
Rendered at 03:01:55 GMT+0000 (Coordinated Universal Time) with Vercel.