FM design lab | Blog su grafica e web design

Creare una Business card con Photoshop

francesco masetti — Mon, 02 Aug 2010 14:42:27 +0000

Informazioni principali per una Business card:

Nome azienda e/o Nome personale
Telefono
Indirizzo
Contatto mail
P.iva nel caso la si detenga o codice fiscale.

Settaggi grafici:

CMYK o quadricromia
300 o 150 Dpi
Bordi e margini di stampa, i margini di stampa sono utili perchè la macchina da stampa della tipografia potrebbe sbagliare di qualche millimetro la stampa e il ritaglio dal foglio del biglietto da visita, il margine sarà una sorta di salvagente per la tua grafica.

Che software utilizzare:

Per essere sicuri che la tipografia non commetta errori grossolani di stampa, il che sarebbe un mezzo disastro, sarebbe meglio creare la propria business card con un programma vettoriale come illustrator e impaginarlo con uno strumento come In design, per poi esportare la grafica finale in PDF.

Fortunatamente con l’ evolversi delle tecnologie se vi affidate a una buona tipografia potete anche ceare la vostra business card con photoshop e esportare il file jpg a 300 dpi per esempio.

Crea il biglietto da visita:

in questo tutorial vi spiegherò passo passo come creare un biglietto da visita utilizzando Photoshop.

Step 1: Setta lo spazio di lavoro

Per prima cosa apri Photoshop e crea un nuovo documento con le seguenti impostazioni

Step 2: Bordi e Margini di lavoro

Iniziamo settando i bordi, per farlo clicca con il mouse sul righello ai bordi della finestra di lavoro e trascina il primo bordo sul un lato estremo del biglietto da visita, per attivare i righelli su Photoshop selezionate View>Rulers.

Invece per settare i margini per la stampa vai su image>canvas size e utilizza i parametri come nell’immagine sotto.

Allargando i margini dell’ immagine di 2cm in totale, abbiamo settato per ogni lato un margine di 1 cm che dovrebbe essere sufficiente per la tipografia, nel caso non ne fossi sicuro ti consiglio di chiedere informazioni direttamente allo stampatore di riferimento.

Step3: Biglietto da visita fronte

Adesso puoi iniziare a creare la tua grafica, questa è la parte più creativa del processo di creazione di un biglietto da visita, io vi mostrerò solo alcuni passaggi indicativi per darvi un idea di cosa è importante in questa fase.

Che tu decida di inserire molti elementi grafici o pochi una cosa molto importante è la precisione nelle dimensioni e nelle altezze, usa le griglie di photoshop per creare dei punti di riferimento, usa testi facilmente leggibili e una buona interlinea, possono aumentare la leggiblità del testo ed essere gradevoli.

ecco il risultato finale della parte frontale del biglietto da visita. Per la scritta “logo” Ho usato il font Bebas a 37 pt di dimensione.

Step4: Biglietto da visita retro

Sul retro invece puoi inserire tutti i dati riguardanti la singola persona come nome e cognome, indirizzo, città, mail, cap, mansione e tanto altro.

Per il testo “Jon Doe” ho utilizzato il font Bebas, Per le informazioni ho utilizzato il font Titillium14l con una grandezza di 6 pt e un interlinea di 11 pt.

Step5: Esportare

L’ ultimo step sarà quello di esportare le due grafiche del biglietto da visita, ti consiglio di salvare per ogni lato il file con le seguenti estensioni:

PSD originale con tutti i livelli
JPG 300 dpi, cmyk
PDF

Un ringaziamento anche ad Alessandro di Comunicazione pubblicitaria

Scarica gratuitamente il tema PSD font bible

Free wordpress theme #6: Profile theme

francesco masetti — Fri, 23 Jul 2010 07:30:34 +0000

Profile theme è un tema gratuito realizzato dal team di WP zoom che permette di trasformare la tua piattaforma Wordpress come un curriculum on-line.

Caratteristiche del tema:

