Ramp Nodes

john's Avatar


23 Jul, 2023 06:23 AM

Attached is a demo with two new nodes: make_ramp and apply_ramp.

Make_ramp makes it easier to create a curve you can use as a ramp in animations to control the way a value changes over time. The value might control the diameter of a circle, a coordinate for a moving shape, a zoom factor, a color gradient or any number of things. Instead of just increasing the value linearly by feeding in a frame node, you can use a ramp curve to make the value go up and down, faster and slower as the frame count increases.

This is also what my easing node does, but you have to choose from a set of canned curves like bounce or expo. The make_ramp node allows you to create your own custom curve for even finer control. You can also just use it to make interesting curves for any purpose (not just for animations). Ramp curves move from left to right and have a start, stop, and up to four inflection points.

Make_ramp takes 7 parameters:

  • Starting height. The height of the curve at any point determines the output value.
  • Segment 1. The first inflection point. X = width (1 or greater), Y = height
  • Segment 2. The second inflection point. Set width less than 1 to eliminate this point.
  • Segment 3. The third inflection point.
  • Segment 4. The fourth inflection point
  • Segment 5. The end point. Height (Y) is the final output value.
  • Curviness. 0 gives you straight lines with sharp corners; higher values add curviness for softer transitions.

Notice that the x values in the segments are widths, not x coordinates. This makes is easier to adjust one segment without having to change all subsequent segments. When designing a ramp curve you might want to choose widths that sum to 100. That way, the width of each segment will indicate the percentage of time spent on each phase of movement. But you can choose any widths you want and just render the node to see how your changes affect the curve shape. The actual film length can be determined later using the apply_ramp node.

Apply_ramp uses a ramp curve to generate a controlling value. It takes 4 parameters:

  • A ramp curve. This can be the output of a make_ramp node or certain other open curves.
  • Frame. The frame node used to drive an animation.
  • Total Frames. Length of your movie, starting with frame 1.
  • Output. "Value" outputs the controlling value. "Visualization" outputs a scaled ramp curve with a moving marker (useful during testing).

These two nodes work well together. You can create a standard ramp curve at whatever total width is most convenient, then use the same curve to drive movies of different lengths, or easily change your movie length during development without adjusting the original ramp.

Although apply_ramp is designed to be used with make_ramp, you can also use it with other open curves as long as its inflection points steadily increase along the x axis. The demo shows an example using my waveform node to generate a sine wave. If you want positive control values you will want to translate your curve above the x axis of the origin (so that all Y values are positive).

The attached demo (see screenshot) shows three ramp curves controlling the size of a square:

  • Red: A straight line curve with four inflection points.
  • Blue: The same curve softened to an extreme amount
  • Green: A sine wave

The bar at the top shows the effect of adding curviness to a straight line ramp curve. At the key infection points, the two ramps produce the same control values. But in between, the softened curve may produces higher or lesser values (which will cause blue or red sections in the overlapping bars).

I have also attached a movie showing the three ramps, first simulating an animation of length of 100 (during which time the second ramp becomes steadily curvier), then an animation of length of 250.

These nodes were inspired by a thread started by Gabriel. I haven't yet used them in my own projects, so they may require some further polishing. If any of you use these nodes, please report back and tell me if they worked.



  1. Support Staff 1 Posted by john on 29 Jul, 2023 05:52 AM

    john's Avatar


    Attached is a slight revision to my apply_ramp node. Works just the same, but internally I assume the initial height of the ramp curve occurs at frame 0, not at frame 1.

    For the default settings of 1 to 100, you would still enter 100 as the Total. Frames. But now, to output the starting height of your ramp curve, you would pass a 0 to the Frame port, not a 1. Passing a 1 (which is what you would normally pass as the first frame of your movie), will return a value which may be slightly different, depending on your ramp curve.

    The reason this matters, and the reason Nodebox starts movies by default at frame 1, not frame 0, is to help you make seamless loops.

    To make a seamless loop out of a 100 frame movie, you want to make frame 0 and frame 100 identical. BUT, at the end of each loop, you don't want to jump from frame 100 back to frame 0 because then you would get two identical frames in a row. If you have elements which are moving steadily, this pair of duplicate frames will cause a momentary freeze which will appear as a slight jerkiness.

    What you want instead is to jump from frame 100 back to frame 1. That is why Nodebox movies default to starting at frame 1.

    The initial version of my apply_ramp node, posted above, got this wrong. The new version attached here fixes that. I will put this fixed version in the next rev of my Cartan Node Library. Until then, you should use this updated version.

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:


Already uploaded files

  • ramp_test_screenshot.png 502 KB
  • test600.mp4 349 KB
  • ramp_demo.ndbx.zip 71.5 KB

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac

Recent Discussions

03 Mar, 2024 04:34 AM
23 Feb, 2024 07:39 PM
23 Feb, 2024 10:02 AM
22 Feb, 2024 05:51 AM
21 Feb, 2024 05:27 PM


21 Feb, 2024 04:49 PM
16 Feb, 2024 05:24 PM
06 Feb, 2024 04:45 AM
19 Jan, 2024 09:50 AM
13 Jan, 2024 03:47 AM
05 Jan, 2024 05:10 PM