Como posso projetar bons blocos contínuos (sem costura)?


33

Tenho problemas para projetar ladrilhos para que, quando montados, eles não pareçam ladrilhos, mas pareçam uma coisa homogênea. Por exemplo, veja a imagem abaixo:

insira a descrição da imagem aqui

Mesmo que a parte principal da grama seja apenas uma peça, você não "vê" a grade; você sabe onde fica se olhar um pouco com cuidado, mas não é óbvio. Enquanto que quando eu projeto blocos, você pode ver "oh, caramba, 64 vezes o mesmo bloco", como nesta imagem:

insira a descrição da imagem aqui (Peguei isso de outra pergunta do GDSE, desculpe; não critique o jogo, mas isso prova o meu ponto.

Eu acho que o principal problema é que eu os projeto para que sejam independentes, não há junção entre dois blocos se colocados juntos. Eu acho que ter os ladrilhos mais "contínuos" teria um efeito mais suave, mas não consigo fazer isso, parece-me excessivamente complexo.

Eu acho que é provavelmente mais simples do que eu acho, uma vez que você sabe como fazê-lo, mas não conseguiu encontrar um tutorial sobre esse ponto específico. Existe um método conhecido para projetar blocos contínuos / homogêneos? (Minha terminologia pode estar totalmente errada, não hesite em me corrigir.)


Vale destacar: na captura de tela que você vinculou, pode haver 2 ou mais blocos de grama aparecendo em um padrão quadriculado. O gatilho Chrono possui uma variedade de telhas de grama .
22812 doppelgreener

1
Eu também sugeriria fazer uma pesquisa rápida para conjuntos de peças do RPG Maker . Eles não são blocos de primeira linha, mas você pode ver alguns exemplos de blocos de transição.
Mike Cluck

Uma coisa que poderia ajudá-lo, além das respostas acima mencionadas, seria usar um editor de pixel art que permita visualizar seus blocos enquanto os desenha. Eu recomendo Pickle: pickleeditor.com
Usuário não encontrado

2
há um outro bom artigo sobre este assunto aqui: gas13.ru/v3/tutorials/sywtbapa_obliterating_grid.php
Tesserex

1
Obrigado, especialmente por este último tutorial, ele respondeu muitas outras perguntas que eu tinha: p
Cristol.GdM 26/12/12

Respostas:


20

Disclaimer: Eu não sou um artista, então esse é apenas o conhecimento artístico do programador.

Você está tendo o efeito de grade no seu exemplo, principalmente por causa daquele pedaço de grama mais leve na borda inferior do ladrilho:

enter image description here

Detalhes como aquele que são facilmente reconhecíveis instantaneamente revelam que você está apenas repetindo o mesmo bloco.

Confira este artigo, que contém muitas dicas úteis sobre o assunto. Em particular, usando o Photoshop:

  • Use a ferramenta Patch para se livrar dos detalhes gritantes.
  • Use a ferramenta Doge ou Burn para obter luminosidade uniforme em todos os lugares.
  • Torne as bordas perfeitas deslocando a imagem e, em seguida, usando a ferramenta Patch para misturar as bordas. Também vi pessoas duplicarem e espelharem a imagem quatro vezes antes para esse fim.

Também na imagem que você vinculou, também parece haver um problema de implementação, porque ao ampliar a imagem, você pode ver algumas lacunas entre os blocos:

enter image description here


3
+1 duplicado e espelho parece funcionar bem para mim, também existem ferramentas que ajudam com isso: aqui está um dos muitos tutoriais - photoshoptextures.com/texture-tutorials/seamless-textures.htm - as palavras-chave são basicamente "texturas sem costura".
Oskar Duveborn

Ok, eu tentei (tutorial de resposta e tutorial de comentários) e os resultados são MUITO melhores, e conhecer o termo "textura perfeita" ajudará no futuro, então obrigado!
Cristol.GdM 26/03

@OskarDuveborn Bom link, a imagem final mostra claramente a diferença que faz!
David Gouveia

15

Não sou especialista, mas além de ter mais de um tipo de ladrilho para grama (não completamente diferente para que as pessoas percebam, mas diferente o suficiente), um truque pode ser ter "ladrilhos de transição" entre dois tipos diferentes de ladrilhos. Usando a imagem de exemplo que você mostrou, ter um bloco meio verde e meio cinza entre o bloco completamente cinza e o completamente verde pode ajudar a suavizar a transição. Além disso, se você fizer essas transições arredondadas e com uma aparência mais natural (uma textura desbotando na próxima), ela poderá ajudar com o efeito.

Observe na imagem do Chrono Trigger, no centro inferior, como ele tem um meio marrom (sujeira), meio verde (grama), com manchas de grama mais escura. Ele também usa grama e pedras mais leves para adicionar variação natural (um ladrilho transparente com a pedra ou grama clara em cima do ladrilho, talvez?)


5
Os blocos de transição +1 são críticos! Uma regra de ouro: faça transições de blocos conforme a necessidade. Você já colocou neve ao lado da grama? Não? Então você não deve ter um conjunto de transições de grama para neve. Você acabou de colocar lava ao lado da sujeira pela primeira vez? Ótimo, é hora de criar um conjunto de blocos de transição para isso.
doppelgreener

11

Você precisa fazer transições; para cada composição possível de vários tipos de peças, você precisará desenhar peças que completem a mudança. Você pode decidir que muitas combinações não são possíveis no seu jogo, pois o número de transições que você precisaria fazer aumentaria facilmente para um número muito grande.

Normalmente, isso significa misturar as qualidades dos tipos de superfície de alguma maneira; uma simples transição de grama para terra, por exemplo, normalmente teria pequenos trechos de grama ficando mais raros à medida que você entra no ladrilho. Mas, para uma solução rápida, você pode simplesmente desbotar uma textura enquanto desbota em outra, ou fazer um pontilhamento onde escolhe aleatoriamente pixels de uma das duas texturas usando a chance ponderada que passa de favorecer uma textura para a outra.

Além disso, eu recomendo que você mude de olhar para azulejos para padrões de sub-mosaico, considere esta imagem de dois ladrilhos; se você, em vez de criar ladrilhos completos, fizer formas correspondentes à figura vermelha, nunca precisará de mais do que duas superfícies diferentes. o mesmo ladrilho, limitando muito o número de ladrilhos de transição que você precisa criar, você poderá então gerar ladrilhos quadrados a partir desses ladrilhos de diamante para uso no jogo, ou simplesmente usar os ladrilhos de diamante diretamente, os computadores não são muito exigente sobre essas coisas mais.

Sub tile marked in red



6

Comece fazendo um ladrilho comum. Em seguida, divida o ladrilho horizontal e verticalmente, em 4 partes iguais, deixando-o com 4 "ladrilhos".

O bloco agora ficará assim:

1 2
3 4

Coloque a peça 2 no lado esquerdo da peça 1. Faça o mesmo com 3 e 4. O ladrilho ficará assim:

2 1
4 3

Agora mova as duas partes inferiores acima das peças superiores. Você fica com isso:

4 3
2 1

Supondo que seu bloco tenha 32 x 32, cada peça terá 16 x 16. Agora você exclui o meio, digamos 22x22 pixels (cabe a você), deixando uma moldura do seu bloco. Esse quadro agora se encaixa perfeitamente em si mesmo e você é deixado preenchendo a lacuna no meio com exclusividade, como cascalho, pedra, grama mais alta ou qualquer outra coisa.

Você provavelmente terá que mexer um pouco os pixels, mas quando tiver seu quadro, poderá produzir muitos ladrilhos exclusivos, mas perfeitamente lado a lado.


0

A maneira como eu desenho meus ladrilhos é assim:

  1. Faça seu bloco de rascunho
  2. copie seu bloco em uma imagem 3 vezes maior nas direções X e Y
  3. copie seu bloco para que haja 9 cópias do seu bloco na imagem
  4. você poderá ver onde cada bloco começa e termina, o que você precisa fazer é usar uma ferramenta de desfoque (eu uso o GIMP para isso) e desfocar as bordas para que pareça com um bloco grande.
  5. Em seguida, copie o bloco do meio da imagem e você terá seu bloco final

O resultado deve parecer muito bom quando você coloca vários blocos ao lado do outro. Você sempre pode repetir esse processo para ajustar suas peças.


1
-1 Na ​​etapa 4, o desfoque não se aplica aos dois lados (por exemplo, o desfoque na parte inferior do bloco intermediário não corresponde ao desfoque na parte inferior do bloco superior), para que seus resultados não sejam perfeitos. O deslocamento é uma ferramenta muito melhor para garantir a uniformidade.
31412 doppelgreener

se você fizer corretamente, parecerá uniforme; se você fizer uniformemente em todas as costuras, ficará bom; se você diminuir a pressão na ferramenta de desfoque, poderá ajustar as bordas para que pareçam uniformes.
John
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.