Scalable Vector Graphics (SVGs) are the new big thing in web design today, and for a good reason. SVG is going to be one of the fundamentals of web design, and getting a grip of it and how to use it is becoming more important as its usefulness becomes more obvious every day.
With the proliferation of retina screens and high resolution displays, we need to adopt techniques that allow us to serve graphics that look good on all screens in all circumstances. In this workshop, Sara is going to give you a hands-on practical jump-start — she is going to go through an entire SVG workflow from creating, exporting and optimizing SVGs, to styling and animating them, making them responsive, tips for delivering performance-optimized SVGs, automating workflow, tools for making your SVG workflows better, and much, much more.
In one day, you'll learn:
- How SVGs can be styled, adjusted and manipulated with CSS,
- How they can be animated using CSS animations and transitions,
- How to responsify SVGs using CSS media queries,
- Dive into coding and walk through it all the way from styling and animating to responsifying SVGs,
- You'll work with practical, everyday examples of SVGs,
- See your SVGs working across a range of devices from mobile phones to desktops and everything in between,
- You'll walk away with a full set of resources and example files too.
This workshop is for professional Web designers and developers and assumes that you're already familiar with HTML5 and a little CSS.
- 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
- Snacks and drinks during the whole day
- Tea and coffee
- Paper and pen/pencil
What hardware/software do you need?
It's a good idea to bring your laptop to the workshop. Pencils, markers and paper will be supplied.
IED School of Design
C/ Biada, 11,