Graph

[Nejcr]

Hello, I am hoping someone can answer, point me in which direction can I learn and work.

I am using Adobe Animate to animate such "graph" to "load" from A to B. (see attachment). What tool can i use to draw those bars gradually getting longer without distorsion or draw from scratch? If you look at the short lines, you can see a little bit weird distorsion and the lines don't follow the gray line.  

I can also use Illustrator, After effects.

I hope my question is clear.

Kind regards, Nejc

[ClayUUID]

You're going to have to draw them at full size, then reveal them with a rotating mask.

[Nejcr]

Thank you ClayUUID,

I suppose rotation mask in After Effects? 

[n. tilcheff]

No, I'm pretty sure he means mask in Flash/Animate.

Since you only have semi-circles this is very easy to achieve.

You rotate the semi-circle symbol (Graphic), while the mask is static over them.

ps. Correction - 'arc', not 'semi-circle'

[ClayUUID]

Uh, no. Rotate the mask while the line arc is static.

[n. tilcheff]

Funny!

[ClayUUID]

I was being serious. But now that I think about it some more, with a little work it would be possible to use a single mask layer for any arbitrary number of bars. You'd just have to bleed the moving bars a few pixels to ensure they always fill the stroke width of the mask cutouts, since arcs in Animate are imprecise and wobble when rotated.

Like so...

[n. tilcheff]

Yeah, brilliant!

Allows for a simpler setup without removing any flexibility how to time, while eliminating arc wobbliness.

[Nejcr]

That's the output i had in mind. Trying to recreate that now... Thank you so much.