Jogos de goleiro: como o Keeper simula a pressão de reação de verdade

Eu queria fazer um jogo de futebol em cima da parte mais difícil de uma defesa: aquele instante curtíssimo entre ler o chute e pôr alguma parte do corpo no caminho da bola.

Isso eliminou os botões quase de cara. Clicar para a esquerda ou para a direita até reproduz o resultado, mas não a sensação de reagir. Eu queria que o jogador acompanhasse a corrida do batedor, lesse a trajetória, esticasse o corpo, se inclinasse e se comprometesse com a defesa. A webcam tinha que virar o controle, e a pessoa na frente dela tinha que virar o goleiro.

Assim nasceu o Keeper. É um desses jogos de goleiro que parecem simples vistos de fora: defenda quatro de seis chutes e passe de fase. Por baixo, cada fase muda o problema de reação. O chute fica mais rápido, a bola faz mais curva, o gol fica mais largo, os cantos aparecem com mais frequência e o goleiro mapeado cobre menos espaço.

Não quero dizer que um jogo de navegador recria uma partida profissional ou substitui o treino de goleiro, porque não recria. A ideia é pegar as restrições que realmente importam em uma defesa e condensá-las num jogo seguro e legível, para jogar diante da webcam.

Como é a pressão de reação de um goleiro de verdade

Um pênalti não é difícil porque o goleiro nunca viu uma bola se mover. É difícil porque a informação e o tempo para se mexer chegam quase ao mesmo tempo.

Uma análise revisada por pares de 88 cobranças de pênalti encontrou um tempo médio de voo da bola de 525 milissegundos. Os pesquisadores também viram que as mãos dos goleiros começavam a se separar, nos chutes altos e baixos, cerca de 245 milissegundos depois do contato com a bola, enquanto o movimento para a esquerda ou para a direita podia começar a partir de pistas disponíveis antes do contato. Leia o estudo sobre como os goleiros detectam a direção e a altura do pênalti.

Foi essa diferença que moldou o Keeper. Um goleiro de verdade não espera a bola sair para reagir: ele lê a corrida, o corpo do batedor e a batida, e depois ajusta a decisão com o começo da trajetória. Por isso o jogo mostra um jogador de futebol correndo e armando a perna antes do contato. Quando a bola é lançada, a velocidade, a curva e o canto escolhido decidem quanto tempo sobra para corrigir.

O Keeper não é um teste de tempo de reação validado. A latência da câmera, o tamanho da tela, o tamanho do cômodo e o modelo de movimento amplificado o separam de um campo de verdade. Mas as fases mais altas se aproximam de propósito da pressão que os profissionais enfrentam. A fase 9 dá ao jogador 520 milissegundos de voo da bola, quase igual à média de 525 milissegundos desse estudo. A fase 10 em diante chega ao piso de 500 milissegundos do jogo.

O primeiro problema foi fazer a câmera parecer um espelho

O Keeper começa pedindo ao navegador um fluxo de vídeo da câmera frontal. O navegador controla o pedido de permissão por meio de MediaDevices.getUserMedia(). Essa API exige um contexto seguro e a permissão explícita do usuário, então a câmera não pode simplesmente abrir em segundo plano.

Eu peço vídeo na resolução ideal de 1280 por 720, deixo o áudio desligado e prefiro a câmera voltada para o usuário. O modelo de pose então processa os quadros de vídeo no próprio navegador. O Keeper usa o MediaPipe Pose Landmarker em modo de vídeo, com uma pose e o modelo leve rodando pela GPU quando disponível. O guia do Pose Landmarker para a web, do Google, explica o mesmo fluxo com quadros de vídeo.

Os pontos chegam em coordenadas da câmera, e eu espelho cada coordenada x antes de usá-la. Se o jogador vai para a direita dele, o goleiro precisa ir para a direita na tela. Sem esse espelho, um jogo de webcam já parece errado antes do primeiro chute.

Uma pose ainda não é um goleiro

O modelo de pose me diz onde aparecem, no quadro da câmera, a cabeça, os ombros, os cotovelos, os pulsos, os quadris, os joelhos e os tornozelos do jogador. Ele não diz onde esses pontos ficam dentro do gol.

A solução foi tratar o gol como um sistema de coordenadas próprio. O centro dos quadris do jogador vira o centro móvel do goleiro. Todos os outros pontos são medidos em relação a esses quadris, escalados pela largura e pela altura do gol e depois colocados na boca do gol.

Assim, corpos diferentes passam a compartilhar o mesmo espaço de jogo. Um pulso pode alcançar o ângulo superior, seja a pessoa alta, baixa, perto da câmera ou mais longe. O jogo não copia os pixels brutos da câmera para a tela. Ele mapeia a forma da pose na forma do gol.

Por que a inclinação precisa valer mais do que aparece na câmera

