Forum Discussion
Animated GIF--Loop Just Once?
I created an animated GIF in Adobe Fireworks. It's a gauge with a needle that moves from the 6 o'clock position to the 12 o'clock position, using 16 frames ('states' in Fireworks parlance). I set the animation to run just ONCE; the needle rotates from 6 o'clock and stops at 12 o'clock. I tested the animated GIF in my Web browser and it works as expected.
When I insert the animated GIF onto a Storyline slide, however, the animation loops forever. It loops in Preview mode and also when I publish to Web (HTML) output.
Does Storyline recognize and respect the 'looping' setting contained within an animated GIF file?
Hi, everyone!
I have some great news to share. We just released an update for Storyline 360. In Build 3.90.32850.0, we’ve included important fixes and new features. One of the bugs we’ve fixed is:
- GIFs didn't replay on revisited slides that were configured to reset to their initial states
Launch the Articulate 360 desktop app on your computer to take advantage of this update, and click the Update button next to Storyline 360. You’ll find our step-by-step instructions here!
- JustinWilcoxCommunity Member
Hello. I wanted to offer some insight into this and our bug process. We do look at all bugs and we do prioritize all bugs according to their severity, the impact on our overall community and the complexity of addressing a bug. Unfortunately not every bug is going to make it into a point release. You can see the issues we have addressed in Storyline 2 here and in Storyline 1 here. I have reviewed this particular issue and we have had six cases regarding this bug over the course of 4 years or over 50,000 cases. We have had one feature request for Storyline 1 and one feature request for Storyline 2. While we don't always use the number of cases or feature requests to determine if a bug is going to be addressed, in this particular instance, this did not rise to the level of severity that warranted pushing it into a stage to be fixed. Using an MP4 is a valid workaround. I understand that alpha channels are an issue with MP4 there but the impact of this bug on the community as a whole, is minimal. That being said, I did consult with the QA Lead on Storyline today to see if there is something we can do about this particular issue, though I can tell you that there are no plans to address this in the current or previous version of Articulate Storyline for the reasons I outlined.
- DominiqueDelcomCommunity Member
I appreciate the time you take to state Articulate position about this issue three years after it has been reported. Thanks for the insight into your way of working. Having been QA manager in the software industry for many years, I find it fascinating.
Keeping your customers in the dark is really not a good practice. Your colleagues just pasted a couple of time their "out of the box" answer : ”Our QA bla, bla, blah" . We never know if a feature request or bug will be addressed anytime.
On top of that SL does not only break animated GIF looping mechanism but your so called "picture optimization process" ruins scaled animated GIF quality which makes them unusable. I reported the issue and provide SL files to demonstrate. Doing the same in other well-known products works really well. I was suggested to create my GIFs at different sizes! Seriously ????
Not being able to properly handle animated GIF is just ridiculous and I cannot believe that just 4 our 5 people are affected.
- ChristineHendriFormer Staff
Hi Bob. Welcome to E-Learning Heroes!
I'm not an Adobe expert, but I would think you would be able to edit the "looping" option for the gif image in the original software (Fireworks). Articulate wouldn't control looping of the image, to my knowledge.
I played around with this a little bit and came up with a workaround for you, hopefully it'll help.
If you'd like to see the example I created, you can see the published version here. I've also attached the file to this thread, if you'd like to see how I created this. Please keep in mind it's a very simple example, nothing fancy
I took a screenshot of the image in the position that I considered "finished" and put it behind the animated gif at the end of the time specified for the image. So, you could use the same technique and put in an image of the needle at the 12 o'clock mark.
I know this probably isn't the only way to do this and may not even be the best method, but hopefully it will help until you're able to find a better work around.
Good luck with the project!
Christine
- BobWikerCommunity Member
One "trick" that might help is to set the duration of the final frame in the animated GIF to a large number. That way, it is easier to set the duration of the animated GIF in the Storyline timeline to stop/end exactly where and when you want.
Animated GIF frame durations are set in 1/100ths of a second increments. So, you might set it up like this in your animated GIF authoring tool (such as Adobe Fireworks):
frame 1----15/100ths
frame 2----15/100ths
etc.
frame 27----15/100ths
frame 28----500/100ths
In this example, each frame of the animated GIF displays for 15/100ths of a second except for the final frame, which displays for 5 full seconds (500/100=5). Add your animated GIF to the Storyline timeline, then drag its bar to shorten it so that it ends anywhere within the final 5 seconds of the animation (i.e., the final frame of your animated GIF).
- JoseAGomesCommunity Member
Hi... I'm having the same problem you had 3 years ago... I'm doing the .gif with photoshop, the settings are not to loop but it still loops... but I think my problem comes directly from photoshop because it also loops outside storyline...
Hi Joseph,
This is something we've shared with our QA team, in regards to how Storyline 2 does not respect the frame rate of the original GIF file. I don't have any additional information or updates to share - but once I do I'll be able to post here as I've tagged this thread in connection with the report filed with our team.
- BobWikerCommunity Member
If you have an Apple Mac, there's a free and easy (this is an Apple product after all) way to convert animated GIFs or any other animation for that matter (i.e., Flash) into an MPEG4 video clip.
Step One: Launch QuickTime Player, which is part of Mac OS X on every Mac.
Step Two: Choose File > New Screen Recording; a new window appears along with instructions for doing full-screen or partial-screen recording.
Step Three: Drag a rectangle around the animated GIF, then click Start Recording.
Step Four: Click the Stop button in the upper right side of the menu bar when you're done.
Step Five: Save the file. After saving it, you can change the file extension from .mov to .mp4 if you wish. (The file will work just fine; it's an MPEG4 video using the H.264 codec, and will work on Macs, PCs and iPhone/iPad devices.)
- BobWikerCommunity Member
Joseph, you may want to revisit the first couple of posts in this discussion because there is at least one workaround that resolves the issue while we're waiting for a fix, and it works really well. See this comment:
Others have had success with converting animated GIFs to MPEG4 videos using various tools, so there’s a second possibility. We’d all love for this bug to be fixed, me included. But realizing that no software is ever perfect, workarounds are a de facto part of the elearning author's life. Best wishes.
- DominiqueDelcomCommunity Member
You are right and it is just unacceptable! Unfortunately is is not the only annoying bug hanging around for years!!!
Although I like SL for a lot of stuff I do not understand how users do not complain more about long lasting issues. I do not understand either how Articulate just don't care or even treats obvious bugs as feature requests.
Sooo sad!
- AlexMills-9078aCommunity Member
If anyone else finds this while googling for this issue, this tool worked for me to change the loop count of a gif.
- BobWikerCommunity Member
Thanks for taking a look at this. Yes, there is a mechanism in Fireworks for setting the number of loops in an animation. This screenshot shows the Fireworks States panel for my 18-state animation; the Looping drop down menu is set for 'No Looping'. With this setting, the animated GIF that I export from Fireworks will play all 18 'states' once and then stop at the last state.
It appears that Storyline is NOT recognizing the looping setting in the animated GIF file. My Web browser runs the animated GIF properly (one cycle of the animation) but Storyline Web output does not (endless cycles of the animation).
The workaround you mocked up does indeed yield the result I'm seeking, though it's a bit of struggle to set the timing just right so that the animation goes off-screen at exactly the right time--not too soon, not so late that it begins to loop again. This is the workaround I tried before asking the question here in the forum. Great minds think alike!
Might be helpful to find out for sure whether Storyline recognizes the looping setting in an animated GIF so that others will know (or as a feature request for the next Storyline update). Either way, I'll live with this workaround on my current project.
Thanks again for researching.
- ChristineHendriFormer Staff
Hi Bob!
I totally agree, I think it would be pretty useful. For now, you might want to submit that feature request you mentioned earlier. We love getting feedback and we take suggestions pretty seriously
Also, just wanted to say that I really like the look of the gauge you created. I bet it looks great in your project!
Thanks, Bob. I hope you have a great day!
Christine