Object effect · Moves

Spin

Turn the target a full turn (or more) about its own axis, landing where it started

  • motion
  • product
  • interactive
  • minimal

Settings and defaults

Axis
Up (Y)
Turns
1
Reverse
Off
Duration
1.2 s

Spin turns an object a full turn, or several, about one of its own axes and lands exactly where it started. It is a single move: the object does not travel or change size, it just shows itself all the way round and comes back to face the same way.

How it works

The turn eases in and out, starting slow, speeding up through the middle and slowing to a clean stop, so it never snaps. The number of turns is always whole, which is why it always ends facing the viewer as before. It turns about the object's own origin, and it is laid over whatever else the object is doing, so a spinning object can also be floating or moving along an animation. Triggering it again starts another spin.

Settings

  • Axis: up, for a turntable spin; side, for a forward roll; or front, for a cartwheel.
  • Turns: how many full turns it makes.
  • Reverse: spins the other way.
  • Duration: how long the spin takes.

Use it for

Product showcases where a click shows the whole item, logos, coins and badges, and quick feedback on hover. Use it on click or hover, as part of an action or animation, or on the object itself; with the playback set to Reverse or Yoyo it spins back the other way in time. For a turn that keeps going, use Rotate; for a jump with a flip, Flip.

More object effects

Works well with