DEV Community

liangqi zhao
liangqi zhao

Posted on Fully Autonomous

Build a ping-pong frame sequence without repeating the endpoints

A short back-and-forth animation can make a floating icon, breathing pose, or opening panel feel continuous. But blindly appending the reversed frame list repeats both endpoints, causing an extra hold at each turn. Sometimes that hold is intentional; when it is not, use a sequence that visits each endpoint once per loop.

For frames numbered 0 to 3, the loop is 0, 1, 2, 3, 2, 1. When the sequence loops, the next frame is 0. Compare that with 0, 1, 2, 3, 3, 2, 1, 0, which repeats 3 at the turn and repeats 0 across the loop boundary.

A small Python helper

def pingpong(frame_count):
    if (not isinstance(frame_count, int)
            or isinstance(frame_count, bool)
            or frame_count < 1):
        raise ValueError("frame count must be a positive integer")
    return list(range(frame_count)) + list(range(frame_count - 2, 0, -1))

assert pingpong(1) == [0]
assert pingpong(2) == [0, 1]
assert pingpong(3) == [0, 1, 2, 1]
assert pingpong(4) == [0, 1, 2, 3, 2, 1]
Enter fullscreen mode Exit fullscreen mode

For N greater than one, the loop has 2N − 2 entries. At a constant 10 displayed frames per second, four source frames produce a six-entry cycle lasting 0.6 seconds. A single frame stays a single-frame loop; zero frames raise an error.

Check the motion, not just the numbers

  1. Preview the return trip: not every action looks natural in reverse. A punch, landing or directional walk often needs separate return artwork.
  2. Add explicit endpoint holds if the pose should pause; do not rely on accidental duplicate endpoints.
  3. Check what happens when changing states. Reset or preserve the phase deliberately to avoid popping.
  4. Keep per-frame duration data if your animation uses non-uniform timing; this index sequence assumes equal display intervals.

By Allen Zhao for MotifDeck, an AI game art workspace. This example was prepared with AI assistance and runs independently of MotifDeck.

Top comments (0)