Uma sala de estar não é um campo de futebol. A maioria das pessoas não consegue se jogar com segurança num mergulho completo, e eu não queria que o jogo incentivasse isso.

Em vez disso, o Keeper mede o movimento horizontal dos quadris a partir da posição calibrada em pé e o amplifica por todo o gol. Uma inclinação de propósito vira um mergulho. A posição dos braços e das pernas ainda importa, mas o deslocamento amplificado dos quadris leva o goleiro inteiro até o canto sem exigir que o jogador vá ao chão.

A posição-base em pé se recentraliza devagar entre os chutes. Isso é necessário porque, depois de várias defesas, a gente naturalmente vai saindo do lugar. Com um ponto de calibração fixo, ficar parado no centro acabaria parecendo uma inclinação permanente.

Antes da primeira contagem regressiva, o jogo confere se a cabeça, os ombros e os dois braços estão visíveis e razoavelmente firmes. Ele exige que esse estado dure um instante, em vez de aceitar um único quadro de sorte. A calibração não é à parte do design do jogo: é ela que define o que a câmera precisa ver e dá espaço para o jogador se mover.

Como o corpo inteiro vira uma área de defesa

A decisão técnica mais importante foi que uma defesa não deveria depender só do pulso. Goleiros de verdade param chutes com as mãos, os braços, as pernas, o tronco e, às vezes, a cabeça. O sistema de colisão precisava reconhecer a silhueta inteira.

Monto o goleiro com algumas formas simples:

• O tronco é um polígono preenchido, feito dos dois ombros e dos dois quadris.
• Os braços e as pernas são segmentos de linha grossos, tratados como cápsulas e não como ossos de um pixel.
• Os pulsos ganham zonas circulares de luva um pouco maiores.
• A cabeça tem a sua própria zona circular de defesa.

Quando a bola chega à linha do gol, o motor faz uma única pergunta: a bola encosta em alguma dessas formas? Para um membro, eu acho o ponto mais próximo do segmento e comparo essa distância com a espessura do membro mais o raio da bola. Para o tronco, eu testo se o centro da bola cai dentro do polígono.

Pontos abaixo de um limite de visibilidade não contam para a defesa. Isso impede que um pulso adivinhado ou um tornozelo escondido crie um bloqueio invisível. O resultado é tolerante o bastante para parecer físico, mas preciso o bastante para o jogador ainda ter que ir até a bola.

Simulando as pistas antes da reação

Um bom jogo de goleiro de futebol precisa de um chute legível. Se a bola surge a toda velocidade sem nenhuma pista, o jogador está adivinhando, não reagindo.

Cada chute começa com uma preparação curta. O jogador se aproxima da bola, a perna de chute se carrega e um anel que se aperta deixa o momento da batida legível. Quando a bola sai da chuteira, o avanço dela acelera em direção ao gol. A bola também cresce do tamanho distante para o tamanho próximo, o que dá mais uma pista de profundidade.

O efeito usa um arco senoidal. A curva é zero quando a bola sai do pé, cresce no meio da trajetória e volta a zero no alvo escolhido. Assim a bola faz curva sem errar o destino escolhido pelo batedor.

Quando acontece uma defesa, a bola não desaparece. Ela rebate para longe do ponto de contato por um instante breve, e a parte do corpo que fez a defesa pisca. Essa pequena pausa deixou a colisão muito mais fácil de entender: dá para ver por que o chute foi parado.

Fases mais altas simulam um problema de reação mais profissional

A forma óbvia de deixar um jogo de goleiro mais difícil é aumentar a velocidade da bola. Tentei não depender só disso, porque a velocidade tem um limite: passado certo ponto, ela só tira a chance de reagir.

O Keeper muda cinco variáveis ligadas entre si conforme as fases sobem:

1. O tempo de voo cai, então o jogador tem menos tempo para se decidir.
2. A curva lateral aumenta, então o início da trajetória é menos direto.
3. O gol fica mais largo, criando mais espaço para defender.
4. A cobertura do goleiro mapeado diminui um pouco, então ficar parado protege menos do gol.
5. O batedor mira nos cantos com mais frequência.

A primeira fase dá à bola cerca de um segundo de voo. Isso cai 0,06 segundo por fase até chegar ao piso de meio segundo. Ao mesmo tempo, a curva e a chance de canto sobem em direção a tetos fixos. O gol vai se alargando aos poucos, em vez de pular entre modos de dificuldade arbitrários.

O importante não é um número isolado. É como as variáveis funcionam juntas. As primeiras fases ensinam o mapeamento. As fases seguintes pedem que o jogador tire informação da preparação, acompanhe a curva, se decida mais cedo e ainda use todo o alcance da pose. Essa combinação se aproxima mais da pressão de decisão de um goleiro experiente do que simplesmente fazer o mesmo chute central ir mais rápido.

As estatísticas das fases mostram toda a progressão

Conferi o ajuste atual de produção direto na configuração do jogo. Estes são os números que o Keeper realmente usa:

• Fase 1: voo de 1,00 segundo, fator de curva de 5%, gol com 42% de largura, 25% de chance de canto e 102% de alcance base.
• Fase 4: voo de 0,82 segundo, fator de curva de 20%, gol com 54% de largura, 43% de chance de canto e 96% de alcance base.
• Fase 7: voo de 0,64 segundo, fator de curva de 35%, gol com 66% de largura, 61% de chance de canto e 90% de alcance base.
• Fase 9: voo de 0,52 segundo, o fator de curva máximo de 45%, gol com 74% de largura, 73% de chance de canto e o alcance base mínimo de 88%.
• Fase 12: voo de 0,50 segundo, fator de curva de 45%, gol com 86% de largura, 90% de chance de canto e 88% de alcance base.

O fator de curva é um valor do espaço do jogo, e não uma afirmação sobre metros de desvio da bola de verdade. A largura do gol e o alcance também são proporções do gol no espaço da tela. A comparação útil é a progressão: entre a fase 1 e a fase 12, o tempo de voo cai pela metade, o gol fica mais de duas vezes mais largo, a chance de canto sobe de um chute em quatro para nove em dez, e a cobertura em pé diminui.

É por isso que as rodadas finais parecem outro nível de exigência, e não a primeira fase com outra cor. Na fase 9, a janela de reação já entrou na mesma faixa de meio segundo medida em imagens de pênaltis profissionais, e o chute também tem mais chance de fazer curva e terminar perto de um canto.

A meta de defesas é uma regra do jogo, não um padrão profissional

Cada fase tem seis chutes. Defenda pelo menos 60%, ou seja, quatro dos seis, e a próxima fase começa. A pontuação é o número de fases completas.

Escolhi um bloco fixo porque ele dá a cada fase uma pequena história. O jogador sempre sabe a meta, o chute atual e quanta margem de erro ainda resta. Se as quatro defesas necessárias se tornam matematicamente impossíveis, a partida termina na hora, em vez de arrastar chutes sem sentido.

Defender quatro de seis significa uma taxa de 66,7% para passar de fase. Isso não deve ser comparado com os percentuais reais de defesa de pênaltis. Os chutes, a escala do corpo e a distribuição dos alvos do Keeper foram feitos para um jogo de navegador que dá vontade de repetir, e não para ter equivalência estatística com a competição profissional. A referência do mundo real está na janela de reação e na pressão de decisão visual, não no placar.

Essa estrutura também separa consistência de defesa de sorte. Uma única defesa espetacular é gostosa, mas passar de fase exige decisões e movimentos repetidos. Isso combina mais com um jogo de goleiro online curto do que com uma sequência infinita, sem nenhum marco visível.

Mantendo o motor separado da câmera

O motor central do jogo não conhece o React, a webcam nem os pontos de pose. Ele cuida do batedor, da preparação, do voo da bola, da curva, dos resultados dos chutes, das regras das fases e da pontuação. A página entrega a ele o tamanho do palco e uma função de teste de defesa.

Essa separação tornou as regras importantes testáveis sem ligar uma câmera. Posso dar ao motor uma fonte de aleatoriedade determinística, avançar o tempo, inspecionar a trajetória da bola e conferir quando uma fase deve ser concluída ou terminar. A geometria da pose fica num módulo separado, onde pode ser testada como geometria.

O ciclo do navegador usa requestAnimationFrame(). Eu calculo o tempo entre um quadro e outro e passo isso ao motor, para a bola não andar mais rápido só porque a tela tem taxa de atualização maior.

O que construir o Keeper me ensinou

A parte difícil não foi reconhecer uma pessoa. Foi decidir como essa pessoa deveria ocupar um gol digital enquanto o chute passa a lembrar a pressão de reação de verdade.

O jogo começou a funcionar quando parei de tratar os pontos da pose como um controle pronto. Eles são só matéria-prima. O controle vem da calibração, do espelhamento, das coordenadas relativas, da inclinação amplificada, das checagens de visibilidade e das formas de colisão. A sensação vem de uma preparação legível, de um contato visível e de uma curva de dificuldade que muda o problema sem mudar as regras.

É disso que eu gosto nos jogos de webcam. O sistema técnico é complicado, mas a instrução para o jogador pode continuar simples: leia a aproximação, observe o chute, estique o corpo até a bola e faça a defesa. As primeiras fases dão tempo para aprender essa sequência. As fases mais altas pedem que você faça tudo isso em meio segundo.

Você pode jogar Keeper de graça no navegador. Para uma visão rápida da experiência, leia o meu guia complementar sobre o jogo de futebol em realidade aumentada. Se quiser ver como usei o mesmo pipeline de pose para correr em vez de defender, leia como eu criei o Dino Survival.