L’antialiasing nella pixel art

Cos’è

I pixel sono quadrati, quindi qualsiasi linea che non sia perfettamente dritta o con un angolo netto diventa una scalinata. Su una curva dolce, come il bordo di uno scudo o la sommità di una testa, quegli scalini possono sembrare frastagliati con lo zoom a 1×.

L’antialiasing manuale (spesso scritto AA) ammorbidisce uno scalino mettendo uno o due pixel di un colore intermedio nell’angolo dove la linea salta. L’occhio li fonde, e la curva appare più morbida di quanto i pixel siano davvero. Il colore di solito si prende dalla rampa esistente, a metà tra la linea e ciò che le sta accanto.

È un effetto fatto a mano: pochi pixel scelti, non un filtro su tutto lo sprite.

Quando aiuta

• Curve lunghe e dolci. Un cerchio o un pendio che scende di due o tre pixel alla volta ne beneficia di più.
• Sprite grandi. Da 64 px in su c’è spazio per i pixel intermedi senza perdere dettaglio.
• Linee interne. Le linee tra le parti di uno sprite stanno su colori noti, quindi la tonalità intermedia è facile da scegliere ed è sempre giusta.

Quando evitarlo

• Sprite piccoli. A 16 o 24 px ogni pixel dà forma. Lì un pixel intermedio sembra spesso una macchia o un dettaglio di troppo.
• Il bordo esterno, su sfondi sconosciuti. Una sagoma con antialiasing è mescolata per un solo colore di sfondo. Metti lo sprite su un altro e i pixel morbidi appaiono come un leggero alone.
• Palette molto limitate. Con quattro o otto colori può non esserci una tonalità che stia tra altre due. Allora i gradini restano netti, e fa parte del look.
• Stili marcati e a blocchi. Alcuni giochi vogliono ogni scalino visibile. È una scelta, non un errore.

Errori comuni

• Troppo. Applicare l’antialiasing a ogni scalino fa sembrare sfocato l’intero sprite, come se fosse stato ingrandito con il filtro attivo.
• Lunghezza sbagliata. La serie di pixel intermedi dovrebbe corrispondere allo scalino che ammorbidisce. Un solo pixel alla fine di uno scalino lungo serve a poco; una serie lunga accanto a uno scalino corto crea un rigonfiamento.
• Banding. Allineare i pixel intermedi in una seconda linea parallela fa sembrare il bordo doppio.
• Smussamento del motore. Il filtro bilineare annulla l’antialiasing fatto a mano. Imposta il filtro delle texture su nearest.

Come lo fa Pixor

Pixor disegna linee larghe un pixel senza angoli a L, e ha un’impostazione di antialiasing con tre livelli. 0 lascia nette tutte le linee. 1 ammorbidisce solo la sagoma. 2 ammorbidisce gli angoli di ogni linea, non solo il bordo esterno. Prova 0 per sprite piccoli e sfondi pieni di dettagli, e 1 o 2 per sprite più grandi in cui le curve hanno spazio. L’impostazione fa parte del look nel grafo di Stile, e il manuale delle impostazioni la elenca con le altre opzioni delle linee.

Correlati

• Contorni: le linee che l’antialiasing ammorbidisce
• Selout: contorni colorati che ammorbidiscono già un bordo
• Dimensioni degli sprite: quanto spazio ha uno sprite per i pixel intermedi