Transparente Animationen in Construct 3 importieren

Zuerst das geprüfte Beispiel testen

Lade das Construct-3-Beispielpaket herunter: 96 transparente PNG-Frames mit jeweils 96 × 96 Pixeln bei 24 FPS. Dafür musst du keine Animation erzeugen oder kaufen.

Geprüft am 28. September 2026 mit Construct r495.2 Free in Chrome unter macOS: Importeinstellungen, Wiedergabe, Transparenz und Abgleich des gespeicherten Projekts mit den exportierten Frames. Dies ist ein Workflow für Animationsassets, kein Construct-Addon und kein vollständiges .c3p-Spielprojekt.

Animation in AnimGen vorbereiten

Erzeuge oder importiere ein Video, wähle den brauchbaren Ausschnitt und prüfe die Frame-Reihenfolge. Für Transparenz brauchst du geeignetes Quellmaterial und aktivierten transparenten Export. Ein Engine-Paket allein entfernt keinen Hintergrund. Siehe transparente Animationen.

Wähle beim Export das Construct-3-Paket. In Web Studio benötigt es eine kostenpflichtige Exportberechtigung. Das öffentliche Beispiel ist für Kompatibilitätstests kostenlos herunterladbar. Siehe Credits und Zugang.

Nutze für Frame-Bearbeitung den Advanced Editor. Stelle FPS und Schleife ein und warte vor dem Export auf das Speichern. Dieser Export übernimmt die gespeicherte Schleifeneinstellung. Schnell- und API-Exporte sind standardmäßig wiederholend; du kannst das nach dem Import in Construct ändern.

Nur das äußere ZIP entpacken

AnimGen_<id>_Construct3/
  animation.zip
    c3-import-settings.json
    frame_0000.png
    frame_0001.png
    ...
  spritesheet.png
  animgen-manifest.json
  README_Construct3.md

Entpacke das äußere Paket, aber lasse die innere animation.zip unverändert. Sie ist die Importdatei. Ihre Einstellungen enthalten Frame-Reihenfolge, Animationsname, FPS, Schleife und Bildursprung. Der Atlas dient als Referenz und gehört nicht als zusätzlicher Frame in die Animation.

Über die obere Werkzeugleiste importieren

1. Erstelle in einem kleinen Construct-Testprojekt ein Sprite oder öffne den Animationseditor eines vorhandenen Sprites.
2. Öffne in der oberen Werkzeugleiste das Menü neben dem Ordnersymbol.
3. Wähle Load animations und danach die innere animation.zip.
4. Wähle die neue Animation aus und prüfe ihre Eigenschaften. Verwende für diesen Ablauf nicht Load frames.
5. Schließe den Editor, setze Initial animation der Sprite-Instanz auf die importierte Animation und starte die Layout-Vorschau. Eine leere Standardanimation kann weiterhin vorhanden sein.

Die Aufnahme zeigt die vereinfachte chinesische Oberfläche. Der zweite Eintrag 导入动画表 entspricht Load animations. Siehe auch das offizielle Construct-Handbuch.

Ergebnis und Wiedergabe prüfen

Dies ist der tatsächliche Testeditor. Das Beispiel heißt tactician_slash; andere Namen im Bild gehören zu separaten QA-Testdaten.

Ein separater Test mit 45 Frames, 23.976 FPS und deaktivierter Schleife stoppte bei Frame 44. AnimGens Pivot (0.25, 0.75) wurde bei 96 × 96 Pixeln zum Ursprung (24, 24).

AnimGens normalisierter Pivot beginnt unten links, Constructs Bildursprung oben links. Der Exporter rechnet bereits originY = 1 - pivotY um. Spiegle Y nicht noch einmal. Siehe Canvas und Pivot.

API und MCP verwenden

Fordere construct3_pack in export.output_formats über den Frame-Count-Workflow an. Der Sampling-Pfad mit export.fps in der gestuften API unterstützt aktuell nur Sprite-Sheet plus JSON; ergänze dort kein Construct-Paket. Siehe Auswahl und FPS.

Kostenvoranschlag, Freigabe, Erstellung, Polling und Download bleiben erforderlich. API/MCP-Zugang folgt dem Entwicklervertrag; kommerzielle Rechte folgen weiterhin den kostenpflichtigen Nutzungsbedingungen. Siehe API-Schnellstart und MCP-Workflow.

Häufige Probleme beheben

• Ganzer Atlas oder doppelte Bilder: Prüfe, ob du das innere ZIP statt des äußeren Pakets oder Referenzatlas gewählt hast.
• Falsche Geschwindigkeit, Schleife oder Ursprung: Importiere über die Werkzeugleiste und vergleiche die ausgewählte Animation mit animgen-manifest.json.
• Leere oder unbewegte Szene: Prüfe Initial animation und Speed und starte die Layout-Vorschau statt nur den Bildeditor zu betrachten.
• Positionssprünge zwischen Aktionen: Verwende dieselbe Canvas-Größe und denselben Pivot. Der Pivot ist keine automatisch erkannte Fußposition.
• Unpassende Kollision: Prüfe Kollisionspolygone in Construct. Das Paket konfiguriert keine Kollisionen, Ereignisse, Controller oder speziellen VFX-Materialien.

Weiter zu Ausgabeformaten, Exportproblemen oder mit eigenen Grafiken starten.