spiel ins web portieren

Ein Spiel ins Web portieren

Ein Browser-Build hat kein Dateisystem, eine harte Speichergrenze und einen Download, dem der Spieler zusieht. Diese drei Fakten prägen die ganze Portierung.

Ein Spiel ins Web zu portieren heißt, eine Browser-Version eines Spiels zu bauen, das dir gehört und das über WebAssembly und die Grafik-APIs des Browsers läuft. Eine Tatsache gilt speziell für Summer Engine. Summer exportiert einen Web-Build für ein GDScript-Projekt, und du veröffentlichst ihn auf Summer Games, wo Leute das Spiel im Browser spielen. Diese Seite erklärt, was ein Browser-Build braucht.

Das Web ist die einzige Plattform, auf der der Spieler deinem Download zusieht. Jedes Megabyte ist eine Gelegenheit abzuspringen. Der Speicher ist niedriger gedeckelt als auf dem Desktop, besonders in mobilen Browsern. Es gibt kein Dateisystem, Spielstände liegen also im Browser-Speicher, den der Spieler löschen kann. Audio darf erst starten, wenn der Spieler mit der Seite interagiert hat.

Dafür bekommst du sofortiges Spielen, einen Link, den du überall posten kannst, und keine Store-Freigabe. Das macht einen Web-Build zu einem starken Demoformat neben einem Desktop-Release, wenn deine Engine es unterstützt.

Größe und Ladezeit entscheiden

Lege vor dem Start ein Downloadbudget fest und gestalte darauf hin. Komprimiere Texturen, skaliere alles herunter, was ohnehin nicht in voller Auflösung sichtbar ist, wandle Audio mit sinnvollen Bitraten nach OGG und schneide ungenutzte Inhalte aus dem Export. Lade eine spielbare erste Szene schnell und streame oder lade den Rest verzögert nach. Zeige echten Fortschritt statt eines Ladekringels. Ein Web-Build, der dreißig Sekunden bis zum Start braucht, verliert die meisten, die geklickt haben.

Browser-Grenzen, um die du herum programmierst

Audio-Kontexte bleiben bis zu einer Nutzergeste angehalten, ergänze also einen Klick-zum-Start-Bildschirm. Der Speicher liegt lokal im Browser und ist löschbar, verlass dich also nicht fest auf Spielstände und biete einen Export oder eine Cloud-Option an, wenn Fortschritt wichtig ist. Tabs wandern in den Hintergrund und werden gedrosselt, pausiere also bei Sichtbarkeitswechsel. Nutze Delta-Zeit, denn die Framerate schwankt stärker als nativ. Vollbild und Pointer Lock brauchen beide eine Nutzergeste. Mobile Browser haben weniger Speicher und keine Tastatur.

Eingabe auf einer Seite

Unterstütze Tastatur und Maus, Gamepads über die Gamepad-API des Browsers und Touch für Mobilgeräte. Verhindere, dass die Seite scrollt, wenn der Spieler Pfeiltasten nutzt oder auf dem Canvas wischt. Behandle den Fokusverlust, wenn der Spieler neben das Spiel klickt. Mach das Canvas für unterschiedliche Fenstergrößen responsiv, statt eine feste Auflösung anzunehmen, und teste sowohl in einem kleinen Laptop-Fenster als auch auf einem vollen Desktop-Bildschirm.

Wo du es hosten kannst

Ein Web-Build aus Summer ist eine normale statische .zip mit index.html im Stammverzeichnis, und Summer Games ist der Ort, um ihn zu veröffentlichen. itch.io hostet HTML5-Builds und übernimmt die Einbettung, innerhalb der Grenzen von 500 MB insgesamt, 200 MB pro Datei und 1.000 Dateien. Newgrounds und Portale für Webspiele nehmen weiterhin Browser-Titel und zahlen nach Traffic oder über eine Umsatzbeteiligung. Selbst hosten funktioniert mit jedem statischen Host. Ein Single-Threaded-Build ab Godot 4.3 braucht keine speziellen Header, während ein Build mit Threads Header für Cross-Origin-Isolation braucht. Eine Browser-Demo speist auch eine Steam-Seite, und viele Entwickler veröffentlichen eine kostenlose Web-Demo neben einem kostenpflichtigen Desktop-Release.