Support for WordPress 2.9
jQuery Tabber
Options Page
Integrated Social Bookmarking, No Plug-ins
3 Color Styles
Google Analytics Integration
Disponibile in 3 colori nero, rosso e blu

Scarica gratuitamente il tema PSD font bible

SEO: 15 webtool per controllare e ottimizzare il proprio sito.

FM design lab — Wed, 21 Jul 2010 07:30:52 +0000

Questi web tool sono piccole applicazioni on line che possono aiutarti nel migliorare le pagine del tuo sito, non hanno lo scopo di sostituire un servizio professionale SEO, che non a caso può costare diverse centinaia di euro, ma comunque possono darvi un iniziale idea di cosa può essere migliorato e una pianificazione dei futuri obiettivi.

Ecco la lista:

Statistics tool da la possiblità di avere uno screen generale di come viene indicizzato il tuo sito nella rete.

Browser compatibility controlla che il tuo sito sia compatibile con i browser esistenti.

Site analyzer un altro web tool che ti permette di avere un checkup del tuo sito nella rete.

Seo optimizer dopo aver analizzato una pagina del tuo sito questo web tool ti segnala suggerimenti e modifche da apportare in base al livello di importanza.

Seo chek up si descrive da solo, altro strumento per avere un chekup delle tua pagine web.

Site permormance uno strumento per analizzare in maniera generale le performance del tuo sito.

Web site grader inserisci il link al tuo sito e ti verra data una analisi dettagliata con consigli su come e cosa migliorare.

Back link checker Controlla quanti backlink riceve il tuo sito, importante strumento di controllo.

Speed test Calcola in quanto tempo viene caricata la tua pagina web, ti consiglio di fare diversi test e poi fare una media totale dei tempi.

Broken link checker esamina il tuo sito alla ricerca di link rotti.

Reciprocal link cheker controlla che i link reciproci vengano rispettati.

Price link Cheker ti sei mai chiesto quanto può costare un link del tuo sito? prova questo strumento per. saperlo approssimativamente.

HTML optimizer per ottimizzare il codice della tua pagina html.

Social evaluator Calcola quanto è produttiva la tua pagina di Facebook.

Scarica gratuitamente il tema PSD font bible

Free PSD theme: Font Bible layout

FM design lab — Tue, 20 Jul 2010 07:30:20 +0000

Font bible è un layout completamente gratuito creato con Photoshop pensato per l’ archiviazione di ispirato concettualmente a siti come Dafont o Fontsquirrel.

Puoi scaricare il PSD gratuitamente iscrivendoti ai miei RSS feed, una volta iscritto in fondo a ogni notizia troverai il link per scaricare il layout.

Caratteristiche:

Creato con le griglie grid 960
Layout mono colonna
Completamente modificabile nei livelli e nei colori.

Scarica gratuitamente il tema PSD font bible

Risorse utili da Flikr

FM design lab — Mon, 19 Jul 2010 07:30:25 +0000

Flikr è un sito che permette di caricare e condividere sul web le proprie immagini, probabilmente è il miglior servizio gratuito di questo genere oltre ad essere uno dei database di immagini più grande al mondo, se non il più grande.

Si stima che su Flikr, Ogni minuto, vengano caricate oltre 2.000 immagini dagli utenti di tutto il mondo, è chiaro che questa marea di informazioni sono difficili da gestire, anche se Flikr dispone di una ottima capacità di gestione contenuti.

In questo articolo ho selezionato e raccolto per voi un alcuni gruppi e set di risorse utili per lavori di grafica o ispirazioni.

Gruppi

Immagini HDR

In questo gruppo sono raccolte migliaia di immagini scattate o trattate digitalmente con la tecnica dell HDRI.

Photoshop Video tutorial

Un gruppo che raccoglie interessanti video tutorial, anche su photoshop cs5.

Vector Art

Un gruppo che conta quasi ventimila immagini di illustrazioni vettoriali, da guardare e prendere ispirazione.

Best Texture

Il miglior gruppo di riferimento su flikr per trovare texture.

