Personal tools
Pronto soccorso grafico per programmatori (e non solo)

"If it's somethin' weird an it won't look good..."

Apr 09, 2014

Pronto soccorso grafico per programmatori (e non solo)

Il fai-da-te può dare grandi soddisfazioni, caro amante del <pre> e del Courier New (ovvero: non rompere le balle al grafico per disegnare un rettangolo rosso)

Sarò breve ma, spero, efficace: ispirandomi alla quotidianità dell'ufficio, dove una mandria di aridi e sterili programmatori chiede costantemente di essere istruita e illuminata sulla sacra arte del "rendere esteticamente gradevole un insieme eterogeneo di tag html", ho pensato di riportare un utile breviario di strumenti che ne faciliteranno la mission-quasi-impossible.

Le Icone

Per anni, se qualcuno chiedeva ai miei gentili colleghi smanettoni quale fosse la principale ragione d'essere di un grafico in azienda, avrebbero risposto in coro: "trovare le icone". Ho perso il conto delle richieste più fantasiose che mi sono arrivate... "Mi trovi un'icona per il calendario che non sia un calendario?", "Mi serve un'icona per il dirigente, una per per il vice, una per il personale e una per il cugino dello zio dell'amico del capo..., ma non voglio gli omini", "Che icona posso usare per un file pdf?", e così via.

Poi è arrivato iconfinder.com (e a seguire molti altri servizi analoghi) a salvarmi la vita... o a rimpiazzarmi alla scrivania, per dirla con i colleghi ;-)

Gli angoli tondi e l'allegra compagnia del CSS3

Che meraviglia la rivoluzione del border-radius. Se prima venivo costretta sotto tortura a esportare variopinte gif nelle 4 diverse angolazioni per ogni tipo di smussatura possibile, oggi il CSS3 può essere facilmente padroneggiato anche dal pythonista più coriaceo.
Con CSS3 Generator si ottengono in pochi secondi tutte le istruzioni per curvare, trasformare, ruotare, ombreggiare e forse anche evocare un Patronum.

I bottoni

Se fosse per loro (i programmatori) tutti gli <input> e i <button> sarebbero le più affascinanti delle creature esistenti. Ma il Cliente, l'entità superiore che tutto governa, non si accontenta di un mondo a tonalità di grigio. 
In questi casi i quattro-salti-in-padella del CSS ce li forniscono decine di siti come www.bestcssbuttongenerator.com, www.cssbuttongenerator.com e css-button-generator.com

I font

Google Web Fonts ha dato a tutti il potere del Verbo: niente più .woff, .eot, .svg... Solo un url: https://www.google.com/fonts.

Personalmente, ho trovato molto utile anche https://skyfonts.com/: permette di installare/sincronizzare velocemente in locale qualunque Google font (e non solo) per applicarlo nei documenti di testo o nelle bozze grafiche (avete presente quei disegnini fatti al computer che piacciono tanto a noi fanatici del pennello virtuale?).

I testi...

Lipsum.com lo conoscono anche i sassi. I suoi pro-nipoti, invece, sono spesso ai confini della realtà:

Eppure, nonostante tutto, gli asdasdasd sono duri a morire.

... e le immagini segnaposto

Sei davanti al Cliente, il giorno della demo. Inizi a esaltare le grandi potenzialità editoriali del nuovo strumento, la capacità di impaginare testi e immagini, le bellissime visualizzazioni dell'elenco notizie o della gallery e foto, e... hai dimenticato di controllare i contenuti di test inseriti dal malvagio di turno e ti trovi a dover glissare davanti alla foto di Peppa Pig arrosto o al poster di Del Piero.

In questo caso un anonimissimo rettangolo grigio generato con http://placehold.it/ sarebbe stato perfetto. Ma in altri casi la scelta del soggetto può essere l'arma (subdola e psicologica) vincente per alzare l'indice di gradimento del proprio lavoro. Se sapete ad esempio di avere davanti una gattofolle come la sottoscritta, con http://placekitten.com/ vi assicurerete gli auguri di Natale per i prossimi 10 anni.
Magari potreste avere maggior successo con un più generico lorempixel.com, oppure lanciarvi in un doveroso tributo al grande Bill Murray. A vostro rischio e pericolo esiste anche http://placezombies.com/.

La scelta dei colori

...mmmmh, no, su questi non c'è speranza, inutile illudersi. Ho visto cose che voi umani...

Filed under: , , ,
comments powered by Disqus