mercoledì 3 novembre 2010

Tutorial - Maschera di ritaglio


Ecco un effetto interessante da applicare alla nostra fotografia o illustrazione grafica. Parlo della maschera di ritaglio preformata, o clipping mask in inglese, una tecnica molto usata in grafica che permette di usare motivi precedentemente creati.
Maschera di ritaglio in pratica vuol dire applicare un qualsiasi motivo grafico in modo che renda trasparenti solo determinate aree dell'immagine. Il motivo da applicare ovviamente dipende dai gusti personali e dall'effetto che si vuole ottenere.

Ecco un esempio di maschera applicata ad un'immagine, dove la maschera da un tocco grafico all'immagine.


In questo post spiego come usare le maschere indicando i passaggi necessari comuni in qualsiasi software di elaborazione di un certo livello; non indico i comandi da usare, poichè ogni software differisce dall'altro, per cui si presuppone una conoscenza base del software usato.

Come ottenere la maschera:

Le maschere sono semplicemente immagini monocromatiche, nere con zone più o meno trasparenti, per cui sono salvate in formato nativo del software o in png. Si possono creare personalmente le proprie maschere oppure usare maschere create da altri (cercando in rete se ne possono trovare varie da scaricare).

Come applicare la maschera:

Prima di applicare la maschera bisogna trasformarla in in negativo, cioè il nero diventa bianco, e la trasparenza va riempita di nero.

1_ Aprire la maschera nel software di elaborazione preferito (io ho usato Serif PhotoPlus)

2_ copiarla in un nuovo documento

3_ rendere l'immagine negativa

4_ creare un nuovo livello e riempirlo di nero

5_ Invertire l'ordine dei livelli e unirli

Dopo di ciò applicare la maschera alla nostra immagine è davvero semplicissimo:

6_ aprire la foto e duplicare il livello di sfondo

7_ creare una maschera di livello sul livello duplicato

8_ andare in modalità visualizzazione maschera e selezionare tutta l'area

9_ andare al file della maschera e copiare

10_ tornare al file dell'immagine e incollare nella selezione

11_ tornare in visualizzazione normale e deselezionare

12_ riempire il livello sottostante di bianco o un altro colore.

NB. Ovviamente questa tecnica può essere usata in combinazione con altre. Per esempio ecco la stessa foto in cui ho usato maschera ed effetto Orton.


Qui ho provato la stessa maschera su altre immagini sempre in abbinamento alla tecnica Orton.




Links:
Tutorial: Stormiephotos
Maschera: KristineMB_grungeframe
Leggi tutto..

mercoledì 21 luglio 2010

Tutorial - Effetto Orton


Qualche tempo fa vi parlavo di Hdr, ora vi parlerò di un'altra meravigliosa tecnica che ho scoperto per elaborare le fotografie, l'effetto Orton.
Questa tecnica permette di creare quel classico effetto sfumato, evanescente, che dà corposità e morbidezza all'immagine e che si vede in molte fotografie professionali.

Ecco come esempio pratico una mia elaborazione, prima e dopo.


Questo effetto prende il nome dal suo inventore e risale ai tempi della pellicola. Si basa sul principio di sovrapporre due foto identiche ma con diversa messa a fuoco, entrambe sovraesposte. Ora che possiamo usare il pc e un programma di elaborazione di immagini è molto semplice realizzarlo.

Ora spiego la tecnica da me usata, elencando i semplici passaggi da seguire comuni in ogni software di elaborazione che si rispetti; non indico i comandi da usare, perchè variano in base al software usato:

1_ Aprire l'immagine nel software di elaborazione preferito (io ho usato Serif PhotoPlus)

2_duplicare il livello

3_applicare al livello appena duplicato il metodo scolora (screen)

4_unire i livelli

5_duplicare il livello appena unito

6_applicare al livello appena duplicato una sfocatura gaussiana (gaussian blur) in modo che siano riconoscibili le forme ma non i dettagli

7_applicare al livello il metodo moltiplica.