Pattern and texture

Altro gruppo dedicato alla raccolta di texture e pattern di ogni tipo.

Set di texture

Grunge texture

18 set di texture grunge di tutti i tipi.

Rain down

Questo utente conta più di 20 set di texure di ottima qualità da scegliere tra Grunge, Abstract, Metal, Glass, Wood e altri.

Ervin

Set di Texture interessanti ad alta risoluzione.

Una cierta Mirada

82 texture ad alta qualità.

Bitt box

Oltre 30 set di texture, un archivio molto vasto.

Alex edge

Questo set di texture ne contiene più di 150.

Longhair

Un bellissimo archivio con oltre 200 texture.

Scarica gratuitamente il tema PSD font bible

Commenta e vinci due guide ufficiali per Adobe illustrator, RISULTATO

FM design lab — Sat, 17 Jul 2010 06:35:25 +0000

Annuncio che il vincitore del contest è Sebastiano Raffa che si aggiudica le due guide ufficiali Adobe Illustrator CS e CS2

Grazie a tutti per aver partecipato, il blog ricomincerà ad essere aggiornato regolarmente.

A partire da oggi fino a Venerdi 16 Luglio metterò in palio sul blog due guide ufficiali per imparare ad utilizzare Adobe Illustrator CS e CS2.

I premi:

1 guida per Adobe Illustrator CS, di 561 pagine con CD incluso!
1 guida per Adobe Illustrator CS2 di 361 pagine di spiegazioni, tutorial e illustrazioni esemplificative.

Come partecipare?

Per partecipare basta lasciare un commento a questo articolo.

Vincitore:

Il vincitore sarà scelto tra le persone che commenteranno l’ articolo, in data 16 Luglio gli verrà segnalata per email la vincita, e richiesti i dati per la spedizione, che verrà effettuata immediatamente e gratuitamente.

Scarica gratuitamente il tema PSD font bible

Photoshop video tutorial: creare un icona in stile Adobe Photoshop CS4

Video inspiration: Muzorama

FM design lab — Sun, 11 Jul 2010 11:29:21 +0000

Il video che vi porpongo questa domenica si chiama Muzorama, è stato creato dall’ illustratore Francese Jean-Philippe-Masson.

Il video è stato prodotto utilizzando Autodesk 3d Studio Max, Photoshop e Adobe after effect.

Il video racconta di una scena surrealistica di quotidiana realtà, piccole vicende che si intrecciano in maniera particolare nella piazza di una cittadina.

Muzorama from Muzorama Team on Vimeo.

Scarica gratuitamente il tema PSD font bible

23 Photoshop tutorial da non perdere, Luglio 2010

FM design lab — Sat, 10 Jul 2010 07:30:41 +0000

Per il mese di Luglio ho raccolto 23 photoshop tutorial cercando tra la rete quelli che a mio avviso potevano essere i più utili, anche se sei alle prime armi con questo software ti consiglio di sceglierne uno e la prima volta di seguirlo passo per passo, e vedrai che immediatamente comincerai ad intuire cosa stai facendo.

In particolare ti consiglio di osservare i tutorial nella categoria oggetti e fotomanipolazione che richiedono più tecnica, ma ti daranno molta soddisfazione.

Phothsop CS5

Trasforma una immagine in un dipinto realistico, con la tecnica del brushing

Crea un Banner animato

Oggetti

Foto Manipolazione

Ringiovanire un volto

Effetti su forme e testi

Testo 3d multicolor

3d + Photoshop

Crea una pubblicità per l’ iphone combinando linee e forme 3d

Web Design

Layout per un portfolio

Scarica gratuitamente il tema PSD font bible

Ottimizzare le parole chiave per il proprio blog/sito

francesco masetti — Wed, 07 Jul 2010 09:00:53 +0000

la keyword o parola chiave ci permette di identificare l’ argomento di un aritcolo di un blog, di una pagina o di un intero sito, queste keyword vengono poi lette dai motori di ricerca per indicizzare i contenuti, e mostrarli nelle pagine di ricerca.

