This Week's Sponsor:

1Blocker

A Cleaner, Faster, and More Private Web Experience


Kinetic Type Video Made with CSS, Webkit and Javascript

We’ve seen many Webkit / CSS experiments, but this one, seriously, it’s an outstanding achievement. We’re talking about a kinetic type videos, one of those you usually see realized with Flash and advanced After Effects techniques. This time, we have a kinetic type video made entirely with Webkit, CSS and javascript. The experiment is called “The Man from Hollywood” and it’s available here.

From the website:

“It’s a Kinetic Type experiment that makes use of Advanced CSS selectors and Webkit CSS properties. The idea is based off of kinetic type videos that are usually created using After Effects, Flash, or other animation tools. Javascript is used, but minimally, really just to turn class names on and off. All of the animations are accomplished using CSS.”

Be sure to check out the screenshots after the break, and see the video in action here.

Access Extra Content and Perks

Founded in 2015, Club MacStories has delivered exclusive content every week for nearly a decade.

What started with weekly and monthly email newsletters has blossomed into a family of memberships designed every MacStories fan.

Learn more here and from our Club FAQs.

Club MacStories: Weekly and monthly newsletters via email and the web that are brimming with apps, tips, automation workflows, longform writing, early access to the MacStories Unwind podcast, periodic giveaways, and more;

Club MacStories+: Everything that Club MacStories offers, plus an active Discord community, advanced search and custom RSS features for exploring the Club’s entire back catalog, bonus columns, and dozens of app discounts;

Club Premier: All of the above and AppStories+, an extended version of our flagship podcast that’s delivered early, ad-free, and in high-bitrate audio.