Próximas Turmas

Nenhuma turma disponível no momento

Quero mais informações

O que você vai aprender nesse curso

Capacitar o aluno na utilização da biblioteca GSAP (GreenSock Animation Platform) para criar animações modernas, fluidas e interativas em projetos Web.

O workshop tem foco prático e aborda desde os fundamentos até recursos avançados como timelines, interações com eventos e animações controladas por rolagem com o plugin ScrollTrigger.

Ao final, o aluno será capaz de aplicar animações incríveis em páginas HTML com alto apelo visual.

Conteúdo do curso

Fundamentos do GSAP e Animações com Interatividade

  • Introdução ao GSAP: vantagens e casos de uso
  • Estrutura básica: gsap.to(), gsap.from(), gsap.timeline()
  • Propriedades de animação: x, y, scale, rotate, opacity
  • Stagger: animações em sequência
  • Easing: suavização dos movimentos
  • Animações em loop: repeat, yoyo, delay
  • Mini-projeto prático: animação de Hero Section + botões e cards interativos

ScrollTrigger e Animações Avançadas

  • Como funciona o ScrollTrigger
  • Marcação HTML e estrutura responsiva
  • Propriedades essenciais: trigger, start, end, scrub, pin
  • Transições entre seções com animações contínuas
  • Fixação de elementos com pin
  • Coordenando animações com a rolagem do usuário

Máscaras, SVG e efeitos avançados

  • Utilização de mask-image com SVG para revelar conteúdo
  • Sincronização entre animação de máscara e elementos da interface
  • Manipulação de clip-path, blur, filter e mix-blend-mode
  • Animação de elementos gráficos (imagens, ícones, shapes)
  • Coordenação entre múltiplas timelines

Projeto prático para aplicação do conteúdo

  • Aplicação de animações em projeto HTML e CSS