Como a água é montada
Isto é um tile, de 40 por 40 pixels. Ele tem quatro partes: o corpo principal da água, que é só a cor de fundo, o padrão de ondas por cima, o sombreamento entre as ondas para dar profundidade e as luzes nas bordas das ondas.
As cores: um tom médio para a água, um mais claro para as ondas, três tons para o sombreamento e dois tons claros para as luzes.
Passo 1: O padrão de ondas
À primeira vista, o padrão parece aleatório. Olhe de novo: há linhas verticais pelo tile todo e linhas horizontais curvas que ligam umas às outras. Juntas, elas formam as ondas.
Você poderia desenhar o seu, e mais tarde deveria, quantos quiser. Mas na primeira vez é bem mais fácil se todo mundo começar do mesmo padrão, então eu te dou ele como modelo. Por isso ele já vem pronto no treino interativo.
Passo 2: Sombreamento em três camadas
Pegue a sombra mais clara e preencha os espaços dentro do padrão de ondas. Não invente nada, só siga as formas que você recebeu. E também não preencha tudo.
Depois a segunda sombra, por cima da primeira, mas numa área menor, para que a primeira ainda apareça em volta. Depois a sombra mais escura, só alguns pixels aqui e ali. Cada camada menor que a anterior. É isso que dá profundidade à água.
Passo 3: Luzes
Por que a luz fica onde fica? As ondas sobem um pouco acima da superfície, então as pontas pegam a luz do sol por um instante enquanto a água se mexe. Os espaços entre as ondas ficam mais baixos, então recebem menos luz. Por isso são escuros.
Então coloque a luz mais clara ao longo das linhas das ondas, com um pixel de largura em alguns lugares e dois em outros. A água nunca é uniforme. Depois a cor mais clara, de novo numa área menor, só alguns pixels onde está a primeira luz.
De um tile a um mar
Isto é só um tile. Mais para frente no curso, a gente transforma tiles assim em tilesets e tilemaps, para que uma peça pequena cubra um oceano ou um lago inteiro no seu jogo. Veja como na aula de tileset.
Água em outras vistas
A mesma ideia funciona em qualquer vista de jogo. Num jogo de plataforma com vista lateral, a água é uma faixa entre duas margens: uma linha clara em cima, onde a superfície reflete o céu, e alguns pontinhos mais claros embaixo. Em isométrico, ela preenche uma caixa: as paredes do fundo aparecem através da água, e uma grade clara no chão deixa a profundidade legível.