Häufig gestellte Fragen

Kann ich C# für einen Browser-Build nutzen?

Nicht mit C#. Godot 4 kann C#-Projekte nicht ins Web exportieren, und das gilt auch in Summer. Ein GDScript-Projekt exportiert in Summer einen Web-Build, und du veröffentlichst ihn auf Summer Games. C# ist im Desktop-Editor von Summer für Desktop-Builds verfügbar.

Warum lädt mein Web-Build so langsam?

Fast immer wegen der Downloadgröße und unkomprimierter Assets. Verkleinere zuerst Texturen und Audio, entferne ungenutzte Inhalte und teile dann das Laden auf, damit eine spielbare Szene erscheint, bevor der Rest ankommt.

Funktionieren Web-Builds auf Handys?

Ja, mit Designarbeit. Mobile Browser haben weniger Speicher, keine Tastatur und nur Touch-Eingabe, plane also ein kleineres Asset-Budget und Touch-Steuerung ein, statt das Desktop-Layout auszuliefern.

Können Spieler in einem Browserspiel den Fortschritt speichern?

Ja, über den Browser-Speicher, aber er kann vom Spieler oder vom Browser gelöscht werden. Ergänze bei langen Spielen einen Export-Code, einen Datei-Download oder einen an ein Konto gebundenen Spielstand.

Kann dasselbe Projekt auch auf Steam erscheinen?

Ja. Summer exportiert Desktop-Builds für Windows und macOS für Steam, und ein GDScript-Projekt exportiert außerdem einen Web-Build. Eine kostenlose Browser-Demo auf Summer Games kann also neben dem Steam-Release stehen.

Weiter erkunden

Weitere Wege, mit Summer Engine zu bauen

KI-Spielemacher

Die Zentrale, um komplette 2D- und 3D-Spiele durch Beschreiben zu erstellen.

Öffnen

Port a 3DS game to web

A browser build of a 3DS game you own needs a small payload, touch and keyboard input, and the right host. Summer Engine exports web builds for GDScript projects.

Öffnen

How to port a 3DS game

The full process, in order: rights, asset inventory, rebuild, screen and input redesign, testing, export, and store submission.

Öffnen

Port a game to Steam

Steam takes a desktop executable, a depot, and a store page. This is the checklist for getting any game from another platform onto it.

Öffnen

Port a game to iOS

Any iOS release needs a Mac, an Apple Developer account, a signed build, and a design that works with thumbs. This is the full path.

Öffnen

Port a game to Android

Android has the lowest barrier to testing and the widest device spread. Signing keys and the target API level are what actually block releases.

Öffnen

Port a game to Nintendo Switch

There is no self serve Switch export. Nintendo approves developers, provides the SDK and dev kits under NDA, and certifies every build.

Öffnen

Port a game to console

Every console platform gates access. Approval, an NDA covered SDK, dev kits, and certification come before any build reaches a store.

Öffnen

Port a game to Steam Deck

Steam Deck runs your existing Steam build. The port is a compatibility pass: controller first input, readable text, and a power budget.

Öffnen

Platformer-Vorlagen

Starte mit einem fertigen Projekt und beschreibe deine Änderungen.

Durchsuchen

Alle Spielvorlagen durchsuchen

Starte mit einem fertigen Projekt und beschreibe deine Änderungen.

Durchsuchen

Beginne jetzt mit deinem Spiel

Lade Summer Engine herunter, beschreibe, was du willst, und sieh zu, wie es entsteht. Kostenlos starten, ohne Programmieren.