Thread by @marcoscastro

Quando eu dava aula de Matemática, sempre me perguntavam “MAS QUANDO EU VOU USAR ISSO NA MINHA VIDA?”

Pois bem, fiz essa thread pra mostrar que, quando você usa a criatividade, você consegue solucionar problemas usando qualquer conhecimento.

Como alguns devem saber, eu criei um jogo de videogame, chamado A Lenda do Herói. Esse jogo começou como uma série de vídeos pro YouTube, ou seja, antes não era um jogo. Era tudo animação em vídeo, e a gente fazia isso no After Effects.

No After Effects a gente fazia tudo: a movimentação do Herói (o personagem principal), os inimigos, tudo. Como o jogo é no estilo plataforma 2D (como a maioria dos clássicos 8 e 16 bits), boa parte da movimentação do Herói era baseada em andar, atacar e PULAR.

Bem, este último (PULAR) sempre foi uma pedra no sapato na hora de animar, pois o After não lida de forma muito amigável com trajetos em forma de parábola (lembram das aulas de Física?). Sempre que a gente animava o movimento de pulo, ou demorava muito pra fazer ou ficava falso.

Eu queria fazer esse movimento ficar natural e sem que desse muito trabalho. Aí pensei: bem, o que são parábolas? São curvas que estão relacionadas a equações do 2º grau. Se eu conseguir achar a equação que determina o pulo do Herói, eu posso aplicá-la no After Effects.

O próximo passo então foi pegar o papel e lápis e determinar uma fórmula matemática para a parábola que começasse no ponto inicial do pulo e terminasse no ponto final do pulo. Chamei esses dois pontos de A e B, sendo que o A tem coordenadas (x0,y0) e o B tem coordenadas (xf,yf).

Assim como com 2 pontos temos uma única reta que passa por eles, com 3 pontos temos uma única parábola que passa por eles. Mas como só temos 2 pontos, temos várias possibilidades de parábola (o que não é um problema, pois o Herói pode dar um pulo mais baixo, outro mais alto…)

A equação da parábola, pra quem não lembra, é da forma y = ax² + bx + c, onde a, b e c são as variáveis que vão determinar o formato da parábola.

Minha estratégia foi então deixar uma variável fixada (vou chamá-la agora de G, em alusão à gravidade) e forçar as outras duas variáveis (b e c) para passarem nos pontos inicial e final do pulo (A e B).

Como fazer isso? Basta criar um sistema de 2 equações, em que a parábola precisa respeitar as condições:

1) em x0, ela tem que passar em y0
2) em xf, ela tem que passar em yf

Isso força a parábola a passar nos pontos A e B. Temos duas equações para duas variáveis, b e c.

Resolvendo o sistema, achamos os valores de b e c, e, portanto, conseguimos montar essa equação bonitinha que tá aí embaixo (não se assustem! É só multiplicação, divisão e jogar os termos de um lado pro outro na equação).

Achada a fórmula, agora é colocar no After Effects. Como fazer isso? O After usa “expressões”, que é basicamente o uso de programação para automatizar algumas coisas na animação. Nesse caso, automatizaremos a posição do Herói no pulo jogando a equação da parábola no código.

Usando JavaScript (aqui eu tenho que agradecer aos 5 períodos da faculdade de Ciência da Computação que fiz antes de mudar pra Matemática), eu escrevi o seguinte código e apliquei a expressão no After Effects:

Agora vai só uma tecnicalidade off-topic, pois é mais sobre o software em si do que sobre a matemática: ao aplicar o código, ele passa a valer para qualquer tempo na timeline, ou seja, antes e depois do pulo também continuaria valendo. Como driblar isso sem criar uma nova layer?

Usando marcadores numa nova camada que controla os tempos inicial e final do pulo, eu limitei que a expressão só valesse entre esses dois marcadores. É isso que basicamente faz a parte inicial do código.

Pois bem, aplicando a expressão no After Effects, é só eu escolher o valor de G (que eu controlo através da propriedade Gravity (usando Sliders), que cada salto fica da altura que eu quiser.

Aí é só eu mudar o valor do Gravity para cada salto ao longo do tempo (as curvas amarelas são as parábolas geradas pelo código).

Por exemplo, se eu aumentar o valor, o salto fica mais alto (como aparece nas imagens)

O resultado final vocês podem ver aí embaixo (ou o vídeo inteiro no link):

O que eu quis mostrar nessa thread, amiguinhos?
Que você pode, sim, usar seus conhecimentos, combiná-los e dar um jeito de aplicar, mesmo que num primeiro momento não pareça ter a ver.

Eu misturei matemática, computação, música, comédia e games (5 coisas que eu amo) e o resultado tá aí.
Nunca duvidem das habilidades de vocês. 😉❤️