I am very proud to officially launch my new online course on CSS Animations and Transitions! Since working at Microsoft means I won’t have the time to travel and teach workshops as much, I wanted to make parts of those workshops available to people like you. This course is made up of the best of my in-person workshops that I’ve given all over the world to companies and conferences large and small. And now they are online for anyone to participate in—anywhere, any time.
My course will get you up and running in just a few lunchbreaks, guaranteed or your money back. (I mean it—if you aren’t happy, email me and I will make it right!)
Most of the CSS animation courses I’ve looked at over the years start by teaching you how to move a sad little box around the page—and they last for hours! I don’t have time for that, and neither do you! I knew I could do better:
With just four hours of video and interactive exercises, my course teaches you to animate an adorable cat with CSS animations and transitions and then shows you how these skills apply to your everyday work. When you’re done, you’ll be able to move sidebars, animate sprites, and create stateful transitions, while fondly remembering your glorious cat animation days! You will know everything I know about CSS Animations and Transitions!
What’s more, I even made an adorable cheat sheet (which is almost a comic), which you get when you enroll or just for signing up for my newsletter. My gift to my fellow web animation wonks!
I’ve talked a lot about the reasons why web animation is important and the challenges that developers face when they want to incorporate motion into their work. In my A List Apart article about the past and future of web animation I wrote:
Bringing development and design together is a great thing. It is in this overlap of disparate fields that genius occurs, and when we work together and learn each other’s skills, we can create beautiful things. I’ve always had a foot in both worlds: even back when I started out as a cartoonist, I was coding the very sites I shared and sold my work on. I want to accelerate this process for you.
Well-placed animations can help users understand the digital territory they’re navigating, and guide them in the right direction. Motion design is a crucial and often overlooked part of building top-notch websites and applications—getting comfortable with CSS is a great place to start.
Not only will users have warm-and-fuzzy feelings about the interfaces you build, but you’ll leverage your newly expanded frontend skills to boost the KPIs that drive your business. Freelancers, take this opportunity to expand what you can offer to clients. Employees, make your next raise a really easy decision for your boss.
I love CSS, because it’s a powerful tool that just about everyone uses. CSS skills are especially transferrable from workplace to workplace. For these reasons and because CSS is one of the easier and more bulletproof introductions to animation for frontend developers and designers to start animating, Web Animation Essentials: CSS Animations and Transitions is all about CSS animations and transitions. It is the perfect stepping stone for both new and established developers and designers with experience with CSS to get started in the moving web.
What you get
The exercises in Web Animation Essentials are all hands-on CodePens with recorded, captioned videos where I walk you through the problems—and their solutions. The entire course can be completed over a few lunch breaks or a weekend. After watching the videos and trying everything out for yourself, you’ll be confident handling CSS transitions, CSS animations, animation sequencing, performance optimization, and you’ll know your way around the best browser tools!
Finally, if you are still on the fence, this team took my course and wrote about their experience. Disclaimer: I didn’t even have the chance to give them this course for a discount or anything! They came in during the soft launch earlier this year and wrote all this of their own accord.
I’ll end with another quote from my article:
Since animation’s return to the web development and design toolkit, we’ve been using it to tell stories and entertain; to increase the perceived speed of interactions; to further brand ourselves and our products; and to improve our users’ experiences. And we’re just getting started.
Come get started—with me!