- The Backdooms ist ein HTML-Spiel, das direkt in einem QR-Code ausgeführt werden kann und von DOOM 1993 sowie The Backrooms inspiriert wurde
- Das Projekt wurde entwickelt, um die Grenzen von QR-Code-Speicherung und -Kompression zu testen und eine innovative Methode zu demonstrieren, leichte Webanwendungen innerhalb eines QR-Codes zu hosten
- Das Spiel kann durch Scannen des QR-Codes ohne Internetverbindung gespielt werden und wird in extrem komprimierter Form bereitgestellt
- Mit der API DecompressionStream kann das Spiel dynamisch im Browser ausgeführt werden
- Kompatibel mit modernen mobilen Browsern, und QR-Codes können mit Python und einer QR-Code-Bibliothek erzeugt werden
Projektüberblick
- The Backdooms ist ein HTML-Spiel, das direkt in einem QR-Code ausgeführt werden kann und von DOOM 1993 sowie The Backrooms inspiriert wurde
- Entwickelt, um die Grenzen von QR-Code-Speicherung und -Kompression zu testen und eine innovative Methode zu demonstrieren, leichte Webanwendungen innerhalb eines QR-Codes zu hosten
Funktionen
- Vollständig offline: Nach dem Scannen des QR-Codes kann das Spiel ohne Internetverbindung gespielt werden
- Extreme Kompression: Verwendet Zlib-Kompression, Gzip-Dekompressions-Streams und Base64-Kodierung, um das Endergebnis extrem stark zu komprimieren
- Selbstextrahierende Webseite: Führt das Spiel dynamisch im Browser mit der API
DecompressionStream aus
- Mobil kompatibel: Läuft in aktuellen mobilen Browsern, die die API Decompressionstream unterstützen (Edge, Yandex, Opera)
Installation und Abhängigkeiten
- Technisch ist nur ein moderner Webbrowser erforderlich, aber um einen QR-Code für ein etwa 2,5-kB-Spiel zu erzeugen, werden Python 3.7+, die Bibliothek
qrcode und pillow benötigt
Verwendung
1️⃣ Das Spiel in einen QR-Code umwandeln
- Das Skript mit folgendem Befehl ausführen:
python3 QRGEN.py <your-game.html> <output-qrcode.png>
2️⃣ QR-Code scannen
- Mit einem Smartphone oder QR-Scanner kann das Spiel direkt im Webbrowser geöffnet werden
3️⃣ Sofort spielen 🎮
- The Backdooms kann ohne Download oder Installation gespielt werden
Technische Analyse
Kompressions-Workflow
- Eingabe-HTML lesen: Liest den gegebenen HTML-Inhalt aus einer Datei oder Eingabequelle
- Zlib-Kompression + GZip-Dekompression: Komprimiert das HTML mit Zlib und nutzt den Decompressionstream von GZip, um die bestmögliche Kompression zu erreichen
- Base64-Kodierung: Kodiert die komprimierten Daten in Base64, damit sie textbasiert bleiben und sicher in eine HTML-Datei eingebettet werden können
- In HTML-Wrapper einbetten: Es wird ein JavaScript-basierter selbstextrahierender HTML-Wrapper erzeugt. Dieser Wrapper enthält eine Funktion der API DecompressionStream, die den Inhalt beim Öffnen im Browser automatisch dekomprimiert
- In Data-URI umwandeln: Wandelt das gesamte HTML in das Format
data:text/html;base64,... um, damit es ohne physische Datei einfach gespeichert und geteilt werden kann
Logik zur QR-Code-Erzeugung
- Das System versucht zunächst mit
qr.make(fit=True), die kleinstmögliche QR-Version zu erzeugen, indem die QR-Größe dynamisch an die Inhaltslänge angepasst wird
- Wenn die benötigte Version 40 überschreitet (die Grenze des QR-Code-Standards), wird mit
fit=False Version 40 erzwungen
- Es wird die niedrigste Fehlerkorrekturstufe L verwendet, die die maximale Datenkapazität erlaubt, um möglichst viele Daten unterzubringen
- Wenn die Daten trotzdem nicht in QR v40 auf Stufe L passen, schlägt der Prozess fehl und es wird eine Fehlermeldung zurückgegeben, dass die Daten zu groß sind, um in einen QR-Code kodiert zu werden
Ergebnis
- Bei Erfolg wird ein QR-Code erzeugt und angezeigt
- Bei einem Fehlschlag wird der Prozess mit einer Fehlermeldung beendet, dass die Daten zu groß sind, um in einen QR-Code kodiert zu werden
Lizenz
- Dieses Projekt wird unter der MIT-Lizenz veröffentlicht und kann frei verwendet, verändert und geteilt werden
Danksagungen
- id Software, die DOOM entwickelt haben
- matttkc, der diese Idee vor 5 Jahren vorgeschlagen hat
- Toby Fox, der die großartige Musik von Undertale geschaffen hat; die auf GitHub gehostete Version dieses Spiels verwendet eine 8-Bit-Version von Bonetrousle
- Entwickelt von Kuber Mehta
1 Kommentare
Hacker-News-Kommentare
Ich starte gelegentlich zufällige Projekte, und das war wieder so ein Fall. Es war ein Projekt, das ich Anfang dieses Jahres in einer Woche gebaut habe, aber nicht geteilt hatte; diesmal habe ich mich entschieden, es doch zu teilen.
Nächstes Projekt: ein LLM als QR-Code
Wirklich ein großartiges Projekt. Ich habe etwas über
data:-URLs gelernt. Ich kannte dasdata:-URI-Schema, wusste aber nicht, dass man es als vollständige URL verwenden kann. Ich hatte mich schon gefragt, ob man ein ganzes Spiel in einen QR-Code packen kann, hatte die Idee aber zurückgestellt, weil ich fälschlicherweise dachte, dass ein HTTP(S)-Link nötig sei. Das hier hat mich stark inspiriert: Könnte man ein ganzes Spiel in einen QR-Code packen? [YouTube-Link]Bitte füge dem Repository ein paar Screenshots hinzu. Ich schaue es mir auf dem Handy an und sehe aus irgendeinem Grund nur drei Buttons und einen schwarzen Bildschirm.
Ich habe es mit dem Standard-QR-Code-Scanner des iPhone gescannt, und es hieß: „Keine verwendbaren Daten“.
Du solltest das CSS des Canvas auf
image-rendering: pixelatedaktualisieren, damit das Bild nicht verschwommen, sondern scharf dargestellt wird.Bitte baue weiter coole Dinge, kuberwastaken.
Ein beeindruckendes Projekt. Ich warte darauf, dass „selbstenthaltener QR-Code“ zu canitrundoom hinzugefügt wird (ob das technisch zugelassen werden kann, weiß ich allerdings nicht).
Dieses Projekt fühlt sich an, als kämen wir Snow Crash näher. Ich habe mich gefragt, ob mein Gehirn sich verändert, nur weil ich den QR-Code anschaue :-D Erstaunliche Arbeit.
Sehr cool. Eine kleine Anmerkung aber: DOOM hat kein Raycasting verwendet. Dieses Projekt ähnelt eher Wolfenstein 3D, und Wolf3D hat Raycasting verwendet.