Upvote 1

Cannot put an animated GIF in the prototype

Answered Victor Conesa ● ago

Hi,

I raise this question again, because, as I can see, Justinmind now converts all GIF's in exported prototypes to PNG. Thus, it seems to be impossible to put any animations in a prototype but manually edit the HTML-source or create sequences of actions like "pause 100 ms, change image, pause, etc".

Is it a bug or a feature?

Replies (6)

Carles Galdo ●

Hi,

The GIF's shouldn't be converted to PNG images when the prototype is exported to HTML. What version of Justinmind Prototyper are you using?

Enrique Cano ●

5.1.0

Carles Galdo ●

Does this happens with all GIF's? Do you mind to send your prototype so we can reproduce your problem?

Also, please can you tell me which browser are you using?

Enrique Cano ●

I've sent you an example prototype.

I tested different browsers, based on webkit and gecko, but I think it's unrelated to the problem.

Carles Galdo ●

Thanks for the example, I checked the prototype contents you sent us and I found that the images stored on the prototype have a PNG extension instead of GIF.

Mario ●

That is just what Faisne is saying... the gif are turned into png files once the prototype is simulated

stphn ●

Since this ticket was opened years ago I'm guessing it's been since fixed. Using v7.4.0 I have no problem displaying animated gifs imported into my project.

You can see it running here: https://dl.dropboxusercontent.com/u/628429/justinmind/animatedgif/index.html

Files:

SKZDEMOUSER ●

I've got the latest version of the Pro app and I'm not able to put this animated GIF into my prototype:

https://www.siriusxm.com/sxm/img/global/loading-bar.gif

How did you get yours to work?

stphn ●

All I'm doing is saving the file locally, dragging it from my local computer to the Prototyper app and dropping it on the screen where I'd like to see it.

I've attached a screenshot showing the preview and source code so you can see it's still a GIF file. Here's a public URL where you can see it in action as well as view the source to see it's still a GIF file and I've attached the prototype file for you to look into.

https://dl.dropboxusercontent.com/u/628429/justinmind/loadingbargif/index.html#/screens/d12245cc-1680-458d-89dd-4f0d7fb22724

HTH.

Files:

SKZDEMOUSER ●

Thanks @stpnh - So, looks like I may have found a bug (and why it wasn't working for me). Try cropping that gif, and running the proto. The animation stops. Evening undoing the crop doesn't fix it, you have to re-import the gif. Can you replicate?

stphn ●

Hi @SKZDEMOUSER, yes, I was able to replicate breaking the images animation by using the crop functionality as well as the flip functionality. I also tried to resize the image but that had no negative effect.

I've attempted to use several online image editing programs that allow you to alter your images and all of them also broke the animation except for services that explicitly stated they handled animated GIF files (e.g. http://ezgif.com/crop)

I'm not sure if Just in Mind would consider this a bug or a feature whose functionality is not apart of the tool. Seeing how they offer image altering functionality, I would expect that it didn't alter images in such a way that broke them.

Because this ticket is marked as answered it might be worth opening another ticket asking for these image editing features on animated gifs be investigated.