help ukraine

We stand with Ukraine! If you're as appalled by Russia's abhorrent attack as we are, please support Ukraine and its people.

Create animated GIFs from 360 spins

On this page

Sirv can serve your spins as GIFs. Simply append ?image to your .spin file and you'll see a GIF. Customize the speed, direction, pause, jump to certain frames and zoom in to create an animated GIF.

Try the demo below or scroll down this page for more animated GIF examples.

Parameters

Customize your GIF with the following parameters:

Parameter Default Options Description
image.rules G, L, R, Z Go to frame, rotate Left, rotate Right, Zoom
image.speed 3000 numeric (ms) Time in milliseconds for one full rotation
image.pause 0 numeric (ms) Pause animation after last frame
image.frames 72 numeric Number of frames in the GIF (from 2-128)

Image rules

You can set as many image.rules as you wish. Each rule is executed in the order of the URL. The options are:

  • G = Go to certain number of degrees
  • L = Rotate left by a number of degrees
  • R = Rotate right by a number of degrees
  • Z = Zoom in (%)

Speed

Set the speed of the animated GIF using image.speed parameter.

https://demo.sirv.com/spins/high-heel/high-heel.spin?w=250&image.speed=1500&image.rules=R270Z100L120Z0L190&image.pause=1000&image.frames=72

1500ms

3500ms

5000ms

Number of frames

Your animated image will contain from 2-128 frames, depending on the number of frames in your original spin. The default is 72 frames.

If your spin has more than 72 images, then an appropriate number will be used for a smooth spin. For example, a spin with 100 frames will be converted to 50 frames (i.e. every second frame shown). If you'd like to show all 100 frames, set image to 100:

https://demo.sirv.com/spins/dg/dg.spin?image=100

You can reduce the number of frames by setting image to a lower value e.g. this sets a limit of 36 frames:

https://demo.sirv.com/spins/dg/dg.spin?image=36

Optimal format

For fast loading, Sirv serves GIFs in the most optimal format, which is usually WebP. This next-gen image format supports animation and transparency like GIF, but optimized to a much smaller file size. If a browser does not support WebP, then a GIF is served.

If you specifically require GIF format, you can apply the format=gif parameter. You can also apply the gif.lossy parameter to compress your GIF and make it smaller:

https://demo.sirv.com/PinkBoot/PinkBoot.spin?image&format=gif&gif.lossy=50

Examples

The following GIF rotates by 60 degrees right (R60), goes to 240 degrees (G240), then zooms by 100% (Z100) while rotating left by 80 degrees (L80):

GIF (or WebP) converted from spin

https://demo.sirv.com/spins/dg/dg.spin?h=300&image.rules=R60G240Z100L80

Photography: Martini Studios

The following GIF jumps to 180 degrees (G180), zooms to 100% (Z100) while rotating left by 120 degrees (L120), zooms out to 0% (Z0) while rotating right by 180 degrees (R180), then rotates right by 200 degrees (R200):

Example GIF generated from spin

https://demo.sirv.com/PinkBoot/PinkBoot.spin?h=300&image.speed=6000&image.pause=2000&image.rules=G180Z100L120Z0R180R200

The following GIF jumps to 220 degrees (G220), rotates 220 degrees right (R220), then zooms to 70% (Z70) while rotating 80 degrees left (L80):

Example GIF generated from spin

https://demo.sirv.com/spins/bbq/bbq.spin?w=500&image.rules=G220R220Z70L80&image.speed=5000&image.pause=2000&image.frames=100

The following GIF rotates 180 degrees left (L180), then 180 degrees right (R180):

Example GIF generated from spin

https://demo.sirv.com/spins/Magnos/Magnos.spin?h=300&image.rules=L180R180

Was this article helpful?

Get help from a Sirv expert