{ "id": 37036, "slug": "2018-02-21_snake-97-aktualisieren", "url": "https://agents.willem.com/de/posts/2018-02-21_snake-97-aktualisieren/", "source_url": "https://willem.com/de/2018-02-21_snake-97-aktualisieren/", "language": "de", "date": "2018-02-21", "published": "2018-02-21T00:00:00+01:00", "created": "2025-06-26T22:10:27.779000+02:00", "updated": "2026-10-20T09:20:31.699000+02:00", "title": "Snake '97 aktualisieren", "subtitle": "Über die Herausforderungen bei der Entwicklung eines wahnsinnig beliebten Spiels", "summary": "Vor ein paar Jahren hat mein Bruder in einer Amsterdamer Bar Bier über mein iPhone gekippt. Dem armen Ding schmeckte das niederländische Gebräu nicht so gut wie mir: Es ging ein. Während ich auf ein neues Handy wartete, benutzte ich ein altes, das nichts konnte außer SMS schreiben, telefonieren und... Snake! So wurde die Idee für Snake '97 geboren, und diesen Monat war es Zeit, das wahnsinnig beliebte Spiel zu aktualisieren.", "topics": [ "Windows", "android", "creating", "creativity", "design", "game", "iOS", "iPad", "iPhone", "programming", "retro", "server", "smartphone", "snake", "work" ], "author": { "name": "Willem L. Middelkoop", "url": "https://willem.com" }, "provenance": { "kind": "model", "method": "Gemini translation (2025), reviewed and corrected by Claude Sonnet (20 Oct 2026) against a glossary and hunspell", "date": "2026-10-20", "reviewed_by_native_reader": false, "language": "de", "source_language": "en" }, "translations": [ { "language": "en", "title": "Updating Snake '97", "url": "https://agents.willem.com/en/posts/2018-02-21_updating-snake-97/", "source_url": "https://willem.com/en/2018-02-21_updating-snake-97/" }, { "language": "nl", "title": "Snake '97 Updaten", "url": "https://agents.willem.com/nl/posts/2018-02-21_snake-97-updaten/", "source_url": "https://willem.com/nl/2018-02-21_snake-97-updaten/" }, { "language": "es", "title": "Actualizando Snake '97", "url": "https://agents.willem.com/es/posts/2018-02-21_actualizando-snake-97/", "source_url": "https://willem.com/es/2018-02-21_actualizando-snake-97/" }, { "language": "fr", "title": "Mettre à jour Snake '97", "url": "https://agents.willem.com/fr/posts/2018-02-21_mettre-a-jour-snake-97/", "source_url": "https://willem.com/fr/2018-02-21_mettre-a-jour-snake-97/" }, { "language": "it", "title": "Aggiornare Snake '97", "url": "https://agents.willem.com/it/posts/2018-02-21_aggiornare-snake-97/", "source_url": "https://willem.com/it/2018-02-21_aggiornare-snake-97/" }, { "language": "pt", "title": "Atualizar o Snake '97", "url": "https://agents.willem.com/pt/posts/2018-02-21_atualizar-o-snake-97/", "source_url": "https://willem.com/pt/2018-02-21_atualizar-o-snake-97/" }, { "language": "pap", "title": "Aktualisá Snake '97", "url": "https://agents.willem.com/pap/posts/2018-02-21_aktualisa-snake-97/", "source_url": "https://willem.com/pap/2018-02-21_aktualisa-snake-97/" }, { "language": "fy", "title": "Snake '97 fernije", "url": "https://agents.willem.com/fy/posts/2018-02-21_snake-97-fernije/", "source_url": "https://willem.com/fy/2018-02-21_snake-97-fernije/" } ], "image": "https://willem.com/global/images/da5f22919df3.webp", "image_width": 2560, "images": [ { "url": "https://willem.com/global/images/06e55a3e0198.webp", "description": "Café 't Pakhuis in Amsterdam, wo Snake '97 \"erfunden\" wurde", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-1.jpg" }, { "url": "https://willem.com/global/images/ee992b73bb44.webp", "description": "Snake '97 auf dem iPhone X: sieht aus und fühlt sich an wie das Retro-Handyspiel aus den 90ern", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-2.jpg" }, { "url": "https://willem.com/global/images/13f8f2dd6fc1.webp", "description": "Snake '97 rockt die Charts, neben Angry Birds und WhatsApp", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-3.jpg" }, { "url": "https://willem.com/global/images/87b0ccd8c5d9.webp", "description": "iPhone 4: ahh, süße Entwicklererinnerungen an die Zeit, als eine (kleine) Größe für alle passte...", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-4.jpg" }, { "url": "https://willem.com/global/images/3da50637eff4.webp", "description": "Prototyp von Snake '97 auf verschiedenen Geräten", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-5.jpg" }, { "url": "https://willem.com/global/images/8d20b82f1396.webp", "description": "Ich programmiere die neue Game-Engine und teste sie auf einem HMD Nokia 2 mit Android", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-6.jpg" }, { "url": "https://willem.com/global/images/37052d0f8036.webp", "description": "Dasselbe 3310? Schau genau hin und finde die Unterschiede zwischen iPhone SE und iPhone X", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-7.jpg" }, { "url": "https://willem.com/global/images/98f47b70cb4c.webp", "description": "Breitbild-Gameplay ist dank der neuen responsiven Grafik jetzt möglich", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-8.jpg" }, { "url": "https://willem.com/global/images/6848b7ac140f.webp", "description": "Snake '97 als macOS-Desktop-App, möglich dank der neuen skalierbaren Grafik", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-9.jpg" }, { "url": "https://willem.com/global/images/a5e27801afbd.webp", "description": "Geschwindigkeitsunterschiede im Gameplay per Zeitlupenvideo analysiert", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-10.jpg" }, { "url": "https://willem.com/global/images/6251dc574a72.webp", "description": "Der echte Code von Snake '97, der die Entfernung mit dem Satz des Pythagoras berechnet", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-11.jpg" }, { "url": "https://willem.com/global/images/07b9c2f3b1a4.webp", "description": "Snake mit einem Super-Nintendo-Gamepad zu steuern ist großartig (mit einem SuperSmart-joy-USB-Adapter)", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-12.jpg" }, { "url": "https://willem.com/global/images/fa191d607fbb.webp", "description": "Ein Trick, den das ursprüngliche Snake nicht konnte: das Spiel mit einem Bluetooth-DualShock-PlayStation-Controller samt analogem Thumbstick steuern", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-13.jpg" }, { "url": "https://willem.com/global/images/12934c0ebe67.webp", "description": "UX-Design für ein internationales Publikum. Oberflächen ohne Worte zu gestalten ist schwer!", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-14.jpg" }, { "url": "https://willem.com/global/images/37c761847d86.webp", "description": "Weltmeister von Snake '97, aber nicht mehr lange...", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-15.jpg" }, { "url": "https://willem.com/global/images/d31a2077c5a4.webp", "description": "So sieht die Cloud aus, liebe Jungs und Mädels.", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-16.jpg" }, { "url": "https://willem.com/global/images/5234dd3dd7ae.webp", "description": "Snake '97 als kostenloser Download für iOS, Android, macOS, Windows und ChromeOS", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_37036_images-17.jpg" } ], "text": "Snake '97\nUrsprünglich habe ich das Snake-Spiel 2011 für iOS programmiert. Ich brauchte ungefähr zwei Wochen für einen funktionierenden Prototyp, der aussah und sich anfühlte wie der echte Klassiker aus den 90ern. Mein anderer Bruder half mir bei der Grafik: Er machte ein paar gestochen scharfe Makroaufnahmen von meinem alten Handy (es ist immer noch ein seltsamer Gedanke, dass so viele von euch eine Kopie meines Handys in der Tasche haben).\nDas Spiel wurde von einigen großen Blogs (https://snake97.com/press/) aufgegriffen, und dadurch stürmte Snake '97 weltweit die Top-Platzierungen. Heute wird es auf der ganzen Welt gespielt, ist in 53 Sprachen übersetzt und für iOS, Android, Windows, ChromeOS und macOS erhältlich.\nZeit für ein Update\n2011 gab es nur ein einziges iPhone, das iPhone 4. Als Entwickler konnte man Android getrost ignorieren, und Windows Phone war noch nicht einmal erfunden. Das Leben war so schön, wie es sich ein (fauler) Entwickler nur wünschen kann: nur eine Bildschirmgröße.\nSpulen wir vor bis heute: Apple verkauft derzeit 8 iPhones, und da draußen gibt es Millionen und Abermillionen Android-Geräte, alle mit anderen Bildschirmgrößen, Prozessoren, Speichergrößen und Softwareversionen. Es ist eine Untertreibung, das eine Herausforderung zu nennen...\nUm den Spaß an Snake '97 zu erhalten, musste ich die Game-Engine von Grund auf erneuern. Irgendwie musste ich die Grafik an jeden Bildschirm der Welt anpassen und die Unterschiede bei Rechenleistung und Speicher auffangen....\nEine Game-Engine, sie alle zu knechten\nDie ursprünglichen Versionen des Spiels hatten alle ihre eigene Engine. Eine für iOS, eine für Android, eine für Windows und so weiter. Als ich Snake 2k (die Variante nach dem Vorbild von Snake II) herausbrachte, kam einfach noch ein Satz Engines dazu. Insgesamt habe ich 6 verschiedene Snake-Engines programmiert, in Objective-C (iOS), Java (Android) und C# (Windows). Sie auf neuen Geräten mit anderen Bildschirmgrößen, Prozessoren und Speicherkonfigurationen am Laufen zu halten, wurde immer schwieriger.\nAber diesen Monat habe ich in den sauren Apfel gebissen, und zwar richtig. Ich habe noch eine Snake-Engine entworfen und gebaut. Diese eine sollte aber alle vorherigen ersetzen. Sie muss auf iOS, Android und Windows laufen. Ich wollte eine Engine, die für die Zukunft gerüstet ist, für jeden Bildschirm und jede Art von Eingabe (Tastatur, Touch, Stift, Gamepad, Joystick, was du willst).\nHTML5 rockt\nDas Web hat die native App-Technologie eingeholt. Es gibt viele neue APIs, die umfangreiche, interaktive Erlebnisse auf ganz unterschiedlichen Geräten möglich machen. Ich fragte mich, wie schwer es wäre, Snake '97 mit Webtechnologie zum Laufen zu bringen. Es gab nur einen Weg, das herauszufinden, also legte ich los.\nResponsive Grafik\nZuerst baute ich die Grafik-Engine auf Basis von HTML5 Canvas und einem responsiven Skalierungssystem, das ich für die Android-Version von Snake '97 entworfen hatte. Im Kern misst die Engine die verfügbare Bildschirmgröße, die Ausrichtung und die Pixeldichte. Sie rechnet hochauflösendes Fotomaterial automatisch passend für deinen Bildschirm um.\nDie neue Grafik-Engine berücksichtigt sogar so seltsame Dinge wie die Notch des iPhone X. Das alles passiert in Sekundenbruchteilen. Ich habe sie außerdem so entworfen, dass sie auch auf Änderungen der Bildschirmgröße reagiert. Jetzt kannst du das Spiel im Hoch- oder Querformat spielen, im Fenster oder im Vollbild (oder im Split Screen, wenn du ein iPad hast).\nUnterschiede bei der Rechenleistung\nDu denkst, ein einfaches Spiel muss sich um Rechenleistung keine Gedanken machen? Falsch! Bei einem Spiel wie Snake ist das Timing entscheidend. Die Leute spielen mit \"Muskelgedächtnis\" und tippen auf dem Touchscreen immer wieder drauflos, ohne an einzelne Züge zu denken.\nDie Game-Engine muss berechenbar sein und konstant laufen. Vor allem aber muss sich das Spiel gleich anfühlen, egal ob du auf einem alten Android-Gerät spielst oder auf einem 6-Kern-Kraftpaket wie dem iPhone X.\nIch habe die Hochgeschwindigkeitskamera des iPad Pro benutzt, um Snake in Zeitlupe aufzunehmen. Mit dem Video konnte ich Geschwindigkeitsunterschiede Bild für Bild erkennen. Daraus entstand ein internes Benchmark-System (mit Timern, die Millisekunden zählen), das die Geschwindigkeit des Spiels automatisch und genau auf dein Gerät abstimmt.\nSteuerung: Touch, Tastatur, Stift, Gamepad\nDie Spieler steuern die Schlange mit der Retro-Steuerung (der alten Handytastatur). Die erste iOS-Version des Spiels benutzte feste, transparente UIButtons, die ich über die Fotos des alten Handys legte. Ein einfacher und wirkungsvoller Anfang.\nLeider hatten die Buttons von iOS eine gewisse Verzögerung (die Eingaben kamen unvorhersehbar spät an) und skalierten offensichtlich nicht auf andere Bildschirmgrößen. Für jedes neue iPhone, das Apple in den letzten Jahren herausgebracht hat, habe ich buchstäblich neue Koordinaten fest einprogrammiert.... kein schöner Job.\nDie neue Game-Engine nutzt einen Trick, den ich für die Android-Version entwickelt habe: dynamisch positionierte virtuelle Tasten. Mit den Skalierungsdaten, die die Grafik-Engine berechnet, pflege ich dynamisch eine Matrix aus X- und Y-Koordinaten, die zu den virtuellen Tasten passen. Wenn ein Spieler den Bildschirm berührt, berechnet die Engine mit Mathematik, genauer mit dem Satz des Pythagoras, die nächstgelegene Taste.\nDas funktioniert wie ein Zauber und macht den ganzen Bildschirm zu einer Taste. So macht das Spiel viel mehr Spaß. Zusätzlich zu Touch habe ich die Tastatur unterstützt, damit auch Leute ohne Touchscreen Snake spielen können.\nWährend ich an der Steuerung arbeitete, entdeckte ich noch mehr HTML5-Leckerbissen: die GamePad-API. Damit können Programmierer wie ich Gamepads, Joysticks und andere Eingabegeräte unterstützen, die per USB oder Bluetooth angeschlossen sind.\nVerschiedene Gamepads zu unterstützen ist knifflig, macht aber trotzdem Spaß. Ich habe garantiert einen ganzen Tag verloren, während ich \"testete\" ... und mit dem famosen SNES-Gamepad und dem wunderbaren Analogstick des DualShock-Controllers meine Skills perfektionierte. (\"Sorry, Schatz, ich arbeite hier...\")\nInternationalisierung\nWenn du das hier liest, verstehst du wahrscheinlich Englisch. Aber ein großer Teil des Snake '97-Publikums ist nicht englischsprachig. Es gibt Spieler in mehr als 30 verschiedenen Sprachen. Von Spanisch bis Russisch, von Arabisch bis Hebräisch, von Deutsch bis Japanisch. Nenn eine Sprache, Snake hat sie.\nEine Oberfläche zu gestalten, die auf Text beruht, ist schwierig, wenn man die ganze Welt erreichen will. Auch Icons sind nicht perfekt (ein Bild kann je nach Kultur etwas anderes bedeuten). Als UX-Designer muss man sich Konzepte überlegen, die weltweit verbreitet sind. Für Snake habe ich Icons mit einer Uhr, einem Tachometer, einem Lautsprecher und einem Pokal verwendet. Diese Symbole kennt man überall auf der Welt, und genau deshalb habe ich sie gewählt.\nDie App-Beschreibung besteht aus Text, den ich von einem professionellen Übersetzungsdienst übersetzen ließ. Manche anderen Publisher verlassen sich auf Google Translate, aber ich weiß, dass das zu trostlosen Ergebnissen führt.\nWeltweites Ranking\nIn den 90ern bekam man ordentlich Street Credibility, wenn man bei Snake einen guten Score erreicht hatte. In den Originalversionen von Snake '97 hattest du nur deinen eigenen Highscore zu schlagen, und auf iOS konntest du deine Punktzahl zu GameCenter hochladen.\nFür die neue Version wollte ich mehr globale Reichweite und habe das \"weltweite Ranking\" eingeführt. Es ist die neue, integrierte Bestenliste, die dein Spiel sofort einordnet und die Punktzahlen von Leuten aus der ganzen Welt vergleicht. Es gibt drei Ranglisten: aller Zeiten, 24 Stunden und letzte Stunde.\nDie Highscores werden von einem unglaublichen 48-Kern-Intel-XEON-Server mit einer Menge Speicher verarbeitet. Er läuft mit Debian GNU/Linux, MariaDB, NGINX und NodeJS. Zu Spitzenzeiten verarbeitet er mehr als 10 Spielergebnisse pro Sekunde. Das Server-Setup ist einen eigenen Blogbeitrag wert, den ich später schreiben werde. Behalte diesen Blog also im Auge, wenn Big Data dein Ding ist.\nJetzt herunterladen\nNur auf einem Weg findest du heraus, ob meine Arbeit gut war: Probier es selbst aus.\n- Android (https://play.google.com/store/apps/details?id=com.dsd164.snake97)\n- ChromeOS (https://play.google.com/store/apps/details?id=com.dsd164.snake97)\n- iOS (https://itunes.apple.com/us/app/snake-97-retro-phone-classic/id438052745?mt=8)\n- Mac (https://itunes.apple.com/app/snake-97-retro-phone-classic/id1349761776?mt=12)\n- Windows (https://www.microsoft.com/en-us/store/p/snake-97/9nblggh0ccmr)\n- Web (https://snake97.com)\nWenn dir Fehler begegnen, sag mir bitte Bescheid. Meine Kontaktdaten findest du hier (https://willem.com/).", "word_count": 1242, "markdown_url": "https://agents.willem.com/de/posts/2018-02-21_snake-97-aktualisieren/post.md" }