Sprite-Sheet-Slicer

Die passende Schnittmethode für dein Sheet

Ein Sprite-Sheet kann eine präzise Matrix aus Animationsframes, ein Tileset mit regelmäßigen Innenabständen oder eine locker gepackte Sammlung von Symbolen sein. Diese Anordnungen erfordern unterschiedliche Erkennungsverfahren. Der Slicer vereint sie in einem Ablauf, überlässt die endgültige Entscheidung aber dir.

Die Einstellungen orientieren sich an etablierten Sprite-Abläufen statt an einem neuen Rastermodell. Der Sprite Editor von Unity unterstützt automatische Schnitte sowie Raster nach Zellgröße oder Zellanzahl und bietet Versatz-, Padding-, Leerzellen- und Pivot-Einstellungen. Der Sprite-Sheet-Import von Aseprite arbeitet ebenfalls mit x/y-Versatz, Sprite-Breite und -Höhe, Padding und Leserichtung. Dieser Slicer konzentriert sich auf die Extraktion: Er exportiert Schnittkoordinaten, erstellt aber keine Projektdateien für Unity, Godot oder Aseprite.

Automatische Erkennung ist ein Ausgangspunkt, kein Versprechen

Die automatische Erkennung sucht nach voneinander getrennten sichtbaren Bereichen. Das geht schnell, wenn zwischen den Sprites transparenter Raum liegt. Kein Detektor kann jedoch für jedes Sheet die vom Künstler beabsichtigten Frame-Grenzen erraten. Zwei Figuren, die sich berühren, können als eine Komponente erscheinen; ein abgesetzter Schatten oder Funke dagegen als eigener Treffer. Der Extraktionsleitfaden von Phaser beschreibt dieselbe Einschränkung verbundener Pixel: Berührende Sprites werden gemeinsam erkannt.

Prüfe die nummerierten Rahmen deshalb immer vor dem Export. Die automatische Erkennung bietet keine Regler für Toleranz, Mindestgröße oder Zusammenführungsabstand, korrigiere das Ergebnis daher von Hand. Wird ein einfarbiger Hintergrund als Motiv erkannt, stelle die Erkennung leerer Pixel auf die Hintergrundfarbe der Ecke oder schalte sie aus und schneide stattdessen per Raster. Ist das Ergebnis zu stark zerstückelt, lösche die überzähligen Rahmen und zeichne einen Rahmen um den gesamten Sprite. Berühren sich zwei Frames, ersetze den zusammengefassten Vorschlag durch manuelle Rahmen. Das ursprüngliche Sheet wird dabei nie verändert.

Inhalt von ZIP und frames.json

PNG ist das Standardformat, weil es Pixel und Transparenz unverändert erhält. Jeder ausgewählte Frame bekommt anhand seines Namens oder des gewählten Präfixes einen sicheren, eindeutigen Dateinamen. Das ZIP bündelt diese PNGs mit der Manifestdatei frames.json. Ein Eintrag enthält Name, Reihenfolge und Quellrechteck des Frames:

{
  "name": "player-run-03",
  "x": 128,
  "y": 64,
  "width": 32,
  "height": 48
}

Die Koordinaten beziehen sich auf die Pixel des Quellbilds und werden von dessen linker oberer Ecke aus gemessen. Sie eignen sich für Skripte und eigene Pipelines. Die Datei ist bewusst allgemein gehalten und weder ein engine-spezifischer Atlas noch eine Importdatei.

Private lokale Verarbeitung mit begrenzter Wiederherstellung

Dekodierung, Erkennung, Bearbeitung, Zuschnitt und ZIP-Erstellung finden im Browser statt. Bilddaten und Dateinamen werden nicht an den Server gesendet. Damit der mehrstufige Ablauf wiederhergestellt werden kann, darf der aktive Tab eine begrenzte lokale Arbeitskopie samt Einstellungen bis zu zwei Stunden lang aufbewahren. Neu beginnen entfernt das Projekt des aktiven Tabs sofort. Ein separat geöffneter Tab besitzt eine isolierte Kopie; sie wird innerhalb von zwei Stunden automatisch gelöscht, auch wenn ein anderer Tab zurückgesetzt wird.

Schließe bei großen Sheets andere bildintensive Tabs und vermeide Hunderte leerer Frames. Der Slicer meldet Größen- oder Framegrenzen, statt die Bildqualität unbemerkt zu verringern. Downloads verwenden temporäre Objekt-URLs des Browsers, die nach Gebrauch entsprechend den MDN-Hinweisen zu Objekt-URLs freigegeben werden.

Prüfliste vor dem Export

• Prüfe, ob die Leserichtung der Animation oder Tile-Reihenfolge entspricht.
• Vergrößere die Ansicht und kontrolliere den ersten, mittleren und letzten Frame auf Abweichungen um ein Pixel.
• Schließe leere Zellen und versehentliche Pixelreste aus, sofern ihre Position nicht bewusst erhalten werden soll.
• Verwende eindeutige Namen und suche vor der ZIP-Erstellung nach Duplikaten.
• Prüfe transparente Kanten vor einem kontrastreichen Vorschauhintergrund.
• Korrigiere Rahmen über Felder oder Schaltflächen, wenn präzises Ziehen schwierig ist. Der Ablauf bleibt gemäß den W3C-Empfehlungen zur Tastaturbedienung per Tastatur nutzbar.