A lezione di Microangelo
Impariamo ad usare Microangelo per due progetti diversi.
Il primo: realizzare un'icona in stile copland per la sezione "scrivici" di un sito.
Il secondo: la realizzazione di un set di mini icone per un media player.
Se non possedete Microangelo è possibile scaricare qui una versione trial di 21 giorni.
Il pacchetto Microangelo comprende più di un programma; noi utilizzeremo Microangelo Studio.
Tutto quello che segue è riferito all'ultima versione disponibile al momento, la 5.5. In linea generale comunque non ci dovrebbero essere difficoltà a eseguire il tutto con versioni differenti.
Partiamo dall'icona per la e-mail.:
L'idea è quella di rappresentare un foglio, una matita e una busta che simboleggino l'azione dello scrivere.
Apriamo un nuovo documento di dimensioni 32x32 pixel. Se Microangelo di default vi apre un documento di 48x48 pixel, cliccate sull'icona
sulla destra e scegliete 256 colori e 32x32 pixel, togliete la spunta dalla casella in basso 'Begin new image using current image' e poi cliccate su 'ok'.A questo punto cancellate il formato 48x48 pixel facendoci click destro sopra e scegliendo 'remove'.
Di default avrete uno sfondo blu-grigio: è il colore che Microangelo usa per indicare la trasparenza.
Nella palette colori è contrassegnato da un piccolo monitor a schermo blu su sfondo bianco.
Ora siamo pronti per disegnare.
Usiamo la vista isometrica come spiegato nell'aticolo 'Icone con la pixel art' e prepariamo una base su cui disegnare.
Ora utilizzando lo strumento matita (pencil) o se preferite lo strumento riga (straight-line) e aiutandovi con le righe dell'isometria tracciate prima, disegnate un rettangolo in prospettiva e usando lo strumento secchiello (flood) riempite il vostro rettangolo come nella seguente figura.
I colori con cui disegnare e/o riempire potete sceglierli cliccando sulla palette (se non la vedete potete visualizzarla andando sul menù wiew > color palette). Cliccando col tasto sinistro sceglierete il colore di primo piano mentre cliccando col destro sceglierete il colore di background. I colori selezionati in un dato momento sono visualizzate subito sopra la toolbar in alto a sinistra.
Quella che abbiamo appena disegnato è la base per la busta, ora facciamo la stessa cosa per il foglio. Possiamo già aggiungerci qualche riga di dimensioni e colori differenti che simulino le righe di testo già scritte.
Ora passiamo al francobollo: qualche pixel colorato e una bordatura grigia basteranno per dare l'idea dell'affrancatura. Aggiungiamo qualche riga per l'indirizzo.
La matita per ora disegnamola ponendo attenzione soprattutto all'inclinazione e alle proporzioni con il foglio, ci occuperemo dopo del resto.
Cominciamo ad avere tutte le forme delineate, possiamo quindi cancellare la griglia di riferimento per le isometrie.
La matita che avevamo solo abbozzato, ora la coloriamo ponendo attenzione alle luci. Dobbiamo scegliere un punto luce e tenerlo sempre a mente per tutti gli oggetti del nostro disegno. Creiamo anche un'ombra sul foglio che aiuti l'occhio a collocare la matita rispetto al foglio. L'ombra partirà quindi dalla punta della matita (vicinissima al foglio) allontanandosene un po' lungo il corpo.
Volendo potremmo già fermarci qui. Possiamo però dare qualche altro ritocco togliendo i bordi così netti e neri e sostituendoli con sfumature di grigio, colorando di due grigi differenti la busta e il foglio per distinguerli meglio visivamente e aggiungendo un minimo di spessore ai bordi in modo da far sembrare il tutto meno piatto.
Ora che abbiamo finito il lavoro creativo possiamo passare a quello tecnico.
Se l'icona ci serve per un sito web andrà salvata in formato GIF e non ICO. Andiamo quindi sul menù file clicchiamo su 'save as...' e scegliamo dalla casella a discesa 'GIF format'.
Ecco come risulta il nostro lavoro finito:
Ora occupiamoci delle icone per il player.
Dovremo creare un totale di 7 icone (play, avanti di un brano, indietro di un brano, stop, pausa, registrazione e icona del volume).
Partiamo dall'icona 'play'.
Apriamo microangelo studio, dovendo creare una mini icona di dimensioni non default come spiegato prima, cliccheremo sull'icona
sulla destra, sceglieremo 256 colori e custom size, e definiremo le dimensioni a 8px x 8px (è la dimensione minima consentita da Microangelo), toglieremo la spunta alla casella in basso 'Begin new image using current image' e poi cliccheremo su 'ok'. Ora cancellate il formato 48x48 pixel facendoci click destro sopra e scegliendo 'remove'.Cominciamo a disegnare, usando la matita, la freccia che è il simbolo standard per il play.
Otterremo una cosa di questo genere.
Essendo un formato molto piccolo non potremo permetterci tanti altri giochi di luce che ne ridurrebbero molto la leggibilità. Lasciamo quindi così l'icona e decidiamo in che formato salvare.
A seconda dell'uso che ne dovremo fare, dovremo decidere se salvare in formato GIF o in formato ICO. Vi ricordo che per il web si usa sempre il formato GIF, fa eccezione solo il caso in cui si stia realizzando la famosa FAVICON per cui è necessario salvare in ICO. Per l'integrazione di immagini in un software non c'è invece una regola, bisogna semplicemente sapere quale formato è stato scelto dal programmatore che lo ha realizzato.
Allo stesso modo, aprendo un nuovo documento 8x8 pixel e disegnando con la matita potremo realizzare le altre icone.
Eccole ingrandite, in modo che possiate vedere come sono disposti i pixel:
Ecco, invece, come risultano a dimensione reale salvate in formato GIF.
