Oggigiorno, tra esperienze in realtà virtuale sempre più accessibili al pubblico e fotorealismo sempre più avanzato (vedere per credere), parlare di grafica applicata al videogioco sembra quasi una banalità, nonché un vero e proprio pomo della discordia tra chi la reputa unico metro di paragone per i videogiochi sul mercato (o in procinto di esserlo) e chi considera inutile se non addirittura volgare discuterne, focalizzandosi esclusivamente sul gameplay ed sull’esperienza di gioco. In realtà la grafica è da sempre intrinseca alla natura stessa del videogioco: d’altronde quel “video” qualcosa dovrà pur dire. Inoltre la grafica è da sempre l’elemento di primo impatto quando si avvia un videogioco a noi nuovo, nonché il frutto del compromesso tra le scelte stilistiche degli artisti e quelle progettuali degli ingegneri, spesso dettate dalle varie limitazioni tecniche. Quindi, perché non parlarne costruttivamente, cercando di offrire a chiunque gli elementi di base per poterne discutere.
![CRT grafica](https://www.thewisemagazine.it/wp-content/uploads/2017/08/crt_digram.gif)
In principio fu il CRT
In questa prima parte, prima di parlare espressamente di grafica, occorre prima parlare del dispositivo che permette di farcela vedere: lo schermo. Da quando l’informatica come da noi comunemente concepita è iniziata a svilupparsi negli ambiti scientifici e militari a partire dal secondo dopoguerra, è risultato necessario implementare un metodo per poter interfacciare i calcolatori all’uomo e permettere a quest’ultimo di poterne apprezzare elaborazioni e risultati in maniera chiara e in tempi più celeri rispetto alla carta. L’unico strumento disponibile all’epoca per tale scopo era il tubo a raggi catodici o in breve CRT (Cathode Ray Tube), utilizzato fino ad allora per gli oscilloscopi. Brevemente, un CRT è composto da un emettitore di un fascio di elettroni pilotabile attraverso campi elettrici e che viaggia attraverso un tubo a vuoto verso uno schermo fosforescente, monocromatico per gli oscilloscopi o tricromatico (rosso, blu e verde) per le TV e i monitor di uso comune fino a un decennio fa: grazie alla fosforescenza è possibile mantenere sullo schermo un’immagine apprezzabile dall’occhio umano che non svanisce alla fine dell’emissione del fascio, ma che persiste su di esso per qualche frazione di secondo.
![tennis for two grafica](https://www.thewisemagazine.it/wp-content/uploads/2017/08/Tennis_For_Two_on_a_DuMont_Lab_Oscilloscope_Type_304-A-300x266.jpg)
Non a caso uno dei primissimi videogioci come da noi intesi, ossia visibili su uno schermo e controllabili attraverso una periferica dedicata, è stato Tennis for Two, creato dal fisico William Higinbotham nel 1958 a partire da un elaboratore analogico per il calcolo delle traiettorie missilistiche e uno schermo di un oscilloscopio. L’utilizzo dei CRT dedicati all’output visivo dei calcolatori continuò però per una strada tutta sua. I CRT degli oscilloscopi erano studiati per visualizzare solo forme d’onda: erano molto veloci nel refresh dell’immagine a schermo, ma erano anche molto costosi e delicati. Inoltre l’emettitore di elettroni poteva raggiungere liberamente qualsiasi fosforo sullo schermo, pecularietà eccessiva se si trattava di visualizzare solo caratteri alfanumerici o al più qualche semplice figura geometrica. È bastato, attraverso dei magneti, far percorrere al fascio d’elettroni un pattern prefissato che coprisse tutta la superficie dello schermo riga per riga e da ripetersi costantemente, facilitando così la trasmissione dell’immagine dall’elaboratore allo schermo: nacque così la tecnica raster scan, o semplicemente raster (che in inglese è il nome dello strumento per tracciare pentagrammi su carta).
[restrict userlevel=”subscriber”]
![](https://www.thewisemagazine.it/wp-content/uploads/2017/08/Raster-scan.svg-300x233.png)
Il mondo in pixel
L’immagine veniva suddivisa in linee orizzontali chiamate scan lines e trasmesse ad una ad una al CRT, ma se mentre per la TV bastava questo, per i computer era necessario anche specificare una posizione definita su schermo dove mostrare i caratteri. L’opzione più semplice era quella di suddividere logicamente lo schermo anche verticalmente, creando così un reticolato nel quale ogni elemento era puntabile con coordinate precise: è l’inizio della grafica raster o grafica bitmap, che tuttora predomina anche con gli odierni schermi piatti, LCD, plasma o OLED che siano. L’elemento unitario è la singola casella del reticolato, detto pixel (picture element), al quale viene o associato un valore binario acceso/spento in caso di grafica monocromatica o un colore nel caso policromatico. Quest’ultimo veniva rappresentato in maniera diversa a seconda del sistema: per i vecchi sistemi a massimo 256 colori, si associava a ogni pixel l’indice del colore da una palette (tavolozza) localizzata in una porzione di memoria; per i sistemi odierni a milioni di colori a ogni pixel si associa direttamente il colore, codificato secondo metodi diversi, dei quali quello più noto è l’RGB (Red Green Blue).
![RGB raster grafica](https://www.thewisemagazine.it/wp-content/uploads/2017/08/images.duckduckgo.com_-266x300.png)
La rappresentazione in bitmap di un’immagine è caratterizzata da due proprietà: la risoluzione e la profondità. La prima è definita attraverso il numero di righe e di colonne di cui la griglia è composta, la seconda attraverso il numero di bit usati per indicare il colore di un singolo pixel. Oggi non è più un problema, ma durante le scorse decadi l’utilizzo della grafica raster “semplice” significava un notevole esborso in termini di memoria. Per fare un esempio: molti home computer degli anni Ottanta avevano una risoluzione o di 256×256 pixel, oppure stretchata a circa 320×200 pixel per le TV a schermo rettangolare 4:3, dunque in entrambi i casi parliamo di oltre 64.000 pixels. Con una raster semplice sarebbero serviti circa 8 KB di memoria solo per una grafica monocromatica, circa 32 KB per una grafica a 16 colori (palette a 4 bit) e circa 64 KB per una grafica a 256 colori (palette a 8 bit). In quegli anni tutta questa memoria utilizzata solo per l’immagine a schermo era uno sproposito spesso impossibile da concedere, a maggior ragione per il fatto che i chip grafici non avevano in media una memoria dedicata, ma condividevano la RAM con la CPU e i sistemi in vendita avevano 32 o 64KB di RAM, la maggior parte di essa occupata dal sistema operativo.
![apple ii grafica testuale](https://www.thewisemagazine.it/wp-content/uploads/2017/08/FPGA-FDEDL-300x241.jpg)
Caselle, piastrelle e folletti
Come è stato possibile allora giocare a tutti gli storici videogiochi negli anni Settanta, Ottanta e nei primi anni Novanta? Come è stato possibile utilizzare i computer di quelle decadi che avevano RAM di 16, 8 o addirittura miseri 4 KB come l’Apple II per farci tutto il resto? Ovviamente con tanti escamotage per utilizzare la memoria nel modo più efficiente possibile.
Per quanto concerne il solo testo in monocromatico per ogni terminale possibile, l’idea di base fu quella di separare logicamente lo schermo non in singoli pixel, ma in caselle di dimensione fissa nelle quali poteva essere visualizzato un solo carattere. Tutti i caratteri erano salvati in una porzione di memoria con la corrispettiva rappresentazione digitale su schermo in dot matrix (matrice di punti, come quelli di una telescrivente): a ogni casella-schermo corrispondeva una singola locazione di memoria dedicata per la visualizzazione, nel quale veniva memorizzato solo il riferimento al carattere designato, non la sua rappresentazione su schermo. Questo metodo fu chiamato text mode e fu lo standard per tutti i calcolatori dell’epoca. Il vantaggio in termini di memoria risparmiata fu incredibile: riprendendo l’esempio di prima, per uno schermo da 256×256 pixel, diviso in caselle da 8×8 pixel, sarebbe bastato poco di un kilobyte, al contrario degli otto di partenza, per poter visualizzare su schermo 32 righe di 32 caratteri ognuna a partire da un alfabeto di 128 caratteri (quanti quelli della codifica ASCII). Inoltre, siccome non tutto lo schermo veniva occupato da caratteri, la memoria effettivamente utilizzata era ancora minore.
![Rogue grafica testuale](https://www.thewisemagazine.it/wp-content/uploads/2017/08/17943bf30a7a3da80430879211e8d449-300x139.png)
Il text mode venne utilizzato anche per la programmazione di videogiochi conosciuti oggi come text-based, alcuni di essi divenuti storici: i primi episodi della saga di Ultima, Adventure, Zork o Rogue. In questi giochi la grafica non era altro che una serie di caratteri a schermo, con i quali si provava a fargli dare forme e movimenti riconoscibili. Un altro esempio di giochi text-based erano le avventure testuali, antenate delle avventure grafiche e degli interactive drama odierni: erano semplicemente del testo che descriveva l’ambiente di gioco seguito dall’inserimento di alcuni comandi base (guardati intorno, prendi la chiave, apri la porta, etc.) da parte del giocatore. Il text mode inoltre consentiva anche di utilizzare il colore, sia del carattere che dello sfondo, attraverso l’implementazione di attributi per ogni singola casella, ma sempre con opportune ottimizzazioni dello spazio in memoria.
Questo per il testo, ma per le immagini? Se il trucco delle caselle ha funzionato per il testo, qualcuno avrà pensato: «Perché non utilizzarlo anche per la grafica?». E infatti, lo stesso concetto di separazione in caselle fu adottato anche in tutte le console e computer casalinghi degli anni Ottanta, sia per il disegno artistico che per i videogames, ma con qualche accorgimento. Lo schermo veniva diviso in una tilemap (“mappa di piastrelle”) tutte della stessa grandezza, solitamente di 8×8 o 16×16 pixel, dove ogni piastrella era composta da una porzione d’immagine memorizzata nella ROM del gioco e/o da una combinazione di colori. Per variare un elemento della griglia si doveva solo indicare, nella locazione di memoria corrispondente, il disegno da utilizzare e la combinazione di colori. L’utilizzo della tilemap permetteva quindi sia di “riciclare” praticamente all’infinito porzioni di schermo ripetute (ad esempio gli sfondi) sia di utilizzare in modo parsimonioso la palette dei colori: per ogni tile era infatti associata una ristretta gamma di colori, quasi mai più di quattro. In questo modo ad esempio per rappresentare lo screenshot di Super Mario Bros. in figura, risoluzione 256×240 pixel divisi con una tilemap da 8×8 pixel a piastrella, ognuna con un solo colore e disegni da un byte ciascuno, bastava poco più di un kilobyte di RAM: un gran bel risparmio.
![super mario bros tilemap grafica](https://www.thewisemagazine.it/wp-content/uploads/2017/08/ScreenShot181-300x286.jpg)
Un’altra caratteristica fondamentale delle tilemap era il poter scorrere attraverso lo schermo attraverso il cosiddetto scrolling (“scorrimento”, appunto): la tilemap era chiusa ai lati, quindi durante lo scrolling ciò che usciva da un lato dello schermo rientrava in seguito da quello opposto oppure veniva aggiornato dalla tilemap della schermata seguente, precaricata in memoria. La tilemap può muoversi in blocco, utilizzando quindi due soli registri di memoria per lo spostamento lungo i due assi cartesiani, oppure può essere divisa in rettangoli più piccoli, a volte larghi anche un solo pixel, liberi di muoversi indipendentemente gli uni dagli altri, ma al costo di maggiore memoria. Lo scrolling divenne lo standard de facto per tutti i videogames dell’epoca, dai platform ai picchiaduro, dagli sportivi ai giochi di ruolo.
Gli svantaggi dell’utilizzo della grafica tilemap “semplice” consistevano nella limitazione dei colori a schermo e nell’impossibilità di poter rappresentare alcunché a cavallo delle stesse. Per il primo bisognava per forza accontentarsi per evitare di occupare troppa memoria, sebbene alcuni home computer dell’epoca permettevano dei compromessi: ad esempio, il Commodore 64, che visualizzava una schermata a 320×200 pixel, utilizzava una doppia modalità di tilemap, una da 8×8 pixel a due colori per piastrella, ed una da 4×8 pixel a quattro colori per piastrella, che era la modalità utilizzata dalla quasi totalità dei giochi dato che donava una resa a schermo più piacevole al giocatore nonostante la risoluzione dimezzata (c’è chi riesce tutt’oggi a creare discreta pixel art col C64).
![ik commodore grafica tilemap](https://www.thewisemagazine.it/wp-content/uploads/2017/08/IK-C64-Screens-Karate-C64-01-300x188.jpg)
Il secondo problema, quello di non poter disegnare nulla a cavallo delle tiles, invece rappresentava un forte ostacolo per una delle necessità primarie nei videogiochi, quella di muovere sullo schermo degli oggetti (personaggi, nemici, etc.). La soluzione fu, neanche a dirlo, un rifacimento della grafica a piastrelle, questa volta pensata su più livelli: siccome gli oggetti di gioco sono indipendenti dallo sfondo durante il gioco stesso, s’è pensato di separare la creazione delle varie entità a schermo. I personaggi e gli oggetti di gioco venivano sempre rappresentati come una o un insieme di piastrelle con le opportune combinazioni di colori, ma potevano essere spostati liberamente sullo schermo attraverso l’indicazione di coordinate cartesiane. Stava poi all’hardware grafico del calcolatore “fondere” sulla stessa schermata sfondo e oggetti e visualizzare l’immagine finale a schermo. Nacquero così gli sprites (“folletti”), e fu uno dei passi fondamentali nello sviluppo dell’industria videoludica.
Come detto, gli sprites erano composti da una o più tiles, localizzate nella ROM del gioco e solitamente più dettagliate rispetto alle tiles dello sfondo, che messe insieme formavano un’entità riconoscibile. A ogni elemento di gioco veniva associato il suo sprite che, esattamente come per le tiles, poteva essere riutilizzato per tutti gli oggetti di gioco simili, ad esempio un certo tipo di nemico. Per donare poi al personaggio un’illusione di movimento, ad esso veniva associato sprites diversi che si alternavano a schermo, alla strenua di un cartone animano; particolare dettaglio veniva dato agli sprites per le animazioni di vittoria o di sconfitta.
![pacman sprite grafica](https://www.thewisemagazine.it/wp-content/uploads/2017/08/CHPP5WaVIAAEdbA-300x300.png)
Ovviamente, l’utilizzo degli sprites implicava uno sforzo computazione e di risorse non irrisorio, ragion per cui il loro utilizzato era totalmente precluso alle macchine con meno di 8 KB di memoria totale. Inoltre il loro utilizzo doveva essere centellinato per evitare degli overflow di memoria che avrebbero reso il gioco infruibile e potuto danneggiare le macchine. Infatti, una delle “unità di misura” per la capacità grafica di una macchina era il numero massimo possibile di sprites su schermo contemporaneamente. Ma i vantaggi del loro utilizzo erano notevoli sia in termini di resa a schermo che nella programmazione, principalmente per la loro riusabilità. Grazie agli sprites era infine possibile la cosiddetta tecnica del palette swapping (“scambio di tavolozza”), ovvero il “riciclo” degli sprites per più di un’entità di gioco, sostituendo solo i colori associato; essa veniva utilizzata sia per i giochi con più di un giocatore umano (chi ha detto Luigi?) che per i nemici (principalmente nei giochi di ruolo come i primi Dragon Quest e Final Fantasy).
![asteroids grafica vettoriale](https://www.thewisemagazine.it/wp-content/uploads/2017/07/asteroids-100421951-orig-300x201.png)
La futile resistenza vettoriale
La grafica raster come detto presentava sia problemi in termini di memoria che in termini di risoluzione: un immagine raster ha sempre una grandezza fissa, se essa viene ingrandita la proporzione in termini di pixel rimarrà sempre la stessa, ma si ingrandiscono tutti i singoli pixel (il comunemente noto effetto “pixelato”). Inoltre ai tempi con la grafica raster “semplice” non era possibile donare un effetto tridimensionale all’immagine (i vari artifici per riuscirci verranno spiegati nella prossima puntata). Per questi motivi alcuni sviluppatori di videogiochi da sala tentarono di rinunciare alla grafica raster e di ritornare alle origini, utilizzando CRT con fascio di elettroni pilotabile ovunque su schermo che potessero tracciare linee in ogni direzione e non solo orizzontalmente. L’immagine finale che ne risultava a schermo era più nitida e definita nei contorni, inoltre l’utilizzo della posizione del pennello elettronico come punto di fuga prospettico donava all’immagine un relativamente convincente effetto tridimensionale.
![tempest grafica vettoriale](https://www.thewisemagazine.it/wp-content/uploads/2017/08/Arcade-atari-tempest1-225x300.png)
Questa tipologia di grafica è chiamata vettoriale, poiché l’elemento unitario che la compone è appunto un vettore geometrico, con cui è possibile descrivere punti, linee e poligoni. Per essere rappresentata su schermo però necessitava per l’appunto di un CRT come quello degli oscilloscopi, più costoso e meno robusto rispetto al raster, e inoltre poteva al massimo rappresentare su schermo linee o di un solo colore o di una pochissima schiera di colori, non più di quattro. Alcuni titoli in grafica vettoriale come Asteroids o Tempest però ricevettero molto successo nelle sale giochi di un tempo (ne è stato fatto un breve cenno nell’articolo sull’emulazione). Ci fu anche un tentativo di portare nel mercato casalingo degli anni Ottanta il vettoriale con il Vectrex, creato dalla piccola Smith Engineering e composto da uno schermo CRT monocromatico a 9 pollici, con i giochi venduti in cartucce ROM e con degli overlays in acetato trasparente da apporre sopra lo schermo per donare un tocco di colore all’esperienza di gioco. Tuttavia, non fu esattamente un successo commerciale.
![Vectrex grafica vettoriale](https://www.thewisemagazine.it/wp-content/uploads/2017/08/vectrex2-225x300.jpg)
La grafica vettoriale viene però tuttora utilizzata in svariati ambiti, dall’acquisizione di immagini da satelliti al disegno tecnico assistito al computer (AutoCAD e affini). L’immagine elaborata da questi software viene però sempre rappresentata a schermo come un’immagine raster attraverso un processo chiamato rasterizzazione.
[/restrict]