Pixel art isometrica

Cos’è

I giochi isometrici mostrano il mondo dall’alto e di lato, lungo una diagonale, senza prospettiva: le linee parallele restano parallele e le cose lontane non sono più piccole. I pavimenti diventano rombi, e i muri si allontanano con due pendenze uguali.

Nella vera proiezione isometrica quelle pendenze sono a 30° dall’orizzontale. La pixel art usa quasi sempre una pendenza leggermente più piatta, in cui ogni linea avanza di due pixel in orizzontale e uno in verticale. Quella pendenza è di circa 26.6°, e di solito si chiama isometrica 2:1 (a rigore è una proiezione dimetrica).

Perché 2:1

Su una griglia di pixel, una linea sembra pulita solo quando i suoi gradini si ripetono in modo regolare. Una linea 2:1 è una scalinata perfetta: due pixel, gradino, due pixel, gradino. Una linea a 30° non ha uno schema così semplice e risulta in sequenze irregolari di uno e due pixel, che appaiono seghettate.

2:1 rende semplici anche i tile. Un tile del pavimento è un rombo largo il doppio di quanto è alto, per esempio 32×16 o 64×32, e i tile si incastrano senza spazi.

Gli angoli di camera

Se renderizzi dal 3D, la camera dovrebbe essere ortografica (senza prospettiva), ruotata di 45° attorno al modello così da guardare lungo una diagonale, e inclinata in basso di 30°. Con quell’inclinazione, un tile quadrato del pavimento si proietta in un rombo largo esattamente il doppio della sua altezza, così i bordi del pavimento cadono su linee 2:1 pulite. Un’inclinazione più ripida o più piatta dà altri rapporti che non si allineano altrettanto bene.

Errori comuni

• Pixel doppi sulle linee. Una linea 2:1 dovrebbe essere esattamente di due pixel per gradino. Sequenze di tre, o pixel impilati sul gradino, fanno sembrare spessi i bordi.
• Mescolare gli angoli. Un edificio a 2:1 e un altro con una pendenza più ripida rompono la griglia.
• Dimenticare l’altezza. I bordi verticali restano verticali. L’altezza su una griglia 2:1 si misura in pixel interi; scegli quanti pixel è alto un metro e mantienilo.
• Camere prospettiche. Renderizzare in prospettiva fa convergere le linee, e i tile smettono di combaciare.

Come disegnarlo a mano

1. Disegna un rombo di tile su linee 2:1, per esempio 32×16.
2. Costruisci gli oggetti come parallelepipedi su quella griglia: sommità a rombo, lati verticali.
3. Ombreggia diversamente i due lati visibili: uno illuminato, uno in ombra.
4. Tieni ogni bordo inclinato sulla scalinata 2:1.
5. Disegna prima i personaggi nelle quattro direzioni diagonali; aggiungi le altre quattro se servono.

Come lo fa Pixor

In Pixor ogni lato è una camera. La vista isometrica usa un’impostazione 2:1, e puoi anche scegliere viste laterali, di tre quarti o dall’alto, o impostare qualsiasi inclinazione. Anelli da 4, 8 o 16 camere danno ogni direzione. Con un unico valore fisso di Pixel/m sulle camere, edifici, oggetti di scena e personaggi vengono renderizzati in proporzione sulla stessa griglia.

Correlati

• Dimensioni degli sprite: tile e personaggi
• Contorni
• Direzioni e il manuale della scena