Conhecendo o SVG e algumas ferramentas - 11 / 11 - 48min
Introdução
O que é SVG
gerando SVGs
formas básicas do SVG
Trabalhando com coordenadas
A tag path
Sobre as letras no path
Importando SVGs
"XML NameSpaces" ou "xmlns"
Exportar SVGs do Illustrator
O que aprendemos?
Começando a animação com CSS - 12 / 12 - 58min
Animando os caiaques
Animando as nuvens
Usando opções de "keyframe"
Animando o lettering
Animando o traçado
A propriedade `animation`
Finalizando o header
Entendendo o viewBox
Posicionamento com viewBox
Entendendo o viewPort
Loaders em SVG
O que aprendemos?
Leiaute com CSS - 9 / 9 - 35min
Inserindo cards no HTML
Iniciando os estilos dos cards
Utilizando o FlexBox
Responsividade com flex
CSS FlexBox
Mais prática com o viewBox
Coordenadas ao contrário?
SVG Icons
O que aprendemos?
Animação com JS e bibliotecas - 15 / 15 - 66min
Pegando eventos de tela com JS
Usando o addEventListener
O addEventListener()
Utilizando mais métodos JS com o DOM
Juntando JS e CSS
Utilizando valores variáveis no CSS
Trabalhando com classes, this e bind
Usando o "this" e o "bind"
Finalizando a animação com JS
Referenciando os ícones no JS
Trocar a animação dos cards
Utilizando bibliotecas externas
O que são CDNs?
Outras opções do TweenMax
O que aprendemos?
Recursos de filtro e animação do SVG - 13 / 13 - 46min
Adicionando novos elementos ao projeto
Utilizando a tag defs
Aplicando filtros
Brincando com filtros
Sobre filtros de SVG
Efeitos de gradiente com SVG
Usando JS para animar filtros
Estilos e posicionamento no footer
Finalizando
SMIL e compatibilidade SVG
Faça como eu fiz na aula
O que aprendemos?
Conclusão