FITC Toronto 2016

2016-04-17 00:00:00 2016-04-20 00:00:00 America/Toronto FITC Toronto 2016 It's Time to Level Up. Your skills, your connections, your passion: take it all to the next level with FITC Toronto 2016 - a three-day professional celebration of the best the world has to offer in design, web dev, media and innovation in creative tech. Toronto FITC Toronto


Developers today are exploring creative code to build something expressive and engaging. Traditionally this has been done with frameworks such as Processing and Cinder, and on the web, both Canvas and WebGL. While WebGL and Canvas provided you access to low level APIs, you lost the power of CSS animations and the composability of the DOM. Today the combination of React & SVG provides an elegant solution that bridges the gap between these two worlds. Gone are the days when the SVG’s cryptic syntax could only be deciphered by apps such as Illustrator or Sketch. Now you can dynamically generate animations with components and then wire them up to the application state and user interactions.

In this talk Varun will present some examples of what can be achieved, discuss performance aspects and show you practical applications to try.


Learn how to create interactive visuals with React & SVG.

Target Audience

Developers & designers interested in building 2D interactions and animations for the web.

Assumed Audience Knowledge

Basic knowledge of React. Intermediate understanding of JavaScript.

Five things audience members will learn

  1. SVG syntax
  2. Composing SVGs using React
  3. Adding interactivity
  4. Animating with a “re-render the whole world” approach
  5. How is this approach is different from the others