Skip to main content
Participant
December 28, 2008
Question

Vibrating Tweens

  • December 28, 2008
  • 4 replies
  • 1144 views
I realise that in many of my tweenings, the images or text inside the tweened movieclip often "vibrate" or look shaky when its movement slows down from an easing tween.

I have uploaded a sample of what I am referring. Please click here for the sample.

What I have is a frame that loads the crown image externally. In my code, I set the smoothing = true like setting 'Allow Smoothing' to the image in the IDE and set the cacheAsBitmap = true.

If you look at the sample carefully, at the start and end of the animation, the jerking or "vibration" of the crown image(loaded externally into a bitmap) is most noticeble when the movement is slow. Even the static text below the image has this problem! While this jerking may be minimal, it doesn't make the tween as graceful as it should be and clients often notice this and don't like it. I am using the Tweener class with easeInOutExpo for this one. The tweening duration is in seconds and therefore the fps shouldn't be the cause.

When I set the allow smoothing for the bitmap image, it does work if I am dragging the image from the library to the stage but my scenario now is that the pictures are loading externally. I have tried something in the code like for every loaded image, I will have bitmapImage.smoothing = true; but it still doesn't work.

I have also uploaded the sample FLA file here. And I have also attached the code to this post.

Thanks.
This topic has been closed for replies.

4 replies

Inspiring
December 28, 2008
The jitter on the image and the text can be improved slightly by setting picture_mc.cacheAsBitmap = true so that your whole movie clip animates as a single bitmap unit, and not the individual items that make up the movie clip. The image you're loading is already a bitmap, so I don't see how setting its cacheAsBitmap property to true does anything.

I'd also suggest playing around with different easing functions. Try a quad, or quartenion, or any of the other easing functions that may give you a smoother start and finish.

And see if using a different tweening engine, like TweenLite/TweenMax, can help fix your problem.

TS
Inspiring
December 28, 2008
quote:

The tweening duration is in seconds and therefore the fps shouldn't be the cause.


Sorry to disappoint you but frame rate is always at play in Flash. Even when you use time. Think about frames not as physical entities but as screen refresh rate. Say you have 10 fls rate and your tween is set to move a thing 1000 pixels in 1 second. What one will actually see is 10 movements 100 pixels each (screen is refreshed hopefully 10 time only) - pretty jerky.

You have two options I think. Try to increase frame rate either in IDE or at runtime (Dave's suggestion of 30 fps is good because the brain stops discriminating increments after around 21 fps) or you need to refresh screen manually. The trick with the second approach is that manual refresh can be accomplished only after a limited number of events. One of the events that allows you to do that is Timer event.
clbeech
Inspiring
December 28, 2008
I'm also wondering if using 'even' values may help rather than values that include 'part' of a pixel - ie. 475.9, 27.5, 30.2
Inspiring
December 28, 2008
How are you animating? Things to do include higher frame rate - 30 is a good
starting spot. Also, using a good tweening engine like Tweener can help.

--
Dave -
www.offroadfire.com
Head Developer
http://www.blurredistinction.com
Adobe Community Expert
http://www.adobe.com/communities/experts/