Sprite Animator Online — Tags, Timing and Loops for Games

In the Studio an animation is a tag: a run of frames with a direction, a repeat count and its own duration on every frame. Build tags from a sheet, a folder of PNGs or a GIF, watch them loop at the size you will ship, and send the very same timing to a GIF and to your engine.

A game animation built from sprites is a tag: a run of frames with its own duration on every frame, a direction (forward, reverse or ping-pong) and a repeat count. Build tags on Nerulio's timeline from a sheet, numbered PNG frames or a GIF (each GIF delay becomes that frame's duration), watch them loop at the size you ship, make a mirrored copy for the other direction, and export the same timing to one GIF per tag or to Godot 4, Unity 6, Phaser or Aseprite JSON. Engines that know only one FPS per animation get the tag's rate, and the export says so.

Drop a sprite sheet, numbered frames, a GIF / APNG or an .aseprite file

Open the empty Studio

Runs in your browser. Files are not uploaded.

The real Studio with a CC0 asset (OpenGameArt).

Exports to

Godot 4Verified· Godot 4.7.2
GIF / APNGDecoded· Pillow
Unity 6Verified· Unity 6000.5.3f1
Phaser 3 / 4Verified· Phaser 3.90 + 4.2
PixiJS 8Verified· PixiJS 8.21
Aseprite JSONVerified· Phaser load.aseprite · PixiJS 8.21
.asepriteVerified· Aseprite 1.3.18
Spine / libGDXVerified· spine-canvas 4.2
Starling / Sparrow XMLVerified· Phaser 4.2
LÖVEVerified· LÖVE 11.5
DefoldBuilt· Defold bob.jar 1.13.1
GameMakerUNVERIFIED
CSS spritesVerified· Chromium

A tag, and how engines replay it

Frame-by-frame animation is timing. A run cycle at even 80 ms reads as mechanical; a 300 ms anticipation pose before a jump reads as weight. So the timeline stores milliseconds on every frame and plays exactly that, and the tag's FPS is only the base for engines that count in ticks.

Engines replay the same tag in their own terms. Godot 4 stores an FPS per animation and a relative duration per frame (milliseconds ÷ the tick length). Unity keys a sprite at the start time of every frame in an AnimationClip. Phaser takes a duration in milliseconds per frame and counts repeat as extra plays. Defold and GameMaker play one rate per animation, so frames with their own durations lose them there. Ping-pong and reverse are written out as frame order for Godot and Unity, and become yoyo in Phaser.

A mirrored copy of a tag duplicates the frames and flips the pixels, the pivot and every box together, so run_mirror is a real animation with its own data. Flipping in the engine (Godot's AnimatedSprite2D has flip_h) saves texture space but leaves your box data unflipped.

Tag: Frames + per-frame ms + direction + repeat.
Relative duration (Godot): A frame's milliseconds ÷ (1000 ÷ the animation's FPS).
Mirrored copy: A new tag with pixels, pivot and boxes flipped horizontally.

Example: one attack tag in four exports

Tag attack at 12 FPS, frames 80, 80, 80 and 250 ms, forward, repeat 3.

one cycle   80 + 80 + 80 + 250 = 490 ms; three plays = 1,470 ms
tick        1000 ÷ 12 = 83.33 ms
Godot 4     speed 12; durations 80 ÷ 83.33 = 0.96 (×3), 250 ÷ 83.33 = 3.0; loop off
Unity 6     keys at 0, 0.08, 0.16, 0.24 s, closing key at 0.49 s; Loop Time off
Phaser      duration 80, 80, 80, 250 per frame; repeat 2 (= 3 plays)
GIF         delays 8, 8, 8, 25 (1/100 s); loop count 2 (= 3 plays)

