Facebook: tecnica degli avatar

Creare un avatar su Facebook non è banale soprattutto quando si deve utilizzare il marchio di un’azienda o di un progetto. Le complicazioni, ovviamente, nascono dal fatto che i signori di Facebook si ostinano a far accadere delle cose automagicamente invece di lasciar scegliere gli utenti. Le considerazioni seguenti si riferiscono ai profili pubblici, ma possono essere applicate tranquillamente anche a quelli privati, poiché – almeno da questo punto di vista – le differenze sono assai poche.

Facebook usa la stessa immagine per l’illustrazione principale del profilo (la foto grande) e per l’avatar che compare come iconcina in giro per il sito (detta miniatura).

Il problema è che questa seconda immagine è un derivato della prima e non è possibile controllare il fattore di scala. L’avatar viene ritagliato prendendo un’una porzione dell’immagine principale e riducendola alla dimensione di 50 x 50 pixel, come mostra l’immagine seguente:

La cosa divertente è che questa porzione cambia in funzione della dimensione dell’immagine di partenza e sinceramente non ho capito come viene fatto il calcolo (se qualcuno più bravo di me si vuole cimentare, sarei felice di saperlo). Empiricamente sono arrivato alla conclusione che se si usa un’immagine grande (per esempio 200 x 600) allora la porzione da ritagliare è di circa 160×160 pixel.

Facciamo un esperimento utilizzando un logo un po’ ostico: quello di Working Capital, un progetto che sto seguendo per conto di Telecom Italia. La difficoltà sta nel fatto che quando viene molto rimpicciolito, il logo diventa di difficile lettura: occorre quindi immaginarne una versione che possa essere usata in piccolo. Possiamo procedere cercando di cogliere due piccioni con una fava: da un lato prepariamo un loghetto ad hoc (per esempio la W su fondo nero); dall’altro costruiamo un vero e proprio banner in cui inseriamo gli elementi di corporate identity (per esempio, prendiamo la foto di uno degli eventi del tour di Working Capital). Otterremo questo risultato:

A questo punto, possiamo caricare l’immagine e ricavare la miniatura:

1. clicchiamo sull’immagine del profilo e clicchiamo su cambia immagine, quindi scegliamo carica un’immagine, scegliamo il file dal nostro computer e uplodiamolo;
2. clicchiamo nuovamente sull’immagine del profilo, clicchiamo su cambia immagine e quindi su modifica miniatura;
3. facciamo un po’ di pan andando a trovare la W e quindi salviamo il tutto.

Il risultato è che l’immagine principale e la miniatura sono coordinate e siamo riusciti a ottenere un controllo decente del risultato (ovviamente se al posto mio ci fosse stato un grafico, anche l’estetica ne avrebbe giovato 😉 ).

(Nota. Ho caricato tutte le immagini nel mio profilo pubblico di Facebook che uso solamente per fare delle prove e sperimentare delle tecniche… quindi già adesso, tutte le immagini non ci sono più).

Un processo analogo al nostro è stato, per esempio, fatto da Fiat. Qualcuno mi aiuta a generalizzare un po’ il processo? Ci sono altre considerazioni da fare?