Sarah Drasner on Advanced SVG Animation (Oct 19th 2017, Barcelona)

Sarah Drasner on Advanced SVG Animation (Oct 19th 2017, Barcelona)

SVG is just starting to have its heyday. This trend towards heavy adoption means that people should be aware of optimization techniques, how to begin by designing for performance, and how to animate complex, responsive, and beautiful animations with simple and easy-to-debug code for production.


In this full-day workshop, Sarah will teach you the basics of the SVG Animation development and the essentials needed to start using these techniques in production environments for animations both large and small.

SVG is extremely powerful, with its reduced HTTP requests and clarity on any display. It becomes increasingly more so as we explore its capabilities for responsive animation and performance boons.

What You'll Learn:

  • How to make SVG cross-browser compatible, backwards compatible, and how to optimize it properly,
  • How create an informative and stable animation, or even a more complex animation that is production-ready,
  • How to leverage the powerful GreenSock API to control and manipulate multiple tweens and overlapping transforms,
  • How to use a variety of tools and techniques to create a seamless and engaging complex SVG animation with ease.

What Prerequisite Skills Do You Need?

Basic understanding of CSS and JavaScript.

What Hardware/Software Do You Need?

Please bring your own laptop (Mac or Win) with your favorite text editor.

Workshop Schedule

  • 8:30 Doors open, Registration
  • 9:00 Introduction & Kick-off
  • 11:00 Coffee Break
  • 12:30 Lunch
  • 13:30 Afternoon Session
  • 15:00 Coffee Break
  • 17:00 The End, Networking

Workshop Includes

  • Snacks and drinks during the whole day
  • Tea and coffee
  • Lunch
  • Paper and pen/pencil


IED School of Design
C/ Biada, 11,
08012 Barcelona

↑ Back to top