Animated gifs

This is not an original tip – just recycling a good idea shared with us by @tsuji_koichi:

[Feature: Video Embedding](https://community.appsheet.com/t/feature-video-embedding/15436/17) Tips & Tricks ?

I know this is not perfectly fancy way to show gif file on Appsheet app, but there is a way to achieve this. Again, I know this is not ideal way for you as it takes several steps and process to follow to save gif file and show the same on the Appsheet app. Other community member may have far better way to achieve the same, but please see the quick short movie here. In a nutshell, i did like this. Create physical column to store text for Google Drive file IDs. Column name here …

I’ve been making gifs in the way I learned from Koichi to create little animations that illustrate of how to do things in my app. The gifs go into image columns. Here’s one I made today:

3X_5_d_5d92d7738719ca2f706f53bf1bd6db9e955306d7.gif

https://drive.google.com/uc?id=1IfEamThBWZR4gnaJTCuOViz8mmmKKgRd

5 Likes

I’ve been making more gifs to show users how to do things. I prefer to keep the file size small so as to keep loading times short. Recently, instead of striving for smooth animation, I’ve chosen to make gifs that show only on slide per second. This greatly reduces the number of images in the gif and, accordingly, the file size. This one is 76 KB.

3X_a_c_ac6597bf8ef00f871303f91e973c3109c3eadc1f.gif

https://drive.google.com/uc?id=1JGtoMGh36xHQCQ0S84TXGQ83tgwODvZ1

I’m a Mac user and I’ve found that Gif Brewery works well but I’m sure there are many good programs out there.

5 Likes

Hello Kirk,

Could you share the link to the service you used to generate such a nice gif to make sure we go to unintended services to test?

Stay safe from upcoming typhoon for now!

3 Likes

Sure. I’m not using a web-based service (other than Google Drive, which you recommended). But, on my Mac I record my I phone screen with QuickTime or I record my computer screen with ScreenFlow. Then, I edit the video in Final Cut Pro X. Finally, I use Gif Brewery to make the video into a gif. In the example above, the video I made in Final Cut Pro X was composed of 2 second still shots. Then I imported that to Gif Brewery which allows you to designate how many images you want per second and whether or not you want the speed of the video to be changed. I set it for one image per second and left the two-second speed unchanged. Gif Brewery also allowed me reduce the size of the images to a width of 350 pixels.

I’m sure there are other ways to produce similar animated slide shows like this but the method I described above is what I did.

Come to think of it, since what I did was a slide show, I probably could have done something similar in PowerPoint or KeyNote and then exported that as a video. In fact, I think that would be easier. I’ll try that next time.

2 Likes

GIF Brewery also lets you take stills and turn them directly into gifs. That’s probably the best way to produce what I’ve done above.

1 Like

Thanks Kirk
I m juggling both Windows and MAC daily, so will test this new tools!

1 Like

I use https://www.screentogif.com/ for Windows to capture the screen and to edit the gif.

4 Likes

Thank you @Fabian
This looks useful tool. I added to my favourite.

2 Likes

Recently, @tsuji_koichi asked me how I make my gifs. His question made me realize that my method (Screenshots → Keynote → Final Cut Pro → GIF Brewery) was probably unnecessarily complicated. Today I used the following software on my Mac to make the gif you see below: Screenshots → Keynote → GIF Brewery (Final Cut eliminated from the sequence).

3X_f_d_fd9cedca09833ba7813a219ba607be8e6db90fd7.gif

For the screenshots, I used the Shift-Command-5 screenshot function because this allows me to determine the size and position of the screenshot and then make use those settings for every shot in the series. This makes the “movie” appear to be stable (no jumping up and down or getting smaller or bigger). In Keynote, I set each screenshot to fill the screen and then exported it as a movie with two seconds between each slide and the final slide duplicated to give me a pause at the end. Then, in GIF Brewery I imported the movie, set the width of the images to 350 pixels and the frames per second to one. The result is the gif you see above, which is only about 11 KB.

The gif works quite nicely in my phone. I’ve found, however, that gifs – even tiny ones like this – can take a while to display in my app when I used it inside a browser. I don’t understand why that happens.

2 Likes

Kirk_Masden:

I’ve found, however, that gifs – even tiny ones like this – can take a while to display in my app when I used it inside a browser.

Would it help if you enable “Store content for offline use”?
(under BEHAVIOR → OFFLINE/SYNC)

Thanks! I have “Store content for offline use” enabled.

By the way, I don’t have a problem with gifs in my phone – just in the browser. Perhaps the browser can’t store data in the same way that the phone can.

Still, it’s strange because the gifs normally work very well in my browser.

1 Like

What formula do you use for animation? to show in the app sheet

@tsuji_koichi has put the basic steps here:

[Feature: Video Embedding](https://community.appsheet.com/t/feature-video-embedding/15436/17) Tips & Tricks ?

I know this is not perfectly fancy way to show gif file on Appsheet app, but there is a way to achieve this. Again, I know this is not ideal way for you as it takes several steps and process to follow to save gif file and show the same on the Appsheet app. Other community member may have far better way to achieve the same, but please see the quick short movie here. In a nutshell, i did like this. Create physical column to store text for Google Drive file IDs. Column name here …

I learned this from him. Also see my follow up here:

[Feature: Video Embedding](https://community.appsheet.com/t/feature-video-embedding/15436/18) Tips & Tricks ?

I finally got it to work. I wanted to put the gif on my own server but, for some reason, I couldn’t get that to work. However, when I uploaded a gif I had made to my Google drive account and then made it public, I got the following shareable URL: https://drive.google.com/file/d/1Zm67g8yUdgP4szOjou_psXXAIxNQYlVf/view?usp=sharing That wouldn’t work in a virtual image column . . . nor would https://drive.google.com/file/d/1Zm67g8yUdgP4szOjou_psXXAIxNQYlVf/ However, when I substituted “uc?…

2 Likes