Pular para o conteúdo

Sand: um simulador de areia hiper-realista para jogar no navegador, e como ele funciona

abe ·

Sand é um brinquedo grátis para navegador que transforma a tela do seu celular em uma bandeja de areia que parece de verdade. Veja como jogar, o que o deixa tão realista e onde ele entra na longa história dos jogos de areia caindo.

Capa VENO de Sand, simulador de areia: duas capturas inclinadas com uma espiral de areia despejada e um canal em zigue-zague em areia escura, com as palavras “Incline e sacuda”

Sand é um simulador de areia grátis que roda no seu navegador. Ele enche a tela com centenas de milhares de grãozinhos que você pode empurrar com o dedo, fazer escorregar inclinando o celular e espalhar com uma sacudida. Foi feito com WebGL2 e JavaScript e funciona em celulares, tablets e computadores, sem baixar nada.

Não é um jogo com fases ou pontuação. É um brinquedo digital tranquilo, meio como um jardim zen de areia, e é surpreendentemente difícil largar. A seguir você vê como jogar, o que cada opção faz, algumas dicas para desenhos mais bonitos e uma olhada rápida em por que ele parece tão real.

Sand em resumo

O que é Simulador de areia hiper-realista (brinquedo relaxante, sem fases)
Onde jogar av.github.io/safe-sand em qualquer navegador moderno
Preço Grátis na web
Dispositivos Celulares, tablets e computadores
Controles no celular Arraste para desenhar, incline para escorregar, sacuda para espalhar
Controles no computador Arraste com o mouse para empurrar, setas ou WASD para inclinar, segure Espaço para sacudir
Feito com WebGL2 e JavaScript, com a simulação no chip gráfico
Código-fonte GitHub

Como jogar Sand

Quando a página abre, aparece um pequeno cartão inicial. Você escolhe a areia, escolhe o que fica “embaixo” dela e toca em Pour (despejar).

Cartão inicial do Sand com cinco tipos de areia, River, Beach, Desert, Volcanic e Coral, três fundos e o botão Pour

  1. Escolha um tipo de areia: River, Beach, Desert, Volcanic ou Coral (rio, praia, deserto, vulcânica e coral). Cada uma tem sua própria mistura de cores, do cascalho cinza de rio à areia vulcânica escura e ao coral clarinho.
  2. Escolha o que fica embaixo da areia: Light, Lock screen ou Screen off (claro, tela de bloqueio ou tela desligada). Isso muda a superfície onde os grãos ficam.
  3. Toque em Pour. No iPhone, permita o acesso ao movimento quando for pedido; senão, inclinar não vai funcionar.
  4. Jogue. Passe o dedo na areia para abrir um sulco, incline o celular para ela escorregar, sacuda para jogar grãos para todo lado ou vire o celular de cabeça para baixo e veja a areia cair.

Areia de rio recém-despejada formando uma espiral suave sobre uma superfície clara

No computador você usa o mouse no lugar do dedo, as setas ou WASD para inclinar a bandeja virtual e segura Espaço para sacudi-la. A areia reage do mesmo jeito, mas a versão para celular é aquela para a qual o criador a projetou, porque os sensores de movimento fazem a areia responder à sua mão de verdade.

Tela cheia de verdade no celular

As barras do navegador ocupam espaço. Para o efeito completo, adicione a página à tela inicial: Share → Add to Home Screen (Compartilhar → Adicionar à Tela de Início) no iOS, ou Install app (Instalar app) no Android. Aí ela abre como um app, de ponta a ponta.

O que faz este simulador de areia parecer real

A maioria dos jogos de areia para navegador que você talvez conheça usa uma grade: cada pixel é uma “célula” que pode ser areia, água ou vazio, e regras simples a movem para baixo um passo de cada vez. Esse estilo é ótimo para construir e misturar, mas a areia fica com cara de pixel. Sand segue outro caminho e tenta copiar a areia de verdade.

Um canal em zigue-zague desenhado com o dedo em uma camada de areia cinza de rio, com grãos acumulados nas bordas

Segundo a própria descrição do projeto no GitHub:

  • Cada grão é simulado. Cerca de 100.000 a 460.000 grãos individuais se movem ao mesmo tempo no chip gráfico (GPU).
  • Unidades reais. A simulação trabalha em milímetros com gravidade real (9,81 m/s²), então a velocidade e o leve atraso da areia batem com o que você espera da areia de verdade.
  • Cada grão é diferente. Os grãos têm tamanho, cor mineral e atrito próprios. Grãos soltos rolam e saltitam, enquanto um monte grande fica parado até você inclinar além do seu ângulo de repouso, a inclinação máxima que um monte aguenta antes de deslizar.
  • Luz e sombra. O app monta um mapa de alturas dos montes a cada quadro, o que gera declives, sombras próprias e um sombreado suave nas dobras. A direção da luz acompanha a inclinação do celular, então as sombras se alongam e os grãos de quartzo brilham quando você se mexe.
  • Som vindo da própria areia. O chiado é feito de milhares de cliques minúsculos por segundo, dependendo de quanta areia está de fato se movendo. Pedrinhas fazem cliques mais graves. Quando nada se mexe, o silêncio é total.

Areia vulcânica escura com um sulco em zigue-zague bem marcado e grãos mais escuros nas bordas do corte

Mais um detalhe mostra até onde vai o realismo: girar o celular não move a imagem. A areia fica presa ao vidro, como a areia de verdade ficaria numa bandeja.

Tipos de areia e fundos comparados

