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 72 numeric Number of frames in the GIF (from 2-144)
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 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

Use the image.speed parameter to set the time in ms for the spin to complete one full rotation. This will set 1500ms:

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

Same rules, different speeds:

1500ms

3500ms

5000ms

Number of frames

Your animated image will contain from 2 to 144 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 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 change the lossy compression value (default is 5):

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

Examples

This 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

This 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

This 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=100

This 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

The simplest GIF can simply rotate:

Example GIF generated from spin

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

Was this article helpful?

Get help from a Sirv expert

help ukraine help ukraine Powered by Ukrainian determination and British ingenuity

How can you support Ukraine