Godot and Unity have no repeat count, so a tag that plays 3 times becomes "loop off" there: it plays once and you replay it from code (Godot's animation_finished signal). More on Godot's side: Godot frame durations.

What it does

Tag lanes above the frames: drag across a run to create a tag, rename it in place, drag either end to grow or shrink it.
Milliseconds on each frame, typed one at a time or applied to a whole selection — a 300 ms anticipation pose between 80 ms steps is ordinary here.
Direction forward, reverse or ping-pong plus a repeat count, where 0 means loop forever; playback inside the tag obeys both, so what you watch is what the export plays.
Onion skin (F3) shows the frames before and after with adjustable opacity and tint; the floating preview (F7) plays the loop at 1× to 8× in a window of its own.
Mirrored copy of the tag: a run-right becomes a run-left with the pixels, the pivot and every box flipped together.

How to do it

Drop a sheet (and press Apply), a set of numbered frames or a GIF — each GIF delay arrives as that frame's duration.
On the timeline, drag over the frames of one move to make a tag and name it idle, run or attack.
Type the durations, choose the direction and repeat, then press Enter to watch it and use , and . to step.
Export one GIF per tag, or open Pack & Export for Godot 4, Unity 6, Phaser or Aseprite JSON.

Check the result

Press Enter on the tag: a finite tag stops on its last frame after its repeats; ping-pong does not repeat the end frames.
Hover frames on the timeline to read their milliseconds; select several frames to set one duration for all.
After export, compare one cycle's length in the engine with the sum of the frame durations.

Where each animation setting ends up

The same tag, as each export writes it.

Setting	Godot 4 SpriteFrames	Unity 6 clip	Phaser anims.json	Aseprite JSON	GIF
Tag name	Animation name	One AnimationClip per tag	Animation key	frameTags name	One file per tag
Frame duration (ms)	speed = tag fps; duration = ms ÷ (1000 ÷ fps)	Each frame keyed at its own time	duration in ms on each frame	duration in ms on each frame	Delay in 1/100 s, 2 at least
Direction	Reverse and ping-pong written out as frame order	Reverse and ping-pong written out as frame order	Reverse written out; ping-pong = yoyo	direction: forward, reverse or pingpong	Frames in playback order
Repeat (0 = forever)	loop on only for 0	Loop Time on only for 0	repeat −1 for forever; n plays = repeat n−1	repeat count in frameTags	Loop count 0 for forever, n−1 for n plays, none for a single play

Troubleshooting

Symptom	Likely cause	How to check	Fix
A play-once attack loops in the engine	The tag's repeat is 0 (forever)	The tag panel shows repeat 0	Set repeat to 1 before exporting
A held pose is too short in Defold or GameMaker	These targets play one rate per animation, so per-frame durations are dropped	The export notes say the frames have different durations	Duplicate the held frame (Alt+N) so it lasts several base ticks, or accept the even timing
The run-left animation hits on the wrong side	The engine flips the pixels but not your box data	Compare the hitbox side in run and in the flipped run	Use the mirrored copy of the tag (pixels, pivot and boxes flipped), or mirror the box x in code
Phaser plays one play too many	A repeat typed by hand in Phaser as the number of plays	The repeat value in the animation config	Phaser counts extra plays: use plays − 1 (the export already does)

Other ways to do it

Option	When it is the better choice
Aseprite's timeline	You draw and time frames in the same place; Nerulio reads the tags and durations from the .aseprite file later.
The engine's animation editor (Godot SpriteFrames panel, Unity Animation window)	You need animation events, blending or state machines that live in the engine anyway.
Skeletal animation (Spine and similar tools)	Characters built from moving parts rather than drawn frames; Nerulio only packs their atlas (Spine atlas).

Engine exports and how each was checked

"Verified" means the exported files were loaded by the real engine or tool on real CC0 assets and the result was compared with the source. Anything that was not loaded is labelled as such.

Target	Files	Check
Godot 4	`.tres SpriteFrames · .tscn AnimatedSprite2D · .png.import`	Verified Godot 4.7.2Loaded by Godot; every animation frame drawn and compared with the source file. The scene uses Nearest filtering; rotation is never used.
Unity 6	`.unity.json · Editor/NerulioSpriteImporter.cs · AnimationClip`	Verified Unity 6000.5.3f1Batch mode: sprite rects, pivots, pixels, clip keys and durations checked.
Phaser 3 / 4	`atlas JSON (multiatlas) · .anims.json`	Verified Phaser 3.90 + 4.2Frames and animations drawn by both versions.
PixiJS 8	`spritesheet JSON · animations · anchor · meta.scale`	Verified PixiJS 8.21Rotated and multi-page atlases included.
Aseprite JSON	`hash / array · frameTags · slices`	Verified Phaser load.aseprite · PixiJS 8.21Tags keep their direction and repeat count.
.aseprite	`layers · tags · durations · slices`	Verified Aseprite 1.3.18Opened and rendered by the Aseprite command line.
Spine / libGDX	`.atlas`	Verified spine-canvas 4.2Every region drawn by the Spine runtime, rotated and trimmed; libGDX itself was not run.
Starling / Sparrow XML	`XML per page`	Verified Phaser 4.2Phaser 3.90 draws trimmed XML frames wrongly (its own bug); the "Sparrow XML (Phaser 3)" preset turns trim off and passes in 3.90 and 4.2.
LÖVE	`Lua quads · nerulio_atlas.lua · main.lua`	Verified LÖVE 11.5Every frame drawn and every animation stepped through the shipped helper.
Defold	`.atlas · .tilesource`	Built Defold bob.jar 1.13.1Built by Defold's command-line builder; the built texture's UVs were read back.
GameMaker	`spr_<name>_stripN.png · gamemaker.json`	UNVERIFIEDNot loaded in GameMaker (no headless GameMaker). The strips are cut the way its strip importer cuts them.
CSS sprites	`.css · preview .html`	Verified ChromiumEvery class drawn from the shipped stylesheet.
GIF / APNG	`one file per animation`	Decoded PillowEvery frame and delay decoded again after export; APNG is exact.

Evidence

GIF decoder: 408 of 408 frames identical to Pillow on 29 real GIFs; APNG 132 of 132 on 16 files. .aseprite: 231 corpus files imported, re-written and reopened in Aseprite 1.3.18 with the same tags, durations and pixels (231/231). Exports: 49 runs in the real engines on real CC0 assets, 47 pass — the 2 failures are Phaser 3.90's trimmed-XML bug, which the Phaser 3 preset avoids.

Limits

Frame-by-frame only: no tweening, bones or interpolation.
Repeat counts above 1 are not stored in Godot or Unity; they play once there.
Defold rounds the animation FPS to a whole number.
A grid or island guess is a preview with a confidence; nothing is cut until you press Apply, and every choice has one-click alternatives.
.aseprite files whose layers do not compose exactly (e.g. group opacity) are imported flattened, and the Import panel says why.
Rotated frames in an imported atlas stay rotated; their export is UNVERIFIED.
Images up to 32,768 px per side (268 million pixels), subject to your browser's memory.

Versions and sources

Clip keys and durations were read back from Unity 6000.5.3f1, animation speed, loop and relative durations from Godot 4.7.2, and animations played in Phaser 3.90 and 4.2. The Godot node properties named here follow the Godot 4.7 documentation.

Official documentation used

Questions

Why a duration per frame instead of one frame rate?

Because animation holds some poses longer than others. Engines that think in one rate still get the right timing: Godot 4 receives the tag's fps as the speed and each frame's share of it as a relative duration (250 ms at 12 fps becomes 3.0).

What does ping-pong become in Godot or Unity?

Godot's SpriteFrames has no ping-pong setting, so the Godot and Unity exports both write the order out: frames 1, 2, 3, 2 and so on. Reverse is written the same way. Phaser gets yoyo instead, and Aseprite JSON keeps the direction in frameTags.

Why is my fastest GIF frame slower than I set?

GIF delays count in hundredths of a second, and browsers and Discord treat 0 or 1 as 10. The writer therefore never goes below 2 (20 ms) and tells you which frames it rounded. APNG stores milliseconds if you need exact timing.

Is it free, and do I need an account?

Everything on these pages is free and works without an account. There is no watermark and no export that is held back.

Are my sprites uploaded?

No. The Studio decodes, packs and exports in this browser tab. Projects are autosaved in the browser (IndexedDB) and can be saved as a .nerulio file.

Does it need Aseprite or an engine plugin installed?

No. .aseprite files are read and written in the browser, and each engine bundle carries what that engine needs (for Godot, the import settings and scene; for Unity and the Godot TileSet, a small editor script).