Eccoci alla seconda parte dell’articolo su come abbiamo creato un gioco a vetrate. Per chi non avesse letto la prima, la trovate qui:
http://www.elfgamesworks.com/2017/03/13/creare-gioco-vetrate-ispirazioni/
Oggi vedremo come è stata realizzata la grafica di Little Briar Rose nel suo aspetto più concreto, in cui gli studi fatti vengono messi in pratica. Inoltre parleremo di alcuni criteri da adottare nel fare degli ambienti adatti ad un videogioco e di come ottenere delle immagini non caotiche nonostante lo stile molto ricco.
Progettare il gioco
Il tipo di gioco che dovevamo creare prevedeva delle schermate fisse e bidimensionali, composte prevalentemente da ambienti naturalistici. Ogni scenario è un disegno indipendente, una mappa in cui il giocatore può muoversi ed interagire con gli elementi.
Prima ancora di iniziare a disegnare, abbiamo concordato le linee guida del gioco che sarei andata a rivestire graficamente.
A livello artistico avevo parecchia libertà. L’aspetto degli ambienti e il come adornarli era a mia discrezione. Tuttavia era necessario che alcuni elementi fossero presenti ai fini della storia e della giocabilità.
Come prima cosa abbiamo studiato su carta la struttura del gioco e le aree necessarie. Nel fare ciò, abbiamo anche steso la storia e le vicende, così da avere tutti i punti chiave decisi.
Anche se minimali, gli appunti visivi sono fondamentali per non ritrovarsi a creare grafiche che non verranno utilizzate o pesantemente da rivedere.
Con la storia ed il gameplay concettualmente pronti, potevo tirare le prime linee di grafica, mostrando i progressi man mano che creavo, così da restare allineati sulle esigenze che si andavano a scoprire in corso d’opera.
Abbozzare la mappa
Da qui in avanti il tutto diventa molto simile all’approccio standard di un qualsiasi disegnatore: si decidono le dimensioni della mappa e si crea una bozza, inserendo tutti gli elementi necessari, aggiungendo anche quelli decorativi.
Prima ho anticipato che ci sono alcune cose da tenere da conto quando si crea grafica per videogiochi, specialmente per un gioco a vetrate. Nel caso di Little Briar Rose, queste sono alcune delle accortezze che ho adottato.
Inserire tutti gli elementi
La prima accortezza è quella di aggiungere, in fase di bozza, anche i personaggi che abiteranno la scena. Seppure i dettagli di questi personaggi potrebbero cambiare nella versione definitiva, essi saranno strettamente integrati nell’ambiente; pertanto vanno studiati assieme ad esso.
Inoltre è meglio avere la grafica del protagonista a disposizione nella scena mentre si lavora, in modo da non sbagliare le proporzioni degli oggetti.
Gli ostacoli
Un’altra accortezza è quella di tenere a mente quali aree del nostro disegno saranno percorribili dal giocatore.
Le strade, i ponticelli ed altri elementi simili avranno un’area percorribile stretta rispetto ad aree più spaziose. Quest’area, però, non deve essere troppo stretta, o il giocatore potrebbe avere delle difficoltà a trovare il punto giusto in cui cliccare per muoversi.
L’approccio da adottare in questo caso è più simile a quello per creare un tabellone da gioco, che un’illustrazione: cercare sempre di immaginare come risulterà in gioco e se sarà intuitivo.
In ultimo: le decorazioni.
Nei punta e clicca, gli ambienti spesso nascondono oggetti utilizzabili o con cui interagire. Il giocatore più esperto sarà portato ad esplorare a fondo l’ambiente.
In Little Briar Rose, ci sono degli oggetti da scoprire esplorando, tuttavia sono solo alcuni e ben specifici. Creare delle mappe stracolme di cianfrusaglie e oggetti curiosi avrebbe confuso il giocatore, rendendo vana la sua ricerca.
Per evitare di costringere il giocatore a cliccare ovunque senza un ritorno in termini di divertimento, ho posto particolare attenzione su che genere di dettagli ed arricchimenti fare alla scena.
Si può notare, infatti, che la maggioranza degli elementi sono naturalistici, quali alberi, rocce, cespugli o rovi. Elementi mai ripetitivi, ma che non avrebbero attirato l’attenzione del giocatore.
In questo modo non sarebbe stato spinto a perdersi in un insieme di grafiche cosmetiche e avrebbe potuto dedicarsi a trovare ciò che spiccava all’occhio, in quell’intreccio di rovi. Aggiungo anche che alcuni oggetti fuorvianti erano del tutto intenzionali, per mantenere interessante la sfida del gioco.
Tutti questi problemi vanno affrontati e risolti in fase di bozza, in modo che poi ci si possa concentrare totalmente sulla resa del disegno.
Cesellare il disegno
La resa dello stile a vetrate di Little Briar Rose non si basa solo sull’abbondare con gli intrecci di linee spesse, ma innanzitutto con la semplicità delle forme. Le persone, le foglie e gli ambienti sono volutamente stilizzati sin dal principio. Questo aspetto prende forma nella bozza ed arriva sino al disegno completo.
Durante il percorso, però, è meglio evitare quel processo di cesellatura delle linee, essenziale per l’effetto vetrata finale. Senza aver concluso il disegno principale, risulterebbe solo d’ingombro.
Una volta ottenuto un disegno convincente e apparentemente giocabile, si può passare alla cesellatura. Il criterio per farlo è quello di tassellare le aree vuote, tracciando delle linee a partire dalle forme spigolose. In seguito si possono suddividere le aree troppo vuote con ulteriori linee.
Nel processo si fa risaltare la superficie degli oggetti scegliendo un motivo da ripetere e stendendolo su tutto l’oggetto in questione. Nel caso degli alberi, ho scelto un motivo slanciato e spigoloso, in modo da ricordare le forme naturali di una corteccia.
Scegliendo dei motivi diversi per ogni tipo di oggetto, si migliora la leggibilità della scena e dei suoi elementi, evitando che questi si vadano a confondere tra loro.
L’immagine deve risultare leggibile innanzi tutto in bianco e nero.
Finito il disegno, si può finalmente passare all’ultima fase: la colorazione.
Da disegno a Vetrata
Un aspetto importante in un gioco a vetrate, che avevamo chiaro sin da subito, erano i colori. Erano fondamentali sia per il soddisfare il desiderio di emulare delle vetrate intense, sia per dare un carattere vibrante e fiabesco al tutto.
Questa fase ci ha preso una settimana piena di sperimentazioni, prima di trovare la tecnica migliore da adottare. In compenso, una volta trovata, la colorazione di un disegno di Little Briar Rose risulta molto più spedita.
Entrando più nel dettaglio, il primo trucco per accelerare la colorazione è quello di creare il disegno direttamente al computer, ma soprattutto utilizzando uno strumento di disegno privo di anti aliasing. Nel mio caso, la semplice matita di Photoshop.
Questo dettaglio è molto importante, perché permette di colorare i segmenti del disegno usando semplicemente il secchiello. I colori da scegliere dovranno essere un po’ più brillanti di quelli che vorremmo ottenere, in quanto dopo si sbiadiranno con una serie di effetti che andremo ad aggiungere.
Una volta colorato tutto il disegno, si va ad alterare il colore di alcune caselle, rendendole a volte più chiare o più scure. Questo crea quella variazione di luminosità molto suggestiva, tipica delle vetrate.
Un gioco a vetrate necessita anche dell’illusione del piombo sul vetro. Per far si che le linee del disegno lo ricordassero, ho creato un’area di selezione attorno ad esse in cui il colore è alterato a creare delle ombre. Per alterarlo ho usato due grosse pennellate in trasparenza, nere sui bordi dell’immagine e bianche su un punto di luce a mia scelta.
In questo modo le linee disegnate smettono di essere piatte e diventano una solida cornice per ogni casella.
Il risultato è ancora molto piatto, perché manca il tocco finale. Qui metto in pratica l’idea suggeritami dalla grafica Kingdom Hearts. Ho scelto una texture marmorea dai motivi adatti e l’ho fusa all’immagine, avendo cura di non schiarire le linee che, invece, desideravo rimanessero nere.
La grafica del nostro gioco a vetrate è infine ottenuta.
Un ultimo tocco di tridimensionalità lo si ottiene salvando gli elementi in primo piano in un’altra immagine, così da permettere al principe di passarvi sotto.
Per quanto riguarda Little Briar Rose, questo trucco è usato ma non abusato, così da rimarcare la superficie piatta di una vetrata.
Conclusioni
Siamo giunti alla fine dell’articolo ed io non ho altro da aggiungere.
Se siete interessati a vedere messo in pratica quanto avete appena letto, vi riporto un video di sviluppo del gioco, dove mostro come ho creato la mappa in questione nella sua interezza.
Quel che penso io di questo stile grafico è che sono soddisfatta di aver trovato una sintesi estetica piacevole, ma non onerosa da creare. In qualità dell’artista che l’ha disegnata, questo è l’aspetto che ho preferito! ;D
Con questa piccola battuta, ci salutiamo. Grazie mille per aver letto fino in fondo e alla prossima!
Ti è piaciuto? Iscriviti alla nostra newsletter per altri articoli o aggiornamenti sui giochi in sviluppo!