szh-AnimatedLoop

 

I created the wave/oscillating motion with the easing function sineOut(x). I achieved the oscillating motion that I intended but I fell short in trying to fully loop (without hiccup) the add ons/effects I had paired with this animation:

I had hoped to achieve a motion blur effect, which with the affect of the arcs changing dimensions (closing and opening like Pacman), gives the trail it leaves behind a certain effect.

I was inspired after looking through various of beesandbombs' gifs: https://twitter.com/beesandbombs/status/1090673528758849536?s=20

Where the movement of each individual piece seems to be controlled by a sinusoidal wave. I also tried playing with the overlap of the colors of each piece (where some parts of the line looks darker because of the varying opacity).

Code