What it does
Challenges I ran into
Since English has no defined rules for brush stroke order when drawing characters, it was very difficult to create a logical rule that could be applied to any letter. Almost everything I came up with had some exceptions. In addition, SVG animations with the Snap SVG library are asynchronous, and run completion handlers when they finish. I attempted to loop through each letter and place the code to animate the second stroke in the completion handler of the first. However, by the time that code ran, the loop had completed and all of the variables I passed in were out of scope. To combat this, I had each animation recursively call the next, creating a responsive and properly timed animation.