: Creating a App Demo GIF for Use on a Website I am trying to create a 8 second long GIF showing 3 different pages of an app I have built. I am using Relector 2 to record, and then using

@Twilah924

If you don’t need to use gestures, you can use the iOS simulator to present the app, and something like Screenflick to record it. Screenflick can also remove the mouse cursor from the recording, or optionally show where clicks and taps were (other screen recording apps can also be used, including QuickTime). This means you don’t need a physical iOS device or Reflector to record the app. You will need the source code, so you can run the app in the iOS Simulator though.

If you’re showing off anything remotely complex, it might be worth considering using a video file on the website, rather than a GIF. Video files typically end up smaller and better quality for longer and larger content.

If you really want a GIF, I find Photoshop to be the best way to optimise, usually using these techniques and steps.


File → Import → Video Frames to Layers.
If the recorded video file is 60fps or 30fps, you can tell Photoshop to only use every nth frame when importing. You can also trim the top and tail of the video when importing.
Deleting frames that are identical, and setting a frame delay instead can help reduce the number of frames in the GIF.
When saving, use File → Export → Save For Web (Legacy) and experiment with the number of colours used. If the app has large areas of the same colour, you might be able to get away with 128, 64 or even 32 colours.

Vote Up Vote Down

@Hamm6457569

You can try to compress the GIF using ImageMagick, gifsicle or ezgif.com/optimize
If it's a GIF showing an app, there probably are large areas of the gif which are not changing in every frame, so first thing you could try is "Optimize transparency" option with 3% or 5% fuzz factor. It works wonders for some images, but the results very much depend on the particular image. After that you can try Lossy compression on the resulting image.

If you can provide a link to the video, I can try to figure out the best method.

Vote Up Vote Down

@Sent7350415

If your .gif is too large then you will need to either lower the FPS or the resolution. Since 700x300 is pretty small you should check that the FPS is pretty low (dependent on your animation 15-20 fps should be fine).

You could use a .mp4 with H.264 encoding instead of .gif to get better quality and maybe even a smaller file size.

Vote Up Vote Down