| » Forum Index » Problems and solutions » Topic: Animated Gifs: why does the tonal quality deteriorate |
|
Posted on 26/01/07 11:59:58 AM |
|
michael sinclair
Off-Topic Opportunist Posts: 1871 Reply  |
Animated Gifs: why does the tonal quality deteriorate
My "Mount Rushmore" entries this week had to be in "stills" because the image quality degraded to such an extent that is was unviewable. I ran the animated sequence within Photoshop, and the quality was excellent, but when I "Saved for the Web" and clicked on the new Gif on my desktop, it was posterised and fragmented. I always use default "Save for the Web" settings, as they have never given me trouble in the past with my other animations; however, I did experiment with all the settings, and in virtually all cases came out even worse. Any ideas? Michael  |
Posted on 26/01/07 9:45:46 PM |
|
maiden
Golden Gif Gagster Posts: 471 Reply  |
Re: Animated Gifs: why does the tonal quality deteriorate
Optimising a GIF is a skill all of it own there are several ways to reduce the image size without losing too much detail. The main thing that causes large filesize in a GIF is too much movement within the animated area for example an animated ball bouncing within the frame boundaries would be smaller in filesize than if you had two or three balls bouncing or the background moves at the same time. Other factors are the number of colours and whether your animation is dithered or not. If your animation is purely an expanding bubble set against a single layer of the backdrop of Mount Rushmore then the filesize will be mostly dependent upon the total number of frames, the amount of colours you're using and whether you have chosen to set the animation to Transparency with a Dither. If your animation, however, is the bubble expanding but each stage of the expansion is merged seperately with the Mount Rushmore picture then you throw in another factor to the optimisation equation which often causes extreme filesizes - which is variance of lossy dither within each seperate frame of animation. As the Mount Rushmore pic is probably a JPEG then if you have merged each layer with the Rushmore image then you will get an effect where pixels will appear to shimmer or flash as one lossy jpeg frame is overlaid with a slightly different lossy jpeg frame. This shimmer adds to the total filesize as GIF work by banding blocks of colour in lines, Horizonally Left-to-Right. Where those blocks of colour are the same across the animation the GIF can save on filesize but where there is variation then the GIF will have to work harder to store more pixel information. That is not to say that's what you have done Michael, but it is something we have to look at when working out how to save on filesize. GIF works best on blocks of colours so the background has to be as simple as it can be and as static as can be so therefore each frame of the bubble expanding has to be on a seperate Photoshop Layer with a transparent background so that when the animation is complete the Mount Rushmore layer is merged with each frame as a static single background and the only movement the GIF has to take into account is that of the bubble. Mostly I have found 32 to 64 colours are acceptable as a palette as long as Transparency is checked with a Transparency Dither of "Diffusion Transparency Dither" with the 'Color Reduction Algorithm' box set to either 'Selective' or 'Perceptual' - Adding Lossy with the 'Lossy' box of no more than 20% (less if you can get away with it). If your animation can stand a bit of 'colour banding' use the 'Dither' box to reduce the dither to less than 100% (although 100% is perferable). Finally shed some pounds off your image by reducing it's physical size by clicking on the Image Size folder and try bringing the width down to perhaps 500-400 pixels width or more if it doesn't look too tiny. You find that you can maintain image quality by simply balancing out these settings i.e. less colour against less lossy, or more colour against smaller image area. Losing a few image frames could also help in extreme circumstances but do so evenly such as removing every 2nd or 3rd frame. For a further guide a friend of mine from b3ta did an excellent rough guide to gif optimision. http://www.lemony.co.uk/Optimisation/animations.htm Here's what I acheived by isolating only the moving parts of each layer and deleteing all the non moving pixels with the background image of Mount Rushmore selected to fill in the missing image. 
|
Posted on 27/01/07 12:34:53 PM |
|
michael sinclair
Off-Topic Opportunist Posts: 1871 Reply |
Re: Animated Gifs: why does the tonal quality deteriorate
Wow! thanks very much Maiden, and you've done a great job on Rushmore. I followed what you said and also the link and found them both most helpful. The one thing I don't really understand is the "File size": my present rationale is one of "the bigger, the better"; instead we have a situation to that of putting a whole coach-load of passengers into a Mini car and seeing the severe degradation of performance. This I don't understand! Again thanks for your help. Michael  |
Posted on 27/01/07 4:04:08 PM |
|
maiden
Golden Gif Gagster Posts: 471 Reply |
Re: Animated Gifs: why does the tonal quality deteriorate
Unfortunately the GIF format was never really designed for long, high quality animation but more a solution for delivering low-file sized animations for website design where the page loading time is more critical than fancy artwork. Macromedia's Flash and Adobe's After Effects were a step towards creating more in depth animation that can be streamed on higher-end designed websites and with Broadband such websites are accessible to nearly everybody. Your analogy of fitting a whole coach-load of passengers into a mini-car is precisely correct when applied to current GIF animator Gurus who try to create more and more stunning animation by using every trick in their graphic artists book. One such trick is using 'persistance of vision' that you can minimise the number of frames because the human brain has the ability to fill in for the missing frames of action - an example of this persistance of vision can be seen when we make our first flick book with a stickman character, with just a minimum of frames we can trick the eye into seeing movement which isn't really there. This is precisely how TV and Motion Pictures works only the animation is smoother because they insert far more frames per second than with our flick book. I wish I was a GIF guru however I'm not even in the running compared to some, although I'm always trying to push the boundaries of the quality/filesize equation. |
Posted on 27/01/07 4:24:33 PM |
|
Pierre
Constructional Confabulator Posts: 637 Reply  |
Re: Animated Gifs: why does the tonal quality deteriorate
Mini? Mini? Where?  _________________ |