Fino a pochi mesi fa l’ utilità delle parole chiave era indiscussa, ma da un pò di tempo a questa parte molti esperti del SEO sostengono che le keyword hanno perso molta della loro importanza per il posizionamento di un sito, dal momento che Google sta cambiando il metodo di decifrazione e classificazione dei contenuti.

Io credo invece che identificare un articolo con parole chiave rimanga un metodo che, a lungo andare, ripaghi sia dal punto di vista del posizionamento sia per dare subito un riferimento al lettore che giunge per la prima volta sul tuo sito/blog.

Esistono sostanzialmente due macro metodi per ottimizzare le parole chiave, uno è quello di puntare a raccogliere un maggior numero di utenti, l’ altro è quello di puntare il più possibile su un traffico preciso per argomento:

1. Metodo 1, Generalista

Facciamo l’ esempio che io abbia un sito che si occupa di tutorial per photoshop, Potrei scegliere di puntare su parole chiave generalistiche come

Web design
Photoshop
Photoshop cs

in questa maniera richiamerei l’ attenzione di molti utenti interessati all’ argomento Photoshop ma non è detto che stiano cercando tutorial per Photoshop, quindi potrebbero rimanere “delusi” dai contenuti del tuo sito e andarsene dopo pochi secondi.

2. Metodo 2, Specifico

Sempre utilizzando l’ esempio di un blog che parla di tutorial per photoshop, se puntassi le mie parole chiave su termini specifici come

Photoshop tutorial
Tutorial fotomanipolazione
Creare sito photoshop

restringerei il campo di possibile visite ma sarebbero più pertinenti, quindi è più probabile che il visitatore riceva un feedback positivio rispetto alle sue ricerche.

Questi due metodi non devono essere per forza separati, la cosa migliore è mescolarli a seconda dei bisogni e delle scelte, e altra cosa importante il traffico non è prevedibile al 100%.

Vi propongo alcuni articoli molto interessanti:

Come scegliere le parole chiave?

Google tra i suoi centinaia di servizi mette a disposizione anche lo strumento Google Keywords, grazie a questa pagina potrete monitorare quante volte una qualsiasi parola viene ricercata nel mondo e nel tuo paese, ti mostra il trend di questa parola e ancora più importante mostra la concorrenza che questo termine ha nel web, ovvero quanti siti usano già quel termine, quindi se utilizzate parole con una bassa concorrenza è più facile che il vostro sito venga inserito nei primi risultati di google in maniera più veloce.

I meta tag:

Esistono diversi meta tag e tag da usare nei vostri siti, vi consiglio di usare questi per aiutare l’ indicizzazione

Titolo del vostro sito forse il tag più importante per Google

meta description, una descrizione discorsiva di cosa contiene il sito

meta keyword, una lista di parole chiave per il vostro sito, non abusatene e non ripetetele, Google è diventato intelligente e da poco conto a chi cerca di fregarlo.

Ultimo piccolo accorgimento, ricordatevi che esiste una grossa differenza tra le parole web design e web designers, quindi tra il singolare e il plurale, fate attenzione anche a questo piccolo ma importante particolare.

Scarica gratuitamente il tema PSD font bible

Video inspiration: Yekpare

FM design lab — Sun, 04 Jul 2010 08:30:17 +0000

Il video che vi propongo oggi va fuori tema rispetto alla grafica e il web design e si colloca di più nel campo della land art.

Yekpare è un progetto che ha lo scopo di narrare la storia e lo sviluppo di Istanbul attraverso i passaggi più importanti che questa città ha affrontato dalla sua nascita fino ad oggi, queste tappe vengono proiettate tramite un video proiettore sulla superficie frontale della stazione di Haydarpaşa, situata a Istanbul.
Regia curata da: Deniz Kader – Candaş Şişman il video dura circa 16 minuti.
Buona visione!

Scarica gratuitamente il tema PSD font bible