Infinite loop wipe transition effect tutorial

Note: I will repeatedly use the colloquial term "GIF" here to refer to any looping animation. I have come to prefer the WEBP format for my animations that I post to Lemmy, but the term GIF has become somewhat of a catch-all for looping animations regardless of the actual file format used.

Introduction

You may have seen GIFs like this that have a fancy "wipe" transition effect:

This transition can serve two purposes:

1. Provide a more concrete way for the audience to know where the GIF starts and where it ends. Oftentimes, you may come across a GIF in your feed that is already playing by the time you turn your attention to it. By that point, you might not know if you are right at the beginning of the GIF, or if it is already partway through its loop. If so, the end of the GI