Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It's 100% free, no registration required.

I've been experimenting with a technique called cinemagraphs. This technique makes animated GIFs where only a small portion of the scene is animated. Here's a quick one that I just made:

enter image description here

So far, Photoshop does a good job with compressing the static parts of the scene. By masking only the moving part, you can save several megabytes.

enter image description here

What Photoshop is not optimizing well is the duplicated frames. To get a seamless loop, I duplicate all frames and reverse them. In the example above, the newscaster turns to the left and needs to turn back to her original position. This always doubles the size of the GIF. How do I tell Photoshop to optimize the duplicated frames just like it optimizes the static areas? In Timeline panel's menu, I've already used the "Optimize Animations" option but that didn't do anything...

share|improve this question
    
It might be possible get rid of the duplicate frames and then use CSS3 or JavaScript to have the animation play forwards and then backwards. Although that would only be useful if you were putting it on a website and could control the code. –  Mr E. Upvoter Oct 9 '13 at 11:19
    
I don't believe Photoshop has any mechanism to see "duplicate frames". It merely sees similar pixels between frames. And even then, I believe only the previous and next frame. –  Scott Oct 9 '13 at 12:29
    
@Dominic I won't have control over the CSS / JS. I'll be posting these gifs to other sites. Scott: Do you know how PS partitions the static parts from the dynamic parts? Is it a bounding box (circle, triangle, etc...)? How many dynamic areas are allowed? Etc... –  JoJo Oct 9 '13 at 15:55

1 Answer 1

If I understand your question, you've got an animation with (lets say) 5 frames. Frames 1 & 5, 2 & 4 are identical. So you'd like Photoshop to play the gif like so: 1,2,3,2,1.

Unfortunately that's impossible with an animated gif. Gifs are built to allow the data to stream, displaying the next frame in sequence as the data is loaded. The first frame is considered global and its data can be used in every subsequent frame. So the first frame sets the base, then "Optimize Animation" turns identical pixels transparent in frames beyond the first. So there's no way to replay a previous frame, they must run through even if a frame is identical to the current. Wikipedia explains it in more detail than I do.

Long ago, I did something similar (take a look at the menu) to what you're looking for via javascript and numbered sequences of jpgs. The script plays images 1-10 on mouseover, then 10-1 on mouseout.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.