Learn creative coding writing simple programs
145. Export animation frames, convert to animgif using gifsicle
In this episode we add two features to the loop drawing program we created on the last one: export the loop as gif images and clear the animation to start with a new drawing. Both features are triggered by pressing different keys on the keyboard.
As the animation is a 20 frame loop, it does not really matter when we start saving the frames, as long as we export exactly 20. An easy way to export the right amount of images is by having a variable that indicates how many frames we still want to save. If the variable is 0, it means we don't want to save any images. At some point we press the key 's' in the keyboard, and we change the variable, making it equal to the total number of frames in our loop. In the draw loop we just have to check if the variable is greater than 0. If it is, we save a frame and reduce the variable by 1. At some point the variable will become 0 again and the saving of frames will stop.
Once we have exported the frames we can use the command line program 'gifsicle' to pack all frames as a .gif animation, which we can later send by e-mail or upload to the Internet. gifsicle is a free program for .gif animation manipulation. With it you can add and remove frames to a gif animation, compress it, change the delays between frames, reduce the colors and much more.
To clear the animation we just create again all the PGraphics when we press a key. Probably a more efficient method would be to write a loop that calls clear() on each PGraphics (instead of creating them again). If you want to try improve the program by using clear(), take a look at http://processing.org/reference/clear_.html
Code editor
background
createGraphics
draw
for
frameCount
height
if
image
int
key
keyPressed
line
mousePressed
mouseX
mouseY
new
PGraphics
pmouseX
pmouseY
saveFrame
setup
size
stroke
strokeWeight
void
width
Try to stay close to the topic of this episode. Use the Processing forums for help with unrelated Processing projects (or hire me for help ;-)
To indicate that a word in your comment is code, use the `backtick`. Example
Do `float` and `int` smell similar?
To highlight code blocks, surround it with ``` code-fences ``` like this:``` void setup() { size(600, 600); } ```