# Rendering a long animation to file, not real time

**URL:** <https://discourse.processing.org/t/rendering-a-long-animation-to-file-not-real-time/46779>\
**Category:** Beginners\
**Created:** [July 23, 2025, 2:18am UTC](https://discourse.processing.org/t/rendering-a-long-animation-to-file-not-real-time/46779 "2025-07-23T02:18:06Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![MichaelMean](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/michaelmean/32/20917_2.png) [@MichaelMean](https://discourse.processing.org/u/MichaelMean)\
**Post date:** [July 23, 2025, 2:18am UTC](https://discourse.processing.org/t/rendering-a-long-animation-to-file-not-real-time/46779/1 "2025-07-23T02:18:06Z")

</div>

I’m just getting started with Processing. I have a background in coding though extremely rusty. I’ve run the examples and coded some fun stuff but I really want to render a long animation, say 30 minutes. If I did it frame by frame I feel like it wouldn’t work with the thousands and thousands of files. I could edit them together which I suppose isn’t the worst thing.

The real question I have, is there a way to render the animation to a file that would be processed during the draw() function? I’d like to just render versus letting the Processing program run for half an hour. I’ve looked through the docs but nothing is immediately obvious to my dumb brain. Any help or suggestions is appreciate, thanks!

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [July 23, 2025, 6:18am UTC](https://discourse.processing.org/t/rendering-a-long-animation-to-file-not-real-time/46779/2 "2025-07-23T06:18:23Z")

</div>

> **[saveFrame() / Reference](https://processing.org/reference/saveframe_)**
>
> Saves a numbered sequence of images, one image each time the function is run. To save an image that is identical to the display window, run the function at the end of draw() or within mouse and…

---

<div class="post-metadata">

**Author:** ![MichaelMean](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/michaelmean/32/20917_2.png) [@MichaelMean](https://discourse.processing.org/u/MichaelMean)\
**Post date:** [July 23, 2025, 2:12pm UTC](https://discourse.processing.org/t/rendering-a-long-animation-to-file-not-real-time/46779/3 "2025-07-23T14:12:29Z")

</div>

Thanks for the reply! I’ve gotten saveFrame() method to work, I suppose I’ll just make a long example and see if it crashes ffmpeg.

As far as rendering without going through the draw() loop I guess I can do all of the image processing work and either comment out the draw or put some logic in there to skip the on screen drawing. With long animations I was hoping there was some best practice to follow that was in the library or used by the community

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [July 23, 2025, 7:33pm UTC](https://discourse.processing.org/t/rendering-a-long-animation-to-file-not-real-time/46779/4 "2025-07-23T19:33:11Z")

</div>

Hello @MichaelMean ,

> [@MichaelMean](#):
>
> As far as rendering without going through the draw() loop I guess I can do all of the image processing work and either comment out the draw or put some logic in there to skip the on screen drawing.

Ignore below if you want to tackle this yourself.  
Your post inspired me and I cooked this up this morning!

Related:  
_[Movie Maker: Time gap between movie and its audio file - #2 by glv](https://discourse.processing.org/t/movie-maker-time-gap-between-movie-and-its-audio-file/46748/2)_

This is a version of above that does rendering outside of _draw()_:

```auto
/**
 * MovieMaker Frame Generator for Testing
 * 
 * Author: glv
 * Date: 2025-07-23
 * Version: 1 0 0
 *
 * Generates frames for testing without draw():
 */

int marker_10s;

void setup()
  {
  //size(1920, 1080);
  size(600, 600); 
    
  int t0 = millis();
  
  int videoTimeSecs = 60; // Must be in seconds 
  int desiredFrameRate = 60; // For MovieMaker!
  int framesToSave = videoTimeSecs*desiredFrameRate;
  
  // frameRate(1000); // Make this 1000 and let the rendering fly!  
  
  marker_10s = 10*desiredFrameRate;
  println("marker_10s:", marker_10s);
  println();
  println("It's show time!");
  println();
  println("videoTimeSecs:", videoTimeSecs);
  println("desiredFrameRate", desiredFrameRate);
  println("framesToSave", framesToSave );
  delay(1000);
  println();
  
  // Common to all text:
  textAlign(CENTER, CENTER);
  textSize(96);
  fill(0);
 
// If using drawFrame()
  for (int i = 0; i < framesToSave ; i++) 
    {
    drawFrame(i);
    //println(i); // Fills console!

    if (i%100 == 0) // Every 100!
      println(i);    
    
    saveFrame("frames/frame-" + nf(i, 5) + ".tga"); //tga is fast! png is slow...
    //saveFrame("frames/frame-" + nf(i, 5) + ".png"); //tga is fast! png is slow...
    }
  
   background(255, 255, 0); 
   text("Done!", width/2, height/2); // Adjusted so starts at 0
  
  int t1 = millis();
  int dt = t1-t0;
  println("Total time:", nfs(dt/1000.0, 0, 2) + "s");
  println("Average frame:", nfs( (float) dt/framesToSave, 0, 2) + "ms");  
    
  //exit(); // Automatically close Processing window
  noLoop();
  }
  
void drawFrame(int frame)  
  {
  if(frame > marker_10s)
    {
    background(255, 0, 0);
    }  
  else
    background(255, 255, 0);
    
  text(frame, width/2, height/2); // Adjusted so starts at 0
  }

```

It may need finessing.

`:)`

---

<div class="post-metadata">

**Author:** ![MichaelMean](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/michaelmean/32/20917_2.png) [@MichaelMean](https://discourse.processing.org/u/MichaelMean)\
**Post date:** [July 24, 2025, 1:51pm UTC](https://discourse.processing.org/t/rendering-a-long-animation-to-file-not-real-time/46779/5 "2025-07-24T13:51:45Z")

</div>

Yes! That’s about what I was thinking, thank you! I’m still getting my coding chops back, this would have sadly taken me days 😄

---

<div class="post-metadata">

**Author:** ![timesuptim](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/timesuptim/32/20893_2.png) [@timesuptim](https://discourse.processing.org/u/timesuptim)\
**Post date:** [July 29, 2025, 2:43am UTC](https://discourse.processing.org/t/rendering-a-long-animation-to-file-not-real-time/46779/7 "2025-07-29T02:43:01Z")

</div>

Thank you for this. I have been rendering 20 minute videos in non-real time but still within the draw() routine. This has probably not been a problem as the “virtual time” was slower than “real time” so we were not wasting time. This suggestion means that we can render perhaps more efficiently.