# Step Transition

Hi… Anyone know how to do the math to make a step animation?
(imagine the behavior of a ticking clock. the needle is rotating in steps, not in linear way like a fan.)

For example:

1. Rotation 360 degree with 5 degree jump interval.
I know we can use floor, ceiling and round to skip the decimal, so it becomes every 1 step. how to make it every 5 step?

2. moving in x axis with 5 interval
so if we look at the graph, it’s not straight diagonal line, but more like a stairs.

3. lets say gradient, black to white from smooth transition, into separate bands with solid color shades. maybe divided into 5 for example. so the interval is every 20%.

I’d prefer a math patch method, not script.

can someone help me please? thank you

You could use a Loop Animation patch in conjunction with a counter, using the “looped” output from the Loop Animation. And some logic after that.

yeah i know about the counter, but that’s not what i"m looking for. I’m loooking for the math to solve it so i hopefuly be able to also implement it in an image processing, not only in an animation. the math to create stairs graph in spark is what I’m looking for. thanks tho!

The way I did it for the noodles effect was to multiply the value by a number, round it, then divide by the same number. That will give you some nice looking steps.

e.g. `round(x*20)/20`

2 Likes

Oh god. It works! This is it! Thanks Josh!

wait, we could use “round”, “floor”, “ceiling” to process shader generic signal???

Yeah I suppose you could! FWIW round is step(.5), floor is step(0), and ceiling is step(1)

Edit: at least in the 0-1 range