Tipo de areia Visual Bom para
River Cascalho cinza-amarronzado com pedrinhas Sulcos fundos e nítidos
Beach Bege claro e quente Desenhos suaves e calmos
Desert Grãos vermelho-alaranjados Forte contraste de cor sobre superfície clara
Volcanic Cinza-escuro a preto Linhas nítidas e sombras marcantes
Coral Bem clara, quase branca Espirais sutis e delicadas

A opção “embaixo da areia” muda a superfície onde os grãos ficam: Light, Lock screen ou Screen off. Teste cada uma com o mesmo tipo de areia para ver qual visual você prefere.

Areia de coral clara despejada em uma espiral solta sobre um fundo claro

7 dicas para desenhos mais bonitos na areia

  1. Despeje e espere um segundo. Deixe os grãos assentarem antes de desenhar, senão suas linhas vão se encher de novo.
  2. Desenhe devagar para bordas limpas. Um dedo lento deixa um sulco nítido com paredes certinhas; um gesto rápido joga a areia para os lados.
  3. Incline pouco. Incline só um pouco além do ponto em que a areia começa a se mover e depois nivele o celular de novo. Assim dá para conduzir dunas inteiras.
  4. Sacuda para recomeçar. Uma sacudida forte espalha a areia em uma camada nova e uniforme para o próximo desenho.
  5. Escolha areia vulcânica para desenhar. Areia escura sobre uma superfície clara é a que melhor mostra linhas e sombras.
  6. Ligue o som com fones de ouvido. O áudio vem dos grãos em movimento, então você ouve a diferença entre um deslize lento e uma avalanche repentina.
  7. Confira o Low Power Mode (Modo de Pouca Energia) se estiver travando. No iPhone, esse modo limita os navegadores a 30 quadros por segundo. O app detecta isso e não reduz a areia por causa disso, mas desligar o modo devolve a taxa de quadros completa.

Areia de rio empurrada para um lado da tela depois de inclinar, deixando uma faixa vazia do outro lado

Se estiver lento

O app ajusta a qualidade sozinho. Se os quadros ficarem lentos por dois segundos, ele primeiro reduz a nitidez da tela em etapas e só depois diminui o número de grãos. Ele lembra o nível para a sua próxima visita. Então, num celular mais antigo ou num notebook sem um chip gráfico forte, a areia pode parecer um pouco mais suave, mas continua se movendo com fluidez. As capturas deste artigo foram feitas num navegador de desktop com gráficos por software, por isso algumas áreas parecem um pouco quadriculadas.

Uma breve história dos jogos de areia caindo

Brinquedos de areia fazem sucesso nos navegadores há uns vinte anos:

  • 2005: um applet Java em um blog japonês popularizou o gênero. Uma versão ampliada posterior, o “Falling Sand Game”, deu nome a todo o gênero.
  • 2007: Powder Game acrescentou a simulação de líquidos à fórmula.
  • 2010: The Powder Toy levou líquidos e gravidade newtoniana aos jogadores de computador.
  • 2019: Sandspiel mostrou que um brinquedo de areia podia rodar rápido no navegador usando Rust compilado para WebAssembly e WebGL. O criador explicou no seu texto que cada elemento segue regras bem simples numa grade; a graça vem de como os vizinhos interagem.
  • 2020: Noita, da Nolla Games, saiu do acesso antecipado em 15 de outubro como um roguelite de ação em que, nas palavras do estúdio, “cada pixel é simulado fisicamente”.

Sand é outro ramo dessa família. Em vez de muitos elementos numa grade de pixels, ele se concentra num único material, grãos reais medidos em milímetros, e na sensação de segurar uma bandeja nas mãos.

O que desenvolvedores de jogos web podem aprender com ele

  • WebGL2 dá conta de simulação pesada. Centenas de milhares de partículas rodam numa aba comum do navegador, sem precisar de app nativo.
  • Use os sensores. Inclinar e sacudir pelo movimento do aparelho faz um brinquedo parecer físico. Lembre que o iOS pede permissão, então ative os sensores a partir do toque num botão.
  • Adapte a qualidade, não chute. Meça o tempo de cada quadro, veja se o navegador está só limitando a taxa de quadros, depois reduza a qualidade em pequenas etapas e guarde o resultado.
  • O som deve acompanhar a simulação. Um áudio gerado a partir do que está de fato se movendo soa mais natural que um sample em loop.
  • Facilite a hospedagem. O projeto não tem etapa de build: qualquer servidor de arquivos estáticos consegue hospedá-lo.

Perguntas frequentes

O simulador de areia Sand é grátis?

Sim. A versão web em av.github.io/safe-sand é grátis para jogar no navegador, sem download nem conta.

Sand funciona no PC?

Sim. Arraste com o mouse para empurrar a areia, use as setas ou WASD para inclinar e segure Espaço para sacudir. A versão de celular parece mais natural porque usa os sensores de movimento.

Por que inclinar não funciona no meu iPhone?

O iOS precisa da sua permissão para compartilhar dados de movimento com uma página web. Toque em Pour e permita o acesso ao movimento quando o aviso aparecer.

Sand é um jogo com fases?

Não. É um brinquedo sandbox relaxante. Não tem pontuação, cronômetro nem objetivo; você só desenha, inclina e sacode.

O que é um jogo de areia caindo (falling-sand)?

É um tipo de jogo de simulação em que muitas partículas pequenas, como areia, água ou fogo, seguem regras físicas simples e interagem entre si. Powder Game, The Powder Toy e Noita são exemplos conhecidos.

Quantos grãos o Sand simula?

O criador fala em cerca de 100.000 a 460.000 grãos, dependendo do seu aparelho.

Artigos relacionados

Carregando jogo…

VENOGAME / PLAYBOOK

Minha arena

Salvo neste dispositivo. Sem conta.

Toque em um coração e crie sua coleção.