How to make smooth animations in Scratch, post image

How to make smooth animations in Scratch

TutorialsTutorials/Polishing and Small Touches
smoothanimationtransitionmovementuiuser interface
May 6, 2020


In Scratch, the most common way to grow a sprite is using change size.

change size by ()

And the most common way to move a sprite is using glide.

glide () secs to x:() y:()

Using these methods for animations like clicking a button or showing a logo is not really good.
Here, i use another method, that I call “smooth animation”.
In short, a “smooth animation” is when the sprite’s movement speed varies in the animation, which is better than one of the “animating” methods showed before. Here we’ll see how to make a smooth animation for changing the size of a sprite.

Explaining by an example : changing size

First, let’s set the beginning size.
Then, we open a loop where, at each iteration, we make our sprite grow by the size you want to get minus your current size, divided by your speed.

repeat (100)
change size by (((endSize) - (size)) * (speed)) 

Important :

  • The lower is the speed, the more you have to repeat the loop.
  • The speed should be a number between 0 and 1.

Why do we do this ?
Doing the current size minus the wanted size will do the difference between these two. Knowing that difference, we multiply it by a non integer number, so we divide it, to split the difference in mutliple parts, who get smaller as the animation moves on; that’s what makes the “smooth” effect.

Here is an example :

set size to (50)%
repeat (100)
change size by (((200) - (size)) * (0.3)) 

Do what you want !

You can now change that code to use it for something else, like the position.

go to x: (beginX) y: (beginY)
repeat (100)
change x by (((endX) - (x position)) * (speed)) 
change Y by (((endY) - (y position)) * (speed)) 

Now have fun with that !
Thank you for reading this article :3

Article written by delnyn.

Creative Commons License
How to make smooth animations in Scratch by delnyn is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.