De Grama Vazia a Circuitos Vivos
Circuitos não existem no vácuo. O espaço ao redor do asfalto importa — ele vende a escala, ancora a câmera e transforma uma vista 2D plana em algo que parece um lugar real. Veja como The Undercut preenche esse espaço com florestas geradas proceduralmente.
Por que árvores importam em um jogo de corrida top-down
À primeira vista, árvores em um jogo 2D top-down parecem pura decoração. Mas elas servem vários papéis críticos:
- Referências de profundidade — copas sobrepostas com sombras quebram a planura da vista aérea e dão ao terreno uma sensação de elevação
- Referência de escala — um carro passando ao lado de um grupo de árvores comunica instantaneamente velocidade e distância
- Enquadramento da pista — a vegetação guia naturalmente o olhar ao longo do layout do circuito, tornando curvas e retas mais legíveis
- Atmosfera — uma pista nua em grama plana parece um ambiente de teste, não um local de corrida
O desafio: cada circuito é gerado proceduralmente, então as árvores não podem ser posicionadas manualmente. Elas precisam emergir dos mesmos dados que constroem o circuito.
Três camadas de floresta
O sistema de vegetação constrói cada árvore a partir de três camadas empilhadas, renderizadas de cima:
- Sombra no solo — uma grande elipse escura e suave embaixo da copa. Ela ancora a árvore ao terreno e fornece a primeira sensação de profundidade. Uma segunda camada de sombra mais apertada adiciona variação de densidade.
- Copa — o corpo principal da árvore. Cada copa é um grupo de círculos sobrepostos com leve variação de cor e tamanho, dando uma silhueta orgânica e irregular. Mudanças de tonalidade dentro de uma faixa controlada mantêm a paleta natural enquanto evitam monotonia.
- Sombra interna — um sutil anel escuro ao redor da borda interior da copa. Isso simula a auto-sombreamento que você vê ao olhar para baixo dentro de uma copa de árvore, adicionando volume sem nenhuma geometria 3D.
A combinação resulta surpreendentemente tridimensional da câmera top-down — as copas parecem flutuar acima do solo, projetando sombras reais abaixo delas.
Regras de posicionamento
As árvores são espalhadas pelo terreno usando um mapa de densidade derivado do layout do circuito:
- Zonas de exclusão ao redor da superfície da pista, zebras, caixas de areia e pit lane — nenhuma árvore deve bloquear a ação da corrida ou recortar na geometria da pista
- Queda de densidade — mais árvores perto das bordas da pista (enquadrando o circuito), diminuindo em direção aos limites do mapa
- Formação de grupos — árvores não aparecem individualmente. Um ponto pai gera um pequeno grupo de 3–8 árvores com deslocamentos aleatórios, criando bosques de aparência natural em vez de uma grade uniforme
- Variação de tamanho — cada grupo mistura árvores de copa grande com menores, imitando uma borda real de floresta onde árvores altas abrigam crescimento mais jovem
O algoritmo de posicionamento roda uma vez quando o circuito é gerado — em menos de 50 milissegundos para uma floresta completa.
Ajuste ao vivo
Acertar o visual exigiu iteração constante. Em vez de recompilar e recarregar, cada parâmetro visual é exposto em um painel de debug em tempo real:
O painel expõe mais de 15 parâmetros:
- Alpha / Escala / Difusão da Sombra — controlam a escuridão, tamanho e suavidade de ambas as camadas de sombra
- Fator de Árvore — multiplicador global de densidade, controlando quantas árvores povoam a cena
- Deslocamento de Sombra — desloca a sombra em relação à copa, simulando um ângulo de sol
- Alpha / Escala da Sombra Interna — o anel de auto-sombreamento dentro de cada copa
- Mipmap Bias — nitidez da textura em diferentes níveis de zoom
- Tonalidade Mín / Máx — a faixa de tons de verde na copa, de floresta escura a primavera brilhante
- Mistura cumulativa — camadas de sombra podem se misturar aditivamente para áreas de sobreposição mais densas
Cada mudança atualiza instantaneamente na vista ao vivo da pista. Esse loop de feedback permitiu ajustar o visual exato em minutos em vez de horas — e adaptar rapidamente a paleta para diferentes temas de circuito ou estações.
Mantendo rápido
Performance importa — The Undercut visa 60 FPS mesmo em hardware modesto, e uma floresta completa pode significar centenas de árvores na tela.
Otimizações principais:
- Renderização instanciada — todas as árvores compartilham a mesma geometria base, desenhadas em um único lote com transformações e deslocamentos de cor por instância
- Culling de frustum de visão — árvores fora da área visível da câmera são ignoradas completamente
- LOD por zoom — em níveis de zoom distantes, detalhes de sombra são simplificados e árvores pequenas são descartadas
- Atlas de textura — variações de copa são empacotadas em uma única folha de textura, evitando chamadas de desenho por árvore
O resultado: uma floresta completa renderiza em menos de 1 ms por quadro, deixando o orçamento da GPU livre para renderização da pista, carros e interface.
O resultado
O que começou como “adicionar umas coisas verdes ao redor da pista” se tornou um sistema que genuinamente transforma a sensação do jogo. Circuitos que pareciam planos e estéreis agora parecem incorporados em uma paisagem. As sombras vendem profundidade. A variação de cores vende vida. E como tudo é procedural, cada circuito gerado recebe uma floresta única que se encaixa em seu layout — sem trabalho manual necessário.
Cada corrida, um novo circuito. Cada circuito, uma nova floresta.