Problems with gif overlays

1

Hi

I create a lot of product tours and simulations using Flash and one thing that has always bugged me is the problems I get when overlaying GIF files.

Imagine I have a screen shot of a web page. When my users view my movie I want it to react like the real thing, with rollover buttons etc.

To get the effect I am looking for I use a full screen image of the whole page and then a second image of the rollover effect. Then, when my users move over the button, the second GIF is displayed.

This all works fine, except for one thing. Flash has a nasty habit of shifting either or both of the GIF files. The result is that the user experience isn’t as crisp as I would like it. It seems that Flash is almost stretching the GIFs for some unknown reason.

All the GIFs are set not to be smoothed, so that can’t be it, but somthing is doing it and it’s driven me nuts for years now.

To see what I mean, take a look at one of my most recent creations at http://www.harlequinsolutions.com/regentinns/ri001/mod3/mod3_req.htm

Work through the first two clicks and then notice that when you rollover “Items” the gif stretches right a little. Then, after you check the second checkbox a little later on, the whole screen stretches up a little. Arrgh!! Maybe you will get different results, but certainly I have checked this on numerous PCs over the years all at different resolutions and it always goes wrong somewhere. It doesn’t matter what I do, it has done it since I started working on this stuff way back in the days of Flash 3. Believe me, in Flash it looks fine, but as soon as it is published it goes wrong - even at 100% quality.

So, in a desparate plea for my sanity, I turn to you all in the hope that:

[list=a]
[]I am not alone, there are others out there being bewildered by this “feature” of Flash
[]Someone out there has the answer and knows how to stop this happening
[*]Macromedia is listening and fixes it!
[/list=a]

Any help would be good.

Thanks

John :-\

2

yeah I had the same problem a couple of days ago… but it wasn’t with gif files… I kinda drew a similar button to that in flash and it reacted the same way… I wish I knew the solution… :-\

3

Has anyone else had these problems. Tell me I’m not alone out there. Or maybe it’s just me!!

Cheers

JOhn :slight_smile:

4

Nope, you are not alone. I wish I could give a solution, but if I can’t help myself with this problem, there is no way I could help others :frowning:

5

Are you checking the coordinates of the graphic that you inserted into flash…

It cannot be on a .938 or any non even number…
Keep in mind that it uses the coordinates based off the pixels of the origional graphic inserted…

thats why you should never use and decimals when positioning a graphic within flash.

not even a .5

Does this make sence…
I’ll better explain if I dont make enough sence here.

[email protected]

6

It makes sense, but that isn’t the problem. It is just something Flash does with imported Images. I know it existed in Flash 5, and it exists in Flash MX.

I don’t know why though.

7

I don’t know about MX, but you can try this.

In Flash 5.0, when you select a imported image that is in your library, and hit the ‘i’ button at the bottem of the library panel, it comes up with a properties dialogue for that image. Try turning off the ‘smooth image’ setting.

I know that this has helped me with that problem SOMETIMES. why sometimes and not all the time I couldn’t tell you.

I will also say that you are not alone. I’ve seen this problem writen up in a couple of books as a problem with how Flash handles things… and is possibly an internal, unsurmountable issue.

Another option might be to use action script to alter the images scale and location so that it fits more closely to the original image. That would have to be done trial and error though.

8

That doesn’t always help. I also try unchecked the Use Imported JPEG data box and putting the quality up all the way so it will be at its highest quality possible, and I still get this problem.

It is just a “glitch” I guess you could call it. It obviously isn’t fixable otherwise I am sure they would have fixed it already.

9

sorry… I didn’t see that you had already mentioned the use of the smoothing option to try to fix it…

I guess I’ve got no clue then.

hmmm

Well at least you know you’re not alone :slight_smile:

10

Hi

Well, it’s not just me then, when I started this thread I was hoping that someone somewhere would have the answer, but it seems that this sits within the hands of Macromedia.

Certainly I have found that the following are always useful when placing GIFs:

[list]
[]Always place them at a co-ordinate which is a whole number, i.e. 403, 287 not 403.45, 287.23
[]Always turn off smoothing
[]Add the image as a graphic symbol and not just the GIF (I don’t know why this should make any difference, but it seems to give better results)
[]If you are using screen shots of buttons etc, always cut them out a little biggerso that you have a border of atleast 2 pixels around the button, so that if distortion happens, it doesn’t immediately trash the button
[/list]

Now, if anyone can add to this list, I would be delighted. And if Macromedia ever read this posting, I would be even happier if you could fix the problem in the first place.

Cheers to you all

John :slight_smile:

11

Have no fear,
coz Joe is here! lol

***here’s your fix, taken from www.wireframe.com

Pesky Bitmap Imagery Got You Down?

Don’t sweat it, we have the cure.

By following a couple simple steps when authoring in Flash you can avoid the ripple effect that is sometimes caused when you pass a vector element over a bitmap image.

–> 1: Import Your Image
Select your raster image that you will be using in your piece.

–> 2: Place The Image On The Stage
Place the image on the stage where you intend to have it

–> 3: Make The Image A Symbol
This is an important step. When you make the image a symbol Flash handles its rendering properties slightly different and this will also give us access to more property controls.

(continued due to size restrictions)

12

–> 4: Select The Image and Edit In Place
Once you are inside the symbol edit area, break the image apart.

–> 5: Stretch It
Here is the big trick. If you stretch the image, even by sub digit level increments it will solve all your worries. You can do this by zooming all the way in and doing a transform, or you can use the info properties box to set the new dimensions. Usually we just scale the x coordinate by .5.

13

That’s it. Simple, huh? We have found this out after so many different experiments and projects over the years of working with Flash. This is the most reliable solution we have found, although there are others that you can try.

–> Make your bitmap or raster element a symbol: “graphic” and set the instance: “alpha” to 99% (or any effect to 99%). If that works your golden - otherwise follow the steps above and that will get it done.

–> Place your bitmap or raster element inside a movie clip, add a layer above it and place a transparent vector element across the entire width and height of the image. If that works your golden - otherwise follow the steps above and that will get it done.

Every program has it’s quirks and every designer has to use their smarts to overcome them.

Solves the problem?

:slight_smile: :slight_smile: