Hi, hope this helps: # Get your gif routes gifsFolder = '.' # Your gifs directory gifs = ['gif1.gif', 'gif2.gif'] # These are the files I'll use gifPaths = [f'{gifsFolder}/{gif}' for gif in gifs] # Create the paths for your with string formattingx # Create a function to interpolate between gifs def scaleFactor(path, pageNumber, canvasSize): # Get a scale factor to match the canvas size you want gifw, gifh = imageSize(path, pageNumber=pageNumber) factorMeasure = gifw if gifw > gifh: factorMeasure = gifh return canvasSize / factorMeasure def gifTransition(path1, path2): # Canvas and images dimensions w, h = 200, 200 # Canvas size # Define your frames introFrames = numberOfPages(path1) endingFrames = numberOfPages(path2) crossfadeFrames = 12 # Change this value for a longer transition totalFrames = int( (introFrames - crossfadeFrames/2)+(endingFrames - crossfadeFrames/2) ) # Get the total frames by merging the crossfade in the middle # Make a loop for the animation gif1Frames, gif2Frames = 0, 0 gif1alpha, gif2alpha = 1, 0 for frame in range(1, totalFrames+1): newPage(w, h) fill(1) rect(0, 0, w, h) with savedState(): scale(scaleFactor(path1, gif1Frames, w)) image(path1, (0, 0), pageNumber=gif1Frames, alpha=gif1alpha) if gif1Frames < introFrames: gif1Frames += 1 if frame > introFrames - crossfadeFrames/2: # Run the second gif with savedState(): scale(scaleFactor(path2, gif2Frames, w)) image(path2, (0, 0), pageNumber=gif2Frames, alpha=gif2alpha) gif2Frames += 1 if gif1alpha >= 0 or gif2alpha <= 1: # Crossfade transparency gif1alpha -= 1 / crossfadeFrames gif2alpha += 1 / crossfadeFrames gifTransition(gifPaths[0], gifPaths[1]) # Call the function saveImage('~/Desktop/gifCrossfade.gif') # Save your gif

@frederik it works!thanks!!!

Hi @gferreira, this workaround is really helpful in making variable font animations not so jittery (run into that a lot). However, when using BezierPath, one loses selecting fill within some words of the FormattedString. Is it possible not flatten it all to one color with BezierPath?

DrawBot has an abstract stack of "actions" which can be applied on different contexts. One context is your output: an animated gif. And there is always a drawBot context to create the preview pdf data. Using drawBot from the module helps in this case as @gferreira suggested.

@gferreira wow, this is huge!!! thank you again

Hello, Once again, thank you for being so helpful. Enjoy the day. Best. Robert

@gferreira Hello gferreira, Thank you so much the reply has been very helpful. I can see that I was thinking too much about modifying all areas of the code instead of changing a small component. Enjoy the day. Best. Robert

oh, there is indeed no progress callback on saveImage(..) Doing some googling on 'progress' and 'ffmpeg' does not results in a clear solution. DrawBot has a small wrapper around ffmpeg to generate movies: see https://github.com/typemytype/drawbot/blob/master/drawBot/context/tools/mp4Tools.py

The tutorial is awesome! Really cool to see the usage of DrawBot from the perspective of an animator!

While I'm working on an animation I run the script once to save the .gif file to the disk, then I select the file and hit the space bar to open it in Quick Look to preview the animation. I leave this preview window open in the Finder while I continue to work on editing the script in DrawBot — every time the file gets updated with a newly saved .gif it will automatically start previewing the new version. Kind of a strange technique but it works!

@gferreira Thanks so much!

Hoi I’m using OS 10.13.6, Drawbot says ModuleNotFoundError: No module named 'helper_functions' ––– ah, sorry, I just saw that there’s an extra file with the helper functions.

ok, one more. very similar to the previous one. page_s = 500 cell_amount = 12 rhythm = [1, 0, 0, 1, 0, 1, 1, 0] cell_s = page_s / cell_amount corner_s = cell_s/4 newPage(page_s, page_s) translate(-cell_s/2, -cell_s/2) def lozenge(pos, s): x, y = pos polygon((x, y), (x + s/2, y + s/2), (x + s, y), (x + s/2, y - s/2)) for x in range(cell_amount+1): for y in range(cell_amount+1): pos_x, pos_y = x * cell_s, y * cell_s fill(0.5) if (x+y) % 2 == 0 else fill(1) rect(pos_x, pos_y, cell_s, cell_s) fill(1) lozenge((pos_x - corner_s, pos_y), corner_s*2) fill(0) shift = (x + y) % len(rhythm) if rhythm[ shift ]: lozenge((pos_x - corner_s, pos_y), corner_s) lozenge((pos_x, pos_y), corner_s) else: lozenge((pos_x - corner_s/2, pos_y + corner_s/2), corner_s) lozenge((pos_x - corner_s/2, pos_y - corner_s/2), corner_s)

not really... but this is not so hard with a PDFDocument

@hzinn not sure how best to improve this more frames and higher resolution might be a start and maybe adding a background.

@mauricemeilleur Right, sorry, I didn't notice that earlier thread before. http://forum.drawbot.com/topic/36/drawbot-on-something-more-powerful-than-desktops-and-laptops

Thanks—I'll have a chance to try this for myself later today.

I mean to do so at some point—probably on GitHub, probably this summer when I can take a little time to clean up code and organize the sketches.

well done! achievement unlock!