La pipeline 3D di Dead Cells, passo dopo passo

La pipeline, come l'ha descritta il suo artista

Nel gennaio 2018 Thomas Vasseur, per un anno l'unico artista di Dead Cells in Motion Twin, scrisse per Gamasutra, oggi Game Developer, “Art Design Deep Dive: Using a 3D pipeline for 2D animation in Dead Cells”. I passaggi erano questi:

1. Prima uno sheet di modello in pixel art. Disegnò uno sheet 2D di base del personaggio, poi costruì il personaggio e il suo scheletro in 3D partendo da quello, in 3ds Max, ed esportò in FBX.
2. Modelli molto semplici. Con un personaggio alto nel gioco solo circa 50 pixel, non valeva la pena dedicare tempo a un modello 3D dettagliato.
3. Renderizzare piccolo, senza anti-aliasing. Un programma interno renderizzava la mesh a una dimensione molto piccola senza anti-aliasing, ottenendo l'aspetto pixelato.
4. Animare sui fotogrammi chiave, come in 2D. Gli attacchi erano da posa a posa: prima si temporizzavano le chiavi con meno fotogrammi possibile, e solo dopo si aggiungevano i fotogrammi intermedi prima o dopo una chiave, mai tra le chiavi.
5. Esportare ogni fotogramma con una normal map. Ogni fotogramma veniva salvato come PNG con la sua normal map, così il gioco poteva illuminarlo con un semplice toon shader.

Perché funzionava

Il deep dive ne spiega le ragioni senza giri di parole. Non serviva ridisegnare ogni fotogramma. Una stessa animazione poteva essere riusata su più modelli. Un pezzo di armatura si aggiungeva attaccandolo al modello 3D, non ridisegnando ogni fotogramma in cui compariva. Modelli e parti vecchi venivano riusati per creare nuovi mostri, il trucco più utile del flusso di lavoro secondo lui, che faceva risparmiare centinaia di ore.

Soprattutto, rifare un’animazione costava poco. Quando i programmatori di gameplay cambiavano il tempo di un attacco o rallentavano un’arma, lui spostava le chiavi sulla timeline e renderizzava di nuovo. Con l’animazione disegnata a mano la stessa modifica avrebbe richiesto di ridisegnare tutto, e spesso semplicemente non si faceva.

Fare lo stesso con Pixor

Il renderer di Dead Cells era un programma interno e non è mai stato pubblicato. Pixor è un’app a parte che copre gli stessi passaggi per qualsiasi modello tu abbia, con rig in Blender, scaricato da Mixamo o preso dalla libreria gratuita.

Camera di lato. Nel passo Scena, clicca la camera Sud nella Struttura e imposta Gioco su Platform: una vista laterale rivolta a destra, un solo lato, specchiato per la sinistra. Aumenta larghezza e altezza a 64 o 96 pixel per un personaggio con un'arma; la guida alle dimensioni degli sprite aiuta a scegliere.

Renderizzare piccolo e nitido. Pixor disegna ogni fotogramma sulla griglia di pixel dello sprite, senza bordi con anti-aliasing per impostazione predefinita (--aa 0), con colori limitati alle rampe della palette, una sola scala di pixel per metro per tutti i fotogrammi e un pivot fissato a un pixel, così il personaggio non ondeggia.

Un look, non solo un rendering piccolo. Dead Cells si affidava all'illuminazione e a un toon shader. Nel passo Stile, il preset selout dà bande di luce, rampe con cambio di tonalità e contorni selettivi, con bande che restano stabili da un fotogramma all'altro, così una corsa non sfarfalla.

Da posa a posa. Nel passo Asset, i Fotogrammi tenuti del nodo Sprites mantengono un certo numero di fotogrammi intelligenti, scelti tra le pose della clip, ciascuno mantenuto fino al successivo. È il taglio da posa a posa: gli estremi del movimento restano, gli intermedi morbidi se ne vanno.

Normal map. Aggiungi la normal map all'esportazione (--export normal), oppure il light kit (--export light-kit), che illumina lo sprite a partire dalle sue normali in Godot, Unity o GameMaker mentre ogni pixel illuminato resta sulla propria rampa di colore. Vedi illuminazione fedele alla palette.

Armature e armi. Un oggetto si attacca a un osso: una spada in una mano, un elmo su una testa (--prop sword.glb:hand.r). Ogni clip lo porta con sé.

Riusare le animazioni. Le clip in altri file con lo stesso scheletro si aggiungono con --anim, oppure come file chiamati model@clip.fbx accanto al modello. Le clip della libreria di movimenti, lib:idle, lib:walk, lib:run, lib:attack e le altre, sono adattate a uno scheletro umanoide, quindi un nuovo personaggio ha una corsa e un attacco prima ancora che tu animi qualcosa.

Dalla riga di comando

Il cavaliere qui sopra, come lo produrrebbe uno script di build:

pxr render knight.glb --preset selout --camera platformer --size 96 \
  --clip lib:run --clip lib:attack --smart-frames 8 --export png,json,normal

E il rifacimento: cambia le chiavi della clip nel tuo strumento 3D, o il numero di fotogrammi qui, ed esegui di nuovo la stessa riga. Ogni fotogramma esce alla stessa scala e con lo stesso pivot, quindi il nuovo sheet prende il posto del vecchio. La stessa riga su una cartella di modelli (pxr batch models/ --camera platformer --size 96) dà a un intero cast lo stesso look.

Poi i ritocchi

I fotogrammi di Dead Cells erano rifiniti in 3D. Se vuoi aggiungere dettagli disegnati a mano, Pixor scrive file .aseprite con un tag per azione, e un nuovo render mantiene i livelli che hai dipinto; vedi ritoccare e poi rifare il bake. La storia della tecnica, dagli anni ’90 a oggi, è in sprite pre-renderizzati.