Come posso creare un effetto "fiammeggiante" come nella schermata del titolo di Ocarina of Time?

102

Vorrei ricreare un effetto fiammeggiante come quello del logo nella schermata del titolo del gioco N64 "The Legend of Zelda: Ocarina of Time", mostrato di seguito:

Una rapida occhiata alle trame utilizzate nella ROM fornisce una singola trama 32x32 che assomiglia all'effetto ma non so come quell'immagine (supponendo che sia quella giusta) venga trasformata nell'effetto visto sul logo.

Come posso implementare qualcosa di simile?

graphic-effects

— nathanburns
fonte

Ho leggermente modificato la tua domanda per chiedere come ottenere un effetto simile, dal momento che non consideriamo le domande che pongono come altri giochi hanno implementato risultati specifici sull'argomento.

— Josh

Stai chiedendo una tecnica procedurale o anche semplici effetti predefiniti?

— Bálint,

Non ho il tempo e le conoscenze per scrivere una risposta completa, ma forse potrebbe essere fatto tramite il ciclismo a colori .

— Alexandre Vaillancourt

@JoshPetrie Grazie, è quello che stavo davvero

— cercando

Da ciò che ricordo della tecnica, la parte difficile deriva dalla creazione dell'immagine con i pixel utilizzando la tavolozza appropriata, non i colori in sé. Il ciclismo viene eseguito in codice su un sottoinsieme dei colori.

— Alexandre Vaillancourt

Risposte:

248

Per prima cosa crea una maschera bianca su nero del tuo logo / testo e sfuocala.

Quindi crea una texture di rumore solido ripetibile (piastrellabile) (GIMP usato qui)

Usa il filtro Mappa-> Affianca ... per creare un motivo affiancato 3x3 (in questo esempio, 128x128 x 3 = 384x384) per il passaggio successivo per assicurarci che la nostra trama sia ancora ripetibile - manterremo solo la parte centrale.

Usa Sfocatura-> Sfocatura movimento ... per sfocare la trama verso l'alto e mantenere solo il centro 1/3 (torna a 128x128)

Moltiplica entrambe le trame insieme sulla GPU e usale per l'opacità.

Quindi animalo spostando la trama del motivo verso l'alto sopra la trama della maschera:

Fatto per la parte animata.

Quindi puoi applicare una mappa sfumata (nero -> rosso -> giallo -> bianco) per dargli i colori del fuoco:

Altri colori possono essere usati per creare un fuoco orribile blu, un campo di aura giallo chiaro, un effetto più fumoso, ecc.

Ora, se si combina questo come additivo sul logo e sul rendering 3D, si ottiene l'effetto desiderato:

+ + =

L'effetto può essere oscurato regolando la maschera e / o la luminosità del motivo e / o il colore del vertice e / o la mappa dei colori del gradiente al livello progettato.

Puoi anche usare due motivi strutturati insieme (Maschera * Schema fuoco * Schema fuoco) a diverse velocità e direzioni per creare un effetto fuoco più complesso.

Tecnicamente sull'N64 potrebbero aver creato un'approssimazione della maschera usando una trama triangolare e il colore del vertice invece della trama della maschera a causa della limitazione hardware dell'N64 relativa alle trame, ma il risultato finale è lo stesso ((colore del vertice * trama del motivo) vs ( trama maschera * trama motivo)).

Possiamo ancora usare il colore dei vertici, ma 20 anni dopo possiamo semplificarci la vita e usare solo 2 o più trame, anche le GPU mobili di oggi possono gestire una trama grigia extra 256x128 senza problemi.

— Stephane Hockenhull
fonte

Penso che abbiamo un vincitore - grazie @StephaneHockenhull, questo è esattamente il tipo di tecnica che stavo cercando

— nathanburns

Vacca santa questa è una buona risposta!

— John Gordon,

"orribile" o "spettrale"?

— CJ Dennis,

Ha anche il significato "terribile in apparenza". "Non indossare quella cravatta, è orribile". Ho interpretato la tua frase come "Altri colori possono dare un effetto davvero cattivo o fumo". "Ghostly" è inequivocabile, anche se non è forte come vorresti.

— CJ Dennis,

Vorrei poterti dare un secondo voto per il disegno del cavallo più serio.

— riconoscitore

Ci sono alcuni modi in cui potresti farlo ma dalla parte superiore della mia testa,

1) Avere le fiamme + il logo tutto in un'unica immagine e essenzialmente sprite il foglio per animarlo.

2) Rendering del logo in un livello UI e posiziona alcuni effetti particella del livello UI attorno ad esso.

Dagli sguardi di quell'immagine, sembra che ci siano 3 livelli di scudo e spada, fiamme, testo (ordinati da dietro a davanti).

Ci saranno molti modi per ottenere un effetto simile, che hai scelto dipenderà dal motore in cui stai sviluppando e da ciò che sei in grado di implementare.

— unknownSPY
fonte

Se le ROM includono una trama a fiamma piccola, allora immagino che ciò avvenga con un qualche tipo di effetto particellare.

Questo sarebbe fatto mettendo prima uno sprite sullo schermo per il titolo e il logo. Quindi posiziona un numero di emettitori di particelle che creano un effetto fiamma dietro lo sprite del titolo. Cioè, la loro profondità Z / schermo è tale da renderizzare dietro il titolo.

Ecco un esempio dell'uso degli effetti particellari di GameMaker per creare fiamme che potrebbero farti riflettere sul potenziale di questo approccio ...

http://martincrownover.com/gamemaker-examples-tutorials/particles-fire/

— Tim Holt
fonte

Grazie per il suggerimento: supponendo che la trama non fosse come quella del tutorial a cui ti sei collegato ma che invece ha riempito lo spazio 32x32 senza trasparenza, c'è un modo ovvio per farlo con le particelle?

— Nathanburns,

Crearei la mia trama fiamma per la particella se l'originale non ha una trasparenza. La mia ipotesi qui è che a meno che il titolo originale non sia fatto con uno sprite animato completo (che include l'effetto fiamma), è probabilmente un effetto particellare.

— Tim Holt,

@TimHolt Forse stai sopravvalutando le capacità hardware del Nintendo 64. Generare un effetto fiamma "solido" in questo modo avrebbe probabilmente richiesto molte più particelle di quante l'hardware fosse in grado di eseguire il rendering.

— duskwuff,

@duskwuff: vero, ma non penso che l'utente lo stia implementando su hardware vecchio. La risposta è ancora valida per qualsiasi sistema decente (moderno).

— Tim Holt,

@duskwuff la domanda è come implementarla ora. Le domande (e le risposte) su come altri giochi hanno fatto qualcosa sono fuori tema qui. Le capacità hardware dell'N64 sono irrilevanti qui. (Vedi il commento di Josh Petries alla domanda)