Designing Delightful Animations For The Web
Full-day workshop • Monday, June 24
Lots Of Simple Things, One At A Time
In 1981 Disney animators Ollie Johnston and Frank Thomas introduced the Twelve Basic Principles of Animation, a set of techniques designed to add life to animation, in the book The Illusion of Life: Disney Animation.
Fast forward to the present day and these principles are no less relevant and can be applied, in varying degrees and contexts, to web animation.
In this workshop we'll explore each principle and learn to interpret them for and apply them to the modern web.
Over the past few years Chris have developed a workflow for designing and building SVG animations that he uses in his everyday work. He is constantly tweaking this process to ensure it keeps him as productive as possible. In this full-day workshop, Chris will be exploring an efficient workflow for creating animations for the web that make a lasting impression and increase engagement.
Along the way, we’ll also explore some other important topics like the 12 Principles of Animation, performance, optimization and odd quirks (of which there are a few!).
Beware: by the end of the day Chris expects to be out of a job 😊
Takeaways for the workshop
- In the session we’ll learn how to take a static vector design, like an Adobe Illustrator file, and turn it onto an interactive animation, carefully separating and grouping the individual elements, exporting them for use in a page and adding interactivity.
- We’ll be using Greensock to animate everything and we’ll cover some of the many useful, time-saving features it offers.
- We’ll also explore some common questions around the viewBox, SVG filters, performance, optimisation and odd quirks (of which there are a few!).
Who is the workshop for?
What hardware/software do you need?
A copy of Illustrator would be very useful too but any vector software that can export SVG is fine. If you have After Effects installed too and that would be a huge bonus too - after all this session is about animation!
About Chris Gannon
Chris is an independent animator, illustrator and interactive designer from the UK. He specialises in delicious interactive SVG animation and has worked his magic on some of the world’s biggest (and smallest) companies.
His fresh and experimental approach to his work has been recognised with multiple CSS Design awards and recently he’s noticed he has an unnatural obsession with eggs and outer space.
Time & Location
This full-day workshop will be hosted at the Ivey Tangerine Leadership Centre and will take place the day before SmashingConf. The workshop will be running from 9:30am to 5:00pm on Monday, June 24.
Schedule for Monday, June 24
9:00 AM – Doors open, Registration
9:30 AM – Introduction & Kick-off
11:00 AM – Coffee Break
1:00 PM – Lunch
2:00 PM – Afternoon Session
3:30 PM – Coffee Break
5:00 PM – The End
Save C\$100 when signing up for the conference and a workshop!