NB. Usando un valore di blur minore si può usare questa tecnica anche solo per minimizzare le rughe del viso nelle foto di persone.

Links:
Pcin.net
Freedreamer
Leggi tutto..

sabato 19 giugno 2010

Fantastiche textures da scaricare


Se volete dare un'effetto pittorico o texturizzato alle vostre foto, potete divertirvi a provare tante bellissime textures disponibili gratuitamente online. Ecco delle fonti spettacolari che ho trovato su flikr:

Skeletalmess

Clive Sax

Terry

Ejmphoto

Teizey

Dog ma

Oicore
Leggi tutto..

giovedì 17 giugno 2010

I migliori tools free per il pc

Tra i tanti programmi free che mi è capitato di scaricare e provare, ho voluto fare una cernita di quelli che ritengo indispensabili. Molti sono ormai di uso comune.

Pulizia del sistema
cneaner

Compressione
Izarc
Z-zip

Ufficio
openoffice
free pdf to word converter

Immagini, video, musica
picasa
videolan
winamp

Internet in sicurezza
Agnitum Outpost firewall
Avira Antivir
spybot
spyware terminator
peerblok
vidalia bundle tor

browser
firefox
chrome

telefono
skype

Download
easy video downloader
httrack

Masterizzazione dvd
dvd shrink
burn for free
Leggi tutto..

I migliori tools free per creare siti web

Editor web visivo (Wysiwyg):
Amaya

Editor html:
Notepad++

Sostituire blocchi di codice html:
Htmlsr

Salvare in formato ico:
Imagicon

Creare slide con fotografie e esportarle nei formati video più usati:
Foto2Avi

Conversione tra vari formati video:
Any Video Converter

Scaricare interi siti, anche in Flash:
HTTrack Website Copier

Caricare files sul web:
Filezilla
Leggi tutto..

I migliori tools free per la grafica

Quelli che vi indico di seguito sono dei gioiellini, software gratuiti ma molto utili e ben fatti, scelti da me accuratamente tra tanti simili provati.

Campionamento dei colori sul monitor:
Colorpicker

Esportazione di più files jpg in un unico pdf:
JPEGtoPDF

Aprire i pennelli e visualizzarli senza installarli:
abrvViewer

Visualizzare documenti e presentazioni in pdf e convertire tra vari formati:
CoolPdfReader

Online tools:

Convertitore di formati di immagini:
http://www.coolutils.com/Online/Image-Converter/



Leggi tutto..

Widgets e scripts free per bloggers

Ultimamente curiosando per il web ho trovato molti tools interessanti per arricchire un blog, e così sono andata alla ricerca di altri ancora. Questi sono quelli che preferisco, molti li vedete in funzione sul questo blog.

Widgets:

Informazioni sui visitatori in tempo reale:
feedjit.com

Contatore di accessi e provenienza dei visitatori:
www.flagcounter.com

Barra di post correlati sotto ogni post:
http://www.linkwithin.com/learn

Profilo sociale, oppure barra di social bookmarking (condivisione sociale):
www.letsgetsocialnow.com

Badge Flickr con i contenuti più interessanti:
www.flickriver.com

Scripts

Convertitore online per visualizzare codice html all'interno del testo normale:
ww.plus2net.com

Convertitore online per visualizzare codice html all'interno di una cornice:
SimpleCode

Bottone "Retweet":
www.bloggertricks.com

Barra di social bookmarking:
bpwebnews.blogspot.com

Post più commentati:
parsifal32.blogspot.com
Leggi tutto..

Script automatico "Leggi tutto..." per Blogger


Se avete un blog su piattaforma blogger sicuramente vi sarete chiesti come fare in modo che i post in home appaiono come una breve preview e un pulsante "Leggi tutto...", insomma come inserire un sommario in home page. Dopo aver provato invano vari scripts reperiti in rete, finalmente ne ho trovato uno che funziona, e lo condivido con voi. La fonte originale è in inglese e include una errata corridge; io l'o tradotta inserendo il codice corretto.

Ecco come si installa:


Per sicurezza fate un backup del vostro template prima di modificarlo.

Entrate in blogger con vostro account e andate in Design > Modifica html nella vostra Bacheca, ora spuntate l'opzione "Espandi i modelli widget" (è fondamentale questo passaggio).

Per trovare una linea di codice nel Browser digitate Control+F e apparirà una barra di ricerca in basso. Trovate il tag di chiusura </head> e copiate le linee di codice seguente immediatamente prima di esso.




<script type='text/javascript'>var thumbnail_mode = "no-float" ;

summary_noimg = 430;

summary_img = 340;

img_thumb_height = 100;

img_thumb_width = 120;

</script>



<script type='text/javascript'>

//<![CDATA[

function removeHtmlTag(strx,chop){

if(strx.indexOf("<")!=-1)

{

var s = strx.split("<");

for(var i=0;i<s.length;i++){

if(s[i].indexOf(">")!=-1){

s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);

}

}

strx = s.join("");

}



chop = (chop < strx.length-1) ? chop : strx.length-2;

while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;

strx = strx.substring(0,chop-1);

return strx+'...';

}



function createSummaryAndThumb(pID){

var div = document.getElementById(pID);

var imgtag = "";

var img = div.getElementsByTagName("img");

var summ = summary_noimg;

if(img.length>=1) {

imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';

summ = summary_img;

}



var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';

div.innerHTML = summary;

}



//]]>

</script>




Da notare che nel codice precedente possiamo cambiare le dimenzioni dell'immagine da visualizzare cambiando questi valori:


img_thumb_height = 100;

img_thumb_width = 120;


Ora trovate il codice <data:post.body/> nel vostro template e sostituitelo con il seguente codice:



<b:if cond='data:blog.pageType == "static_page"'><br/>

<data:post.body/>

<b:else/>



<b:if cond='data:blog.pageType != "item"'>



<div expr:id='"summary" + data:post.id'><data:post.body/></div>

<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");

</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href="data:post.url">Leggi tutto..</a></span>



</b:if>

<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

</b:if>




Ecco fatto! Ora cliccate su preview e poi salvate.
Ovviamente se cambiate il modello dovete rifare tutto daccapo.

Credits: www.anshuldudeja.com

Leggi tutto..

venerdì 11 giugno 2010

Design su Blogger


Avete provato la nuova funzione Design di Blogger? E' fantastica! Se finora avete gestito un blog su piattaforma blogger, dimenticate i pochi e datati templetas grafici e la modifica dell'html; dover riaggiungere i gadgets ogni volta che applicate un layout esterno fa parte del passato.
Ora si possono scegliere combinazioni infinite tra templates moderni e tantissimi sfondi molto belli, e modificare il layout o gli elementi della pagina senza dover conoscere l'html; ma la cosa fantastica è che cambiando il template tutti i widget rimangono dove sono e la pagina di gestione del layout rimane molto più ordinata. Un grande passo avanti.
Leggi tutto..

martedì 8 giugno 2010

Confronto tra software per l'elaborazione di immagini


Tutti conoscete Photoshop della Adobe e sapete che è il software più completo nel campo dell'elaborazione di immagini, ma sapete anche che è molto costoso (la versione CS5 costa €1.018,80), e sicuramente avete almeno sentito parlare anche di Gimp, che è un software simile ma gratuito. Ma può un software gratuito come Gimp sostituire efficacemente un software costoso come Photoshop? Esistono dei software low budget che permettono di ottenere risultati professionali?
Bisognerebbe testarli uno ad uno... beh io l'ho fatto! Prendendo come riferimento Photoshop CS2, ho testato le stesse funzioni su Gimp 2 e PhotoPlus X2, software low budget scelto da me (costo: £59.99, ora in offerta a £39.99 e cioè € 48.06). Ed ecco il mio resoconto:

In breve:

PhotoPlus offre tutti gli strumenti base presenti in Photoshop e permette di raggiungere risultati molto simili se non uguali a quelli ottenibili con Photoshop; certo PhotoPlus manca degli strumenti più sofisticati di Photoshop e le opzioni offerte sono talvolta semplificate, ma mi pare il minimo, vista la differenza di prezzo, e considerato che permette comunque di raggiungere gli stessi risultati nella maggior parte dei casi.
Gimp offre una funzionalità molto comoda e cioè la possibilità di trasformare la selezione con le maniglie, ma manca di funzionalità decisive come gli effetti di livello (utilissimi per creare bottoni) e i livelli di regolazione, e utili come i livelli forma, i set di livelli, le sezioni e l'animazione, per non parlare della gestione del colore, tutte funzioni che invece PhotoPlus offre.
Nelle funzioni che hanno in comune Gimp e PhotoPlus, Gimp offre prestazioni migliori nella gestione di paragrafi (per esempio ne permette l'aggrappamento al centro delle guide), e Photoplus offre prestazioni migliori di deformazione e maschere di livello.
Infine PhotoPlus apre sempre i file Psd, cosa che non sempre fa Gimp.

Più in dettaglio:

Premessa:
Di seguito cerco di fare una panoramica dei software abbastanza precisa senza entrare troppo nel dettaglio. Molte funzioni sono simili nei tre software ma spesso hanno nomi diversi o differenze nelle opzioni e nel modo d'uso.

Nelle foto seguenti le interfacce dei software: dall'alto Photoshop cs, Gimp 2 e PhotoPlus x2.




Area di lavoro:
Interfaccia molto simile per Photoshop e Photoplus, un pò meno per Gimp.
Funzionalità presenti in tutti e tre i software:
  • Palette strumenti e relativa palette contestuale opzioni;
  • Regolarezione della vista con lo strumento zoom;
  • Strumento pennello e relative opzioni grandezza, durezza e opacità;

Correzioni fotografiche:
Funzionalità presenti in tutti e tre i software:
  • Rotazione e ritaglio dell'immagine;
  • Regolazione dell'immagine tramite comandi come livelli curve luminosità e contrasto, sia in modo automatico che manuale;
  • Filtri più usati come maschera di contrasto.
In Gimp mancano alcuni comandi e strumenti come sostituisci colore e spugna.

Fotoritocco:
Funzionalità presenti in tutti e tre i software:
  • Strumenti di correzione sofisticati come il timbro e il pennello correttivo.
Altre funzioalità:
  • Strumenti toppa e pennello correttivo al volo: presenti in PhotoPlus, assenti in Gimp;
  • Pennello storia e possibilità di fare istantanee: assenti in PhotoPlus e Gimp, ma in alternativa si può duplicare i livello lavorato e salvare una copia del file.

Selezioni:
Funzionalità presenti in tutti e tre i software:
  • Selezionare, aggiungere o sottrarre alla selezione, deselezionare e invertire la selezione;
  • Strumenti bacchetta magica, forme e lazo, con possibilità di vincolare le forme a un quadrato o a un rettangolo;
  • Scalare gli elementi selezionati;
Altre funzioalità:
  • Spostare il contenuto di una selezione con lo strumento sposta, anche copiandolo, per sovrapporre una zona ad un'altra: presente in PhotoPlus, assente in Gimp (bisogna per forza creare un nuovo livello).

Livelli:
Funzionalità presenti in tutti e tre i software:
  • Palette Livelli, con le icone occhio e lucchetto per visualizzare/nascondere o bloccare/sbloccare ogni livello;
  • Copiare un livello e inserirlo in un file diverso e modificare per ogni singolo livello opacità e metodo di fusione;
  • Unire i livelli per diminuire le dimensioni dell'immagine.
Altre funzioalità:
  • Stili di livello, utilissimi per applicare a tutti gli elementi di un livello effetti come rilievo e/o ombra: presenti in PhotoPlus, assenti in Gimp (!).


Maschere e canali:
Funzionalità presenti in tutti e tre i software:
  • Maschere veloci e salvare e richiamare una selezione; in PhotoPlus le selezioni non vengono salvate nei canali ma la maschera veloce è sufficiente a crearle e modificarle in ogni momento.
Altre funzionalità:
  • Comando estrai, ottimo per isolare facilmente un oggetto dallo sfondo: presente in PhotoPlus, in Gimp no (c'è lo strumento seleziona primo piano ma non funziona bene).

Correzioni avanzate:
Funzionalità presenti in tutti e tre i software:
  • Correzione lente (per le aberrazioni).
Altre funzionalità:
  • Aprire e modificare i files cameraRaw: PhotoPlus consente solo di aprirli, Gimp no.
  • Strumenti di correzione come: regolazioni luci/ombre, correzione occhi rossi, riduci disturbo, contrasta migiore: presenti in PhotoPlus ma semplificati; in Gimp mancano regolazioni luci/ombre e riduci disturbo, ma in alternativa si possono usare le curve e la sfocatura.
  • Filtro prospettico: assente in Gimp e PhotoPlus;
  • Creare una presentazione in Pdef: assente in Gimp e PhotoPlus, ma questo può essere fatto facimente con una applicazione esterna freeware che si chiama JPEGtoPDF.

Testo:
Funzionalità presenti in tutti e tre i software:
  • Strumento testo, ma in Photoshop c'è molta più flessibilità e potenza; lo strumento paragrafo è quello che più fa rimpiangere Photoshop negli altri due software, per esempio in PhotoPlus non è possibile regolarne l'ingombro con le maniglie, ma bisogna andare accapo.
  • Maschere di livello da applicabili al testo.
Altre funzionalità:
  • Comando altera (da menu modifica - trasforma), per adattare una forma piatta ad una curva, per esempio un'etichetta su una bottiglia: in PhotoPlus si può usare lo strumento mesh warp, in Gimp non ci sono strumenti simili.

Disegno vettoriale:
Funzionalità presenti in tutti e tre i software:
  • Strumenti penna per creare tracciati, e permettono di trasformare tracciati in selezioni e viceversa.
Altre funzionalità:
  • Creare un tracciato come "solo tracciato" (non stampato), traccia con riempimento o livello forma: presente in PhotoPlus, in Gimp solo come tracciato.
  • Aggiungere o sottrarre forme, e anche creare forme predefinite: presenti in PhotoPlus, assenti in Gimp.
  • Oggetto avanzato: assente negli altri software.

Tecniche avanzate per i livelli:
Funzionalità presenti in tutti e tre i software:
  • Maschera di livello, per ritagliare un livello senza intaccarlo realmente;
  • Creare una maschera di livello da selezione;
Altre funzionalità:
  • Collegare e scollegare la maschera di livello dal livello: presente in PhotoPlus, assente in Gimp (!)
  • Maschera di ritaglio, simile alla maschera di livello ma ritaglia effettivamente il livello: assente in Gimp e PhotoPlus, ma non è fondamentale.
  • Creare una maschera da tracciato: assente in Gimp e PhotoPlus, ma non è fondamentale.
  • Set di livelli e livelli di regolazione, che applicano una regolazione ai livelli sottostanti: presenti in PhotoPlus, assenti in Gimp.
  • Opzioni di fusione (presenti negli stili di livello di Photoshop): mancano negli altri software.
  • Comando fluidifica, per dare un aspetto liquefatto: in PhotoPlus si può usare warp.

Composizione avanzata:
Funzionalità presenti in tutti e tre i software:
  • Visualizzazione di guide e righelli ed effetto calamita;
  • Cambiare tinta senza influire su luci e ombre desaturando, creando un nuovo livello con metodo colore e dipingendo con un pennello o una sfumatura idonei;
  • Filtri per applicare effetti istantanei all'immagine come effetti di pittura o di movimento.
Altre funzionalità:
  • Guide sensibili: assenti in Gimp e PhotoPlus, ma non è determinante.
  • Registrare una serie di azioni e poi eseguirle automaticamente su uno o più files: presente in PhotoPlus, assente in Gimp;
  • Comando corrispondenza colore, per armonizzare una composizione di immagini diverse: in PhotoPlus puoi usare lens filter, in Gimp non esiste uno strumento simile.

Progettazione web:
Funzionalità:
  • Generare la grafica completa del codice html necessario aggiungendo collegamenti a sezioni o mappe immagine: presente in PhotoPlus, in modo più semplificato; assente in Gimp; in alternativa si possono ritagliare le parti del sito usando le guide e le selezioni, copia e incolla come nuova immagine.
  • Generare rollover completi del codice html necessario: assente negli altri due software.
  • Creare animazioni da salvare come gif animate: presente in PhotoPlus, assente in Gimp.

Gestione del colore:
Gestione del colore per gli usi professionali destinati alla stampa: presente in Photoplus anche se in modo semplificato, assente in Gimp.
Leggi tutto..

giovedì 25 febbraio 2010

Tools online per elaborazioni grafiche

vi segnalo ora un pò di siti che permettono di elaborare le foto online in modo
Leggi tutto..

lunedì 22 febbraio 2010

I migliori siti di font free


Dopo i migliori siti di immagini e di icone, concludo per il momento la carrellata di links di risorse free per la grafica segnalando la mia selezione di migliori siti dove scaricare fonts gratis e liberi da diritti, risorsa indispensabile per ogni grafico. Questi siti sono stati da me selezionalti per completezza di informazioni e facilità di ricerca. Anche in questo caso leggere sempre la licenza d'uso dei files.

Dafont

Abstractfonts

Acidfonts

Fontfreak
Leggi tutto..

I migliori siti di icone free


Le icone possono essere molto utili per migliorare l'aspetto di un sito. In rete sono disponibili molte raccolte scaricabili gratuitamente. Ecco a voi la mia selezione personale dei migliori siti dove scaricare icone libere da usare. Sono ottime raccolte di icone per tutti i gusti e le necessità, dalle faccine smile alle icone dei più diffusi social networks, e molto altro.
Leggi tutto..

I migliori siti di immagini free


Che voi vogliate creare illustrazioni o grafica le foto sono un buon punto di partenza per creazioni originali, senza contare che sono indispensabili in un impaginato, sia cartaceo che digitale.

In rete è facile trovare immagini da scaricare, ma è importante fare attenzione: le immagini devono possedere i seguenti requisiti:

-essere di buona qualità e di dimenzioni adeguate (alta risoluzione)
-essere liberamente usabili, per scopi anche commerciali

Ci sono molti siti che offrono questo tipo di immagini, alcuni a pagamento, altri gratuitamente, alcuni di essi solo per uso personale, oppure richiedendo in cambio che sia accreditato l'autore.

Quella che segue è la mia selezione personale di migliori siti per reperire immagini gratuite online. Tutti i siti menzionati offrono immagini di qualità, gratis, generalmente libere da diritti (royalty free) e senza obbligo di accredito; inoltre sono i siti che più spesso mi hanno restituito risultati soddisfacenti.

Ci possono essere comunque variazioni di licenza da foto a foto, per cui bisogna sempre leggere la lincenza d'uso di ogni immagine. Quasi tutti necessitano di registrazione.

Stock.XCHNG

Dreamstime

Photorack

MorgueFile

Freerange

Freepixels

Stockvault

Photogen

Public-domain-photos

Vintagepixels

Può essere utile anche il servizio di ricerca Creative Commons

Infine segnalo questo sito che offre immagini con obbligo di accredito ma di ottima qualità, con grande assortimento e gratis:

123rf

Buona ricerca!
Leggi tutto..

giovedì 7 gennaio 2010

Ritratto step by step 3


In questo video è mostrato il processo di creazione di un ritratto a matita passo per passo fino al risultato finale.

Leggi tutto..

Ritratto step by step 2




In questo video è mostrato il processo di creazione di un ritratto a matita passo per passo fino al risultato finale.
Leggi tutto..

lunedì 4 gennaio 2010

Ritratto step by step


In questo video è mostrato il processo di creazione di un ritratto a matita passo per passo fino al risultato finale.

Leggi tutto..