Magazine Architettura e Design

Tutorial Photoshop: introduzione alla Pixel Art

Da Iwebdesigner @Iwebdesigner_it

Tutorial Photoshop: introduzione alla Pixel Art

Ai tempi della gloriosa flotta Commodore, la sua principale ammiraglia Amiga proponeva una suite software (prodotta da Electronic Arts) che avrebbe fatto la gioia dei digital artists in erba come il sottoscritto: Deluxe Paint. Le principali funzioni di disegno e animazione erano l’antipasto di ciò che sarebbero poi diventati Photoshop e Flash. Il problema risiedeva chiaramente nella scarsità di risorse hardware (specialmente la ram), che rendeva complicato sviluppare filmati di una certa lunghezza e spessore artistico. Nonostante i problemi, Deluxe Paint rimaneva una grande risorsa di creatività, permettendo un approccio intuitivo (e didattico) a quella che sarebbe poi diventata, concettualmente, la Pixel Art. È curioso riflettere su come ciò che prima veniva visto come un limite tecnico (disegni ricavati da palette poverissime con pixels enormi), ora venga emulato con software evoluti e specializzati nel trattamento di immagini in alta risoluzione.

Dopo questi brevi cenni storici, passiamo alla pratica della Pixel Art su Adobe Photoshop. Come prima cosa, apriamo un un nuovo documento da 300×300 pixels, a 72 dpi. Selezioniamo lo strumento Matita dal pannello Strumenti, colore nero, e settiamo il Diametro a 1 px. Ingrandiamo la finestra al 600% e iniziamo ad accostare pixel su pixel diagonalmente, come da immagine.

Tutorial Photoshop: introduzione alla Pixel Art

Questo sistema ci permette di realizzare, per esempio, dei patterns perfettamente regolari. Proviamo a realizzare diverse inclinazioni del segmento.

Tutorial Photoshop: introduzione alla Pixel Art

Ovviamente dovremo lavorare a un livello di zoom piuttosto alto, per avere un controllo sul flusso del segno e per non dover prenotare celermente una visita dall’oculista. Con questo sistema, è possibile iniziare a concepire diverse forme, dalle più semplici alle più complesse, a seconda del grado di confidenza che abbiamo con il disegno e il colore. Proviamo a disegnare un tronco d’albero in prospettiva isometrica, come se ne vedevano nei videogame dei primi anni ’90. Procediamo per fasi: nella prima, limitiamoci a disegnare il perimetro della sezione circolare e le due diagonali.

Tutorial Photoshop: introduzione alla Pixel Art

Copiamo il perimetro circolare in un altro livello (Ctrl+C e Ctrl+V dopo averlo selezionato con la bacchetta magica). Per spostare le diagonali, selezioniamole con la Bacchetta Magica (Tolleranza 20), avendo cura di disattivare l’Anti-alias dal checkbox in alto, e poi trasciniamole una per una selezionando lo strumento Sposta (Shift+V) dal pannello strumenti e usando i tasti freccia della tastiera. Infine accostiamo il secondo perimetro circolare per formare un cilindro, per poi tagliarne la parte interna con Canc dopo averla selezionata col Lazo. Uniamo i livelli, selezionandoli con Ctrl dal pannello livelli e clickando Ctrl+E.

Tutorial Photoshop: introduzione alla Pixel Art

Ora procediamo con la colorazione della sezione del tronco utilizzando i seguenti esadecimali: #e5aa10 per i cerchi concentrici interni alla sezione circolare, #f6d99f per il legno della sezione, #b59b5e per i bordi ombreggiati della sezione accanto al perimetro.

Tutorial Photoshop: introduzione alla Pixel Art

Scolpiamo col chiaroscuro l’intero tronco utilizzando i seguenti esadecimali: per l’ombra più scura #765506, per quella leggermente più chiara #906e27, quella neutrale #b39b5f, e quella più chiara (pochi punti) #d2b154.

Tutorial Photoshop: introduzione alla Pixel Art

Spostiamo l’ingrandimento al 100% per vedere l’effettiva resa della nostra piccola creazione.

Tutorial Photoshop: introduzione alla Pixel Art

Per finire, salviamo la nostra immagine in formato .gif.

Nel prossimo tutorial inizieremo a disegnare alcuni piccoli personaggi.

Per questo articolo ho utilizzato come fonte alcuni ottimi consigli da questo sito.

Alla prossima!


Potrebbero interessarti anche :

Ritornare alla prima pagina di Logo Paperblog

Possono interessarti anche questi articoli :

  • Divertenti illustrazioni con Photoshop

    Divertenti illustrazioni Photoshop

    Essere un Web Designer impone saper usare ad arte Photoshop. Io adoro questo programma e quello che permette di fare. Naturalmente non puo’ essere l’unico... Leggere il seguito

    Da  Iwebdesigner
    ARCHITETTURA E DESIGN, CONSIGLI UTILI, EBUSINESS, LIFESTYLE, TECNOLOGIA
  • Illustrazioni fantastiche in Photoshop

    Illustrazioni fantastiche Photoshop

    Uno dei migliori modi per riconoscere il talento di un’artista e’ vedere i personaggi che e’ in grado di sviluppare. Questo e’ il caso di Arnold Tsang, che con ... Leggere il seguito

    Da  Iwebdesigner
    ARCHITETTURA E DESIGN, CONSIGLI UTILI, EBUSINESS, LIFESTYLE, TECNOLOGIA
  • Regolazione livelli in Photoshop

    Regolazione livelli Photoshop

    La regolazione dei livelli e’ la base per capire come si puo’ intervenire su un’immagine e come Photoshop lavora su colori e luminosita’. Leggere il seguito

    Da  Iwebdesigner
    ARCHITETTURA E DESIGN, CONSIGLI UTILI, EBUSINESS, LIFESTYLE, TECNOLOGIA
  • Illustrazioni Photoshop da Samurai

    Illustrazioni Photoshop Samurai

    Samurai e’ un termine usato in Giappone per descrivere guerrieri con nobilta’ militare che seguono in maniera esemplare un determinato codice d’onore. Leggere il seguito

    Da  Iwebdesigner
    ARCHITETTURA E DESIGN, CONSIGLI UTILI, EBUSINESS, LIFESTYLE, TECNOLOGIA
  • Maschera veloce in Photoshop

    Maschera veloce Photoshop

    Per individuare aree da rendere attive o proteggere, e’ possibile utilizzare sia una selezione che una maschera. Come spiegato nell’articolo Le maschere in... Leggere il seguito

    Da  Iwebdesigner
    ARCHITETTURA E DESIGN, CONSIGLI UTILI, EBUSINESS, LIFESTYLE, TECNOLOGIA
  • Collezione di icone in stile Pixel Art

    Collezione icone stile Pixel

    La Pixel Art è una forma d’arte digitale nata negli anni 80, epoca d’oro dei videogames per i nostri amati sistemi casalighi, dotati di una definizione grafica... Leggere il seguito

    Da  Iwebdesigner
    ARCHITETTURA E DESIGN, CONSIGLI UTILI, EBUSINESS, LIFESTYLE, TECNOLOGIA
  • Pixel Art: i maestri dell’arte digitale

    Pixel Art: maestri dell’arte digitale

    Come promesso, presentiamo oggi due dei massimi esponenti della Pixel Art, Paul Robertson ed eBoy (in realtà un collettivo). L’australiano Paul Robertson è... Leggere il seguito

    Da  Iwebdesigner
    ARCHITETTURA E DESIGN, CONSIGLI UTILI, EBUSINESS, LIFESTYLE, TECNOLOGIA