Animated GIF issues in HTML5 output

I'm running into a few animated GIF issues with HTML5 output (testing in Chrome/Firefox).

1. I have an animated GIF that is 41Kb and 538 by 379. When I put it in as-is in Storyline and publish, the HTML5 version does not show me the animated GIF, instead showing me a blank image box. I've done some testing and if I scale the GIF down to maybe 50% height/width in Storyline and republish, then it works. Of note is that my quality settings are at 100% for images. If I leave the GIF at 100% and change the quality setting to 99%, the HTML5 version does show the GIF. Is there a reason animated GIFs are not working correctly with the highest possible output quality setting?

2. I've tried putting in animated GIFs that are not repeating. They work fine in the Flash output, but in HTML5, the animation repeats indefinitely. When I view the GIF in a browser, it only plays once as it should. Is there anything that can be done about this?

3. This is minor, but animated GIFs are slightly distorting colors and putting a couple pixels of magenta at the bottom right of the GIF after being published in Storyline. This doesn't seem to happen with every GIF but ones that have a bit more complexity to them. Any way around this?



41 Replies
Crystal Horn

Hi Ken.  Are you being affected by the issue with GIFs showing a purple outline?  We do have this on our radar, but no ETA on a fix yet.

I wanted to note a distinction we found:

One difference I noticed in testing was that gifs with a "transparent" background, like a .png image, produced a purple line around the image but not "bounding box." Another gif I used did not.

Do you know those format details of the .GIF you're using?

W Gill

I too am having issues with this.  

I have actually reduced the size of the .png  in Photoshop when creating/exporting to Legacy of the .gif and I get the magenta pixel in the bottom corner.  

Also, the .gif causes a very noticeable "hiccup" or lag in the course when being viewed.

Lastly, this problem has been around for YEARS!!  It isn't new.  If it existed in SL2 and quite obviously is in SL3 and SL360 (what I'm using), then why isn't it being addressed more seriously?

Com'on Articulate, you've got to be better than that.  Too many people/companies are trusting you with their livelihood.

W Gill

Oh for sure!  After 3 plus years of not working, it is now filed under lip service. 

I did another test today.  I created the transparent gif and sized it to what I needed in Photoshop.  Imported in 360, and there it is...the purple dot.

I hope Articulte knows that Flash is going away and people can't use it soon.  In my organization, we have rolled out Chrome where it doesn't use Flash. 

All in all, this is just a joke.  They've known about this issue for years and you're right. It's not important to them. 

Its just frustrating, because my gif is used in a game that I created and it looks like garbage. I'll be placing the blame on Articulate for this. 


Conor Hutchinson

Bumping this too.

Storyline360 seems to have many issues with GIFS (visual glitches, odd playback, massive files when published). For software as expensive as 360 is these issues should either not occur or should at the very least be fixed quickly.

It is especially annoying as the E-Learning Heroes frequently feature articles about using animated gifs with no indication of any of the issues that developers are likely to encounter when they try to get gifs to work in their courses.

It is understandable that many developers look to gifs to bring animation to their work as Flash is no longer a viable option and Storyline's in-built animation is limited. However given all the issues that many developers have been reporting for months/years I don't think Storyline can justifiably claim to truly support the use of gifs.

It would be really helpful to have some clarity on this. Clarity about what is being done to address these longstanding issues. Clarity about any reliable guidance that can be given about using gifs at the moment (clear best practice, what works, what doesn't, any reliable work arounds) . 

Developers should not have to go trawling through the forum to pick up the odd anecdotal tip here and there.

I hope the sense of frustration that I and other developers have about this subject matter has registered with Articulate.

Either sort it out or be clear that you do not support the use of gifs.



So true Conor!

Articulate, this issue with the small box of 1 by 2 pixels in the bottom right of the GIF that's magenta colored was first brought to your attention over four years ago. Management should remove the option to import GIFs from Storyline 3/360 as this doesn't work or FIX THE ISSUE and not keep saying it's on your list. 

Conor Hutchinson

I'm with you 100% Daniel. It seems ridiculous at this stage not to have this resolved.

I have a lot sympathy with support staff on this forum as they have to handle correspondence about such issues with little or no clarity about what they can advise.

It is up to the management to be clear about what is happening re: this issue and the other issues related to the use of gifs (quality and flie size when published in SL). Is it being addressed? What is the timeframe for resolution?

Until it is resolved properly I think the frequent marketing that features the use of gifs is essentially false advertising.

Ashley Terwilliger

Hi all, 

Sorry for the recent silence - our team was putting the finishing touches on the fix for animated GIFs that had purple lines in the published output to include it in Update 26 of Storyline 360 available today. Follow the steps here to update your Storyline 360 app! 

The purple dot that may appear in the bottom corner is still being investigating, but please know we'll share any updated info here once we can!