Gifs in Roblox with only 1 image

Hello! Recently texture offsets were added to the game, since this addition I have used this new feature to convert gifs into spritesheets for animation!

Today I would like to showcase this creation and give it to you to use as well!

Now you may be thinking: “But aren’t there already gifs on roblox?” and you’d be semi-right
The old way of uploading gifs required you to upload every single frame as a seperate image and then loop through showing them, or using surface guis, which while in some usecases is fine, but textures, since they can wrap around an object, would be much more useful than surface guis
This method only requires you to upload a single image, which is much easier to do.

First you need to convert your gif into a spritesheet, I found this nice tool online that does just that:
https://jacklehamster.github.io/utils/gif2sprite/

after you convert your gif, you should have something like this


You will need to get how many columns, rows, and frames your gif has
in my case i have 4 columns, 5 rows, and 4*4+2 frames

I just plug that into the script, set the texture id, and adjust the fps and any other things i need to adjust and i have a gif!

(This game is uncopylocked if you want to take a look at the scripts)


(Or optionally you can also use this place file)
RobloxGifs.rbxl (22.3 KB)

299 Likes

For anyone skeptical as I was of this working, here’s a sprite sheet tester.

15 Likes

This has been done previously via ImageLabels with offsets, but being able to use a texture instead may prove valuable in various scenarios.

Well done!

11 Likes

This is really helpful, thanks for making this!

8 Likes

100% Gonna use this, very nice! Keep it up! :heart_eyes::smile:

8 Likes

This is a very creative use of the new Texture Offset feature!
Good job, and specially thanks for sharing how it’s done. Will most likely use this in the near future.

6 Likes

Thank you that’s pretty helpful.

6 Likes

This has been achievable for a long time using SurfaceGuis

4 Likes

Yes, but there are a lot more usecases for using textures instead as they wrap around the object, allowing for animated textures on a 3D model or whatever you may need it for.
(although i would only reccomend using this method on small models as since roblox limits decals to 1024x1024 pixels it will reduce your image quality)

8 Likes

Thank you for this. This will be useful for a lot of future games and projects.

3 Likes

Wow thanks for the useful info! I will definitely use this in games I may create.

2 Likes

You can achieve a higher quality image by splitting the spritesheets into sections and saving them as images. Although this does defeat using one image, It gives a higher quality as compensation. Probably, the image can be changed after it has finished going through the last frame.

6 Likes

Don’t you mean 4*5+2? Or where does the other 4 come from?
I’m confused.

2 Likes

I only have 2 frames on the last row, therefore the amount would be 4*4 for the other rows, and +2 for the last row.

2 Likes

I HAVE THE BEST IDEA.

If we sync audio to these gifs, could we theoretically have make-shift videos in Roblox? Along with loads of gifs back-to-back?

2 Likes

Already done it, (will edit this when I get on my computer later to show a video), I’m more excited for videoframes though.

3 Likes

Mmm… The customization options are expanding into animated textures! Maybe one day we could get a gif decal thing? Not sure. Anyway, didn’t realize that this was possible for texture offsets. Will definitely use for some really cool weapons.

5 Likes

Nice! But @Wunder_Wulfe already made a API about that.


I assume this is an update version?

1 Like

It isn’t about that, this thread is meant to showcase that it can be done with textures now instead of surfaceguis, as stated previously in the thread.

2 Likes

Also to mention, mine supports multiple spritesheets so that would be a good addition to this module, allowing for longer and more complex gifs to play without too much resolution loss

2 Likes