How did you create your tutorial videos?

[Dale Rogers]

I'm an instructional designer/eLearning developer. I loved how you created your instructional video for introducing Flip. It was a combination of codepen, GSAP, voice-over, etc. How did you pull those different elements together? Who ever did it... kudos.

 

Thanks.

[ZachSaucier]

Hey Dale and welcome to the GreenSock forums.

 

We use Camtasia for our screen recording and video production. Obviously CodePen is a very useful resource as well as it lets us code quickly, show important parts, and share demos with people  

[GreenSock]

Thanks Dale! Yeah, I just called gsap.makeAwesomeVideo() and POOF, it spit that out.

 

Lots of building demos, writing a rough script, recording, re-recording, editing, and leveraging CodePen big-time. Some of the title screens were actually just CodePens that used SplitText and GSAP to do all the animation. Like the black screens with text inbetween sections, and the intro/outro - all GSAP. It was super easy to then swap in new text, get that effect with zero effort, and record my screen with Camtasia. 

 

Thanks for the kind words. It took me an embarrassingly long time to put that together, so it's nice when someone notices the effort. 

 

Happy tweening!