Free Sample Lesson
Every week Creative Coding Club members get a new lesson.
Enjoy this free sample.
This week we're going to deconstruct and build a really cool image mask effect I saw in this Chevy Tahoe ad on Twitter.
I'm a firm believer that broadcast ads and even banner ads have some of the best motion-graphics work.
Like everyone, I largely find commercials annoying, but chances are there was a very talented animator hired to create them. 99.99% of viewers won't appreciate the extra time they put in to get things just right.
I'd encourage you to watch ads with the perspective of "how would I build that?". You may find yourself surprisingly intrigued, inspired, and perhaps challenged.
When I saw this ad I was instantly impressed by how slick it was. It had some effects that I commonly see on award-winning sites. As I sat there fiddling with the playhead scrubbing back and forth it took a bit of time to figure out what was going on.
In the end we're talking about just 1 second of animation, but the timing is delicious and setting things up in HTML and CSS always presents a challenge.
I figured if this was something that I had to put some time into figuring out it would make for a good lesson for you.
I hope you enjoy!
Finished Demo
I hope you find a way to incorporate this effect into your own projects!
Homework
Try to take this one step further by either adding in the text or next frame in the ad.
Share your creations on twitter and tag @snorkltv. I'd love to see and share what you build!
If you would like to see me build out more of this ad or ones like it, let me know carl@snorkl.tv
Did you enjoy this lesson?
This short video gives a sample of just 6 of the 130 lessons you could unlock today. FOR FREE
Do you know people who could benefit from my GreenSock training?
Please help me spread the word.
I have a 1 month Free Trial of Creative Coding Club promo going on through Monday Nov 29, 2021.
Send this link to your co-workers, freelancers, followers and friends:
https://www.creativecodingclub.com/bundles/creative-coding-club
Thanks so much for your help and support!
Hope to see you in the club!
Carl