Motion Design with CSS: Full Day Workshop with Rachel Nabors

Web animation is one of the top design trends for 2016, and now's your chance to master the UX principles and technical skills needed to bring motion to your work.

Tickets Prices in USD

Additional Information

In this full-day workshop, web animations expert Rachel Nabors imparts all her knowledge of CSS Animations and Transitions through a series of fun and illuminating hands-on exercises and moves on to explain when and how to use these new animation powers to "plus" your user's experience.

Part I: CSS Animations and Transitions

In the first half of the day, you will learn to:

  • Master CSS Animations and Transitions
  • Create performant animations
  • Sequence animations with JavaScript
  • Animate spritesheets with only a few lines of CSS
  • Create your own custom timing functions
  • Troubleshoot animations and their performance with the latest browser tools
  • Use cutting edge dev tools to inspect and tweak animations and transitions

Part II: Animation and UX Principles

In the second half of the day, Rachel pulls from her deep knowledge and experience with UI animation to explain:

  • The science behind the human visual system and how animation taps into our brain's innate processing power
  • How animation made the iPhone--and other touch-based interfaces–possible
  • The five applications of animation to user interfaces and how they apply to your own projects
  • When to start planning for motion in your process and what tools to reach for
  • How and when to increase animacy to increase the perceived speed and visual hierarchy of a design component
  • Best practices and gotchas for dealing with users with vestibular disorders.

You will need

  • Your laptop
  • Some knowledge of CSS
  • Some knowledge of JavaScript (jQuery will do)
  • That's it!

Class starts at 9am, breaks for lunch on your own, and ends at 5pm.