Criando um efeito de falha semelhante ao Watch Dogs


8

Atualmente, estou trabalhando em um jogo LibGDX. Quando um usuário faz algo errado, eu gostaria que todos os gráficos na tela tremessem de maneira muito semelhante ao efeito de falha / distorção visto no jogo Watch Dogs (veja abaixo).

Minha pergunta é a seguinte: esse efeito pode ser alcançado em tempo real, escrevendo um sombreador? Em caso afirmativo, existem referências on-line sobre como fazer isso? (Eu tive um Google rápido, mas tudo o que pude encontrar é como obter esse efeito no Photoshop / After Effects).

Obrigado pela ajuda.

Tremulação da tela: https://www.youtube.com/watch?v=EYkqC9uI8Nc

Efeito de falha de texto: https://www.youtube.com/watch?v=Wj26Wp2AH-U

insira a descrição da imagem aqui


Provavelmente, isso pode ser conseguido renderizando a imagem em uma textura e, em seguida, dobrando o cérebro para criar o pipeline de processamento do shader para alcançá-lo. A verdadeira questão é: para que você o usaria? Parece mais nas linhas de um projeto de cena demo do que uma habilidade que um programador de jogos deve ter. Claro, não faz mal tentar. Um palpite instruído me diz que a WD conseguiu isso ao reproduzir filmes em Flash em vez de usar shaders sofisticados, como você deseja. Então, se um AAA não faz isso, por que você faria?
Teodron

11
@teodron "A verdadeira questão é: para que você o usaria?" Eu acho que a resposta para essa pergunta "real" pode ser encontrada na pergunta original. "uma habilidade que um programador de jogos deve ter" nem todos se limitam às habilidades que "deveriam" ter. "Então, se um AAA não faz isso, por que você faria?" De muitas maneiras, essa maneira de pensar retarda o progresso. Em conclusão, a única informação relevante que o seu comentário traz é "dobrar seu cérebro para criar o pipeline de processamento do shader para alcançá-lo", o que não é nenhuma informação.
rootlocus

11
Obviamente, o efeito pode ser alcançado em tempo real. Mapas de deslocamento de textura + sobreposições, possivelmente em várias camadas e / ou animadas. É tudo bastante trivial, além do processo de criação de ativos de arte, que pode levar algum tempo.
snake5

3
Parece que o "efeito" que eles usaram nessa imagem específica é escolher aleatoriamente retângulos verticais finos e inverter (inverter) as cores desses retângulos, o que deve ser bastante simples de realizar.
AturSams

11
Eu acho que a questão é muito ampla neste momento. Existem muitos exemplos para um efeito de "falha", dois dos quais nos links fornecidos pelo solicitante e cada um implementado de maneira completamente diferente. Quais são os seus requisitos precisos? Você precisa saber o que deseja fazer antes de começar a fazê-lo, ou as respostas que você obterá neste caso são de um shader.
AturSams

Respostas:


6

A criação do visual glitchy pode ser realizada de várias maneiras. Em essência, o que estamos acostumados culturalmente a aceitar como uma falha é tudo o que é uma distorção repentina do que de outra forma seria um conteúdo coerente. Algumas falhas se encaixam bem com a transmissão analógica (ou seja, ruído branco) e outras se encaixam bem com displays digitais, símbolos aleatórios de ascii, texto oscilante, artefatos (como os retângulos negativos). Tirar as três camadas de cor fora de foco (é chamado de sangramento e) lembra mais as telas de CRT. Você também pode adicionar algumas ondas verticais de alta amplitude temporariamente.

Para fazer aparecer caracteres ASCII aleatórios:

  1. Você pode copiar a sequência de texto original e modificar rapidamente aleatoriamente alguns dos caracteres.
  2. Você pode usar uma planilha como esta e simplesmente colocar aleatoriamente sprites de caracteres, removendo-os logo depois para fazê-los piscar na tela de uma maneira imprevisível.
  3. Para fazer a imagem negativa, o que você sugeriu funcionaria. É essencialmente um XOR entre o texto e os retângulos de ruído (se branco é verdadeiro e preto é falso).

2
Como você disse, ajustar é essencial aqui, porque é um efeito artístico e não se enquadra na categoria "trabalho" / "não trabalho".
AturSams
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.