How to use Draw.io to make a diagram with an animating arrow

 As an architect, I drew my architecture diagrams primarily using draw.io. In this article, I'll discuss my experience using the free draw.io application to create animated arrow gif diagrams.

Step 1: Draw a diagram for whatever you need.

Step 2: Select only connectors.

Step 3: A property pane appears in the right-hand style panel once all of the connectors have been selected. Choose flow animation from the property list.

 Following that, the diagram shows an animated arrow.

This diagram with the animated arrow cannot be downloaded. As Diagram does not allow options for direct GIF download.

The animated diagram can be obtained in a variety of indirect ways, but I'll discuss the methods I took on a Windows machine.

I captured the screen using a snipping tool and converted MP4 to GIF using cloudconvert.com.

Step 1: launch the snipping tool

Step 2: In the snipping tool, select the record option and then select new.

Step 3: Select the diagram you want to record. A few seconds snippet is enough.

Step 4: Save that screen recording in MP4 format.

Step 5: Upload that MP4 file to https://cloudconvert.com/mp4-to-gif and click convert

Step 6: Once it is converted, Download the converted file in GIF format.