Share
Trascorriamo buona parte del nostro tempo davanti a un monitor, molto probabilmente abbiamo più di un computer, non menzioniamo gli smartphone, le tavolette grafiche e tutte le altre diavolerie ultra moderne che invadono le nostre scrivanie. Facciamo tutti parte della generazione che ha bisogno di un mouse per sfogliare un album con le foto di famiglia (addio ai cari album di famiglia con le pagine lasciate al giallo) e Facebook per inviare auguri di compleanno ad un amico. 20 esempi di grandi siti ispirati allo "schizzo" inclusi!
Eppure, nel bel mezzo di questa era digitale, i migliori alleati di un web designer sono strumenti comuni che possono essere acquistati con il cambiamento sotto i cuscini del divano. Sto parlando di rendere la penna, la matita e la carta una parte del processo creativo che altri stilisti "non digitali" usano da secoli: lo sketch.
Con questo articolo tratteremo un argomento che sicuramente molti di voi avranno a cuore: vedremo infatti come gli schizzi possono aiutarci a organizzare le idee, progettare un layout efficace e - perché no - dare un tocco nuovo e originale a il nostro design.
Immagina questo scenario: Abbiamo appena terminato un briefing estenuante con il nostro cliente e ora è il momento di riorganizzare le idee. Conosciamo le preferenze e le esigenze del nostro cliente; Su questa base dovremmo essere in grado di impostare il layout che dobbiamo progettare. Il problema è la quantità di informazioni che dobbiamo considerare! Abbiamo definito che nella homepage dobbiamo inserire un cursore e un invito all'azione visibile che invita a un contatto, le pagine del sito saranno sette e dobbiamo anche includere le ultime notizie nella home page e così via.
A questo punto, ti assicuro, aprire Photoshop con la pretesa di creare un layout efficace è inutile; senza un piano per ciò che devi disegnare nei dettagli, sarai bloccato e costretto a progettare essenzialmente senza abbastanza lungimiranza per prendere decisioni intelligenti. Questo spesso significa più lavoro dopo, aggiustando ciò che avrebbe potuto essere fatto bene la prima volta con solo un po 'di abbozzo di lavoro.
Lo sketch offre qualcosa di unico per i web designer? ci aiuta a organizzare grandi quantità di informazioni in pezzi gestibili che possiamo progettare in giro.
Invece, se hai la fortuna di poter metabolizzare concetti e idee in un design, molto probabilmente dimenticherai qualcosa di importante, con il risultato di dover mettere nuovamente le mani sul layout per la seconda volta. E, probabilmente, sai anche che ci sono schemi che anche con un piccolo cambiamento vengono completamente alterati e perdono la loro efficacia comunicativa ed estetica? un risultato davvero frustrante davvero.
Qualche consiglio su come procedere senza perdere la testa? Prendi carta e penna?
Questa prima fase di sketch riguarda l'elaborazione delle informazioni in modo schematico e semplice. Probabilmente stai pensando che tutto questo rigore e disciplina non ha nulla a che fare con la creatività e l'immaginazione e vuoi un cambiamento di scenario? Ok, passiamo al prossimo passaggio.
Abbiamo detto che lo sketch è un processo creativo, ma voglio questo significa in pratica?
Possiamo considerare lo sketch come una "terra di mezzo"? tra le informazioni in nostro possesso e il layout finiremo per pianificare. In questo territorio, ostile e magico, troviamo colori, caratteri, scatole, idee, ispirazione, trame, immagini, sensazioni, dubbi? e altro ancora. Inutile dire che nel mezzo di tutto questo è facile essere confusi e trovare l'idea giusta, l'idea che funziona e che ci rende orgogliosi di essere un designer.
Penso che non ci sia niente di più irritante che trovarsi di fronte a un foglio bianco, in attesa di ispirazione che dovrebbe provenire da chissà dove, e finire con la creazione di brutti layout (quindi se sei davvero fortunato come me, tu? Sarò fidanzato con un collega che prende la maggior parte della situazione per dirti che il tuo lavoro fa schifo senza preoccuparsi di addolcire la pillola in modo che non danneggi la tua sensibilità come creativo).
Uno dei miei quaderni di schizzi? lo rivisiteremo più tardi. Personalmente ho passato dei brutti momenti con alcuni clienti: l'ispirazione non voleva venire e le mie proposte grafiche mi hanno fatto vergognare di me stesso. Passavo ore a guardare i siti della galleria, sentendomi ancora più depresso perché sembrava che tutti fossero in grado di creare bellissimi layout, l'unica persona che non era in grado di mettere insieme due rettangoli in un modo carino erano io. Nel mio caso la facilità della pressione è stata facilitata con l'aiuto di una matita.
Dare il via al processo creativo di una persona sulla carta libera di fatto la tua immaginazione, permettendoti di lavorare in modo più spontaneo e stimolante.
Soprattutto se il progetto su cui stai lavorando è enorme e ricco di dettagli tecnici, considerando tutto ciò, la prima fase può certamente essere castrante per il flusso creativo, per non parlare della paura debilitante? Di fallire? che colpisce molti designer: intrappolati nella brama di fare in fretta e bene, spesso restiamo paralizzati davanti al monitor in grado di riorganizzare le idee e incanalarle nella giusta direzione.
Quindi, prima di iniziare a lavorare su qualsiasi tipo di programma grafico, prendi carta e penna e? schizzo! Scarabocchia, annota un paio di idee, inizia a tracciare una sorta di disegno astratto per ottenere familiarità e dopo aver liberato la tua intuizione. Analizzerete in seguito le idee, ora lasciatevi andare ed evitate la logica e la razionalità, non vi aiuteranno in questa fase.
Delinea il layout, metti giù un paio di note, cancella tutto, ricomincia: durante questo processo la tua mente lavora velocemente e freneticamente, quindi prendi nota di tutto prima che questa fase intuitiva si attenui! Scoprirai che dare completa libertà alle tue idee è piacevole e rilassante, oltre che utile.
Raramente la prima idea sarà quella giusta, preparatevi ad accettarla. Lo sketch ti aiuta a sbloccare te stesso e ad afferrare diverse opportunità grafiche che potrebbero essere giuste per te immediatamente e con leggerezza, ma questo non significa che non commetterai errori in questa fase. La cosa positiva è che anche se commetti degli errori in questa fase puoi sempre strappare il foglio, affinare la matita e ricominciare tutto da capo su un nuovo foglio. Gettare via un layout creato con Photoshop, solo perché hai capito che non è la soluzione migliore per il tuo caso è senza dubbio demotivante.
A tale proposito, ti consiglio di non confondere gli schizzi con la creazione di WireFrame: stiamo parlando di due cose diverse, anche se vedo che c'è una certa confusione sull'argomento. Qualche giorno fa un web designer mi ha detto, citando le sue parole esatte? Ah, usi carta e penna? Faccio tutto online? , menzionando un sito che consente di creare prototipi con una precisione matematica, con un controllo completo sui colori e sulla tipografia.
Bene, questo non è un abbozzo, questa è completamente un'altra cosa. Facendo clic con il mouse su alcuni pulsanti per far apparire alcuni rettangoli non ti permette di dare una forma alle tue idee e di liberare il tuo flusso creativo, cerca di credere. Con questa affermazione non dubito dell'utilità di un buon wireframe, voglio solo sottolineare le differenze tra questi due approcci.
Metti da parte la tua brama di precisione, righello e bussola! In questa fase non c'è spazio per ordine e rigore, quindi non limitare il flusso creativo, bloccandoti su margini e spazi bianchi, puoi pensarci in seguito. Allo stesso modo, non ti preoccupare se non sei particolarmente dotato artisticamente e le tue abilità manuali difficilmente ti permettono di tenere una matita: lo sketch è usato per riordinare le idee non per formare artisti dotati.
A questo proposito dobbiamo aggiungere che anche se lo sketch è nato come un mezzo di espressione libero di immaginazione e creatività a parte le tue abilità grafiche, questo non significa che lo schizzo non abbia anche, in un certo modo, un valore artistico. Vediamo insieme di cosa sto parlando.
La tendenza di molti web designer a disegnare ha dato il via a un vero e proprio stile grafico che richiama in qualche modo gli aspetti estetici del disegno: abbiamo pennelli che mimano la sua spontaneità e leggerezza, per non parlare di centinaia di caratteri in stile scritto a mano facilmente trovato nel web. Grazie a tali risorse che creano oggi un layout in stile schizzo è abbastanza semplice, ma oltre a questi disegni che utilizzano questo stile grafico di solito hanno un tocco di originalità che li rende accattivanti e fuori dal comune.
Lo stile di schizzo, solo perché è associato a un'attività comune a molte creatività, è spesso utilizzato in siti di liberi professionisti o di agenzie di comunicazione / progettazione che desiderano trasmettere graficamente questo concetto. Ad ogni modo, anche la combinazione di alcuni elementi di schizzo con una grafica più tradizionale può dare una nuova prospettiva a disegni altrimenti ordinari.
Vediamo come alcuni siti hanno utilizzato questo stile in modo efficace e originale e come questo ha influenzato l'estetica e l'efficacia dei loro layout.
http://www.kunalchhajer.com/ Il sito del web designer Kunal Chhajer riflette esattamente il concetto di stile dello schizzo. La grafica è leggera e piacevole, è arricchita in modo originale da alcuni disegni che rendono unico il layout. Lo stile è anche richiamato nell'uso di un font scritto a mano nel menu di navigazione. Tutti questi dettagli danno al design la creatività che un designer vuole esprimere nel suo sito personale.
http://www.creativewithak.com/ Nel sito Creative with a K c'è un uso massiccio di schizzi e scarabocchi, solo per mostrare chiaramente la natura creativa? del sito. In questo caso anche la peculiarità del layout, così atipico, rende il sito speciale e inusuale, anche se è difficile consultarsi.
http://www.lega-lega.com/ Il sito Lega-Lega è un negozio online di camicie con stampe un po 'fuori dal comune e si rivolge in modo definitivo ad un mercato giovane. L'aggiunta di alcuni dettagli dello schizzo dà un taglio creativo e vivace al sito.
http://beavory.com/ Beavory è il sito / blog di Karen Mack, illustratore israeliano. Lo stile del suo sito è volutamente basato su uno stile che richiama la sua natura creativa in modo pronunciato e originale. Ogni dettaglio, dalla struttura del layout basata su linee irregolari - come se fossero disegnate con un pennarello - alle icone del social network traccia completamente uno stile di schizzo efficace.
http://bowtieperiod.com/ Bowtie è uno studio digitale che ha deciso di rappresentarsi davvero in modo creativo sul web. Le animazioni del sito, insieme a disegni carini e insoliti, rendono il layout attraente e fortemente stravagante. Si definiscono? Creativi? e, per dimostrarlo, usano elementi in stile schizzo.
http://www.makomako.cz/home/ Il layout della band MakoMako è completamente creato in stile sketch, in modo che la stessa struttura della pagina sia basata su un foglio di carta con linee irregolari, e nella homepage come parte del design, troviamo oltre ai soliti dettagli grafici basati su schizzi e caratteri scritti a mano, una matita. Un look curioso e molto insolito per una band.
http://stanthesnowman.com/ Ora che è quasi estate, gran parte del suo fascino svanisce, ma l'efficacia grafica del sito Stan the snowman è comunque fuori questione. In questo caso l'aggiunta di immagini stilizzate e di un font calligrafico conferisce uno stile spontaneo al layout, giocoso e informale. E traccia il concetto di attività, basato sulla scrittura di biglietti di auguri.
http://www.greenawaypro.co.uk/ Il festival Greenaway Pro 2011 combina in modo particolare e accattivante lo stile di schizzo e lo stile grunge, conferendo al suo layout un'impronta davvero originale. Anche in questo caso la scelta di questo particolare stile grafico tende ad esprimere un aspetto informale, spontaneo ed eccentrico. Perfetto per un festival che si occupa di musica e surf, giusto?
http://www.julianlaval.com/ Julian è un altro web designer freelance che vuole mettere in luce le sue capacità grafiche, sfruttando il potere comunicativo dello sketch in modo davvero creativo. Certo, non è solo questo a rendere speciale il suo sito, ma anche la natura curiosa e volutamente inconsueta dei suoi disegni. Come molti altri siti in questo stile, i colori sono limitati a una scala di grigi, per rendere le illustrazioni più realistiche.
https://www.littlecreatures.com.au/ Il sito Little Creatures è completamente progettato in stile schizzo e grazie alla particolarità dei suoi schizzi, così poco rifinito, la pagina è così attraente.
http://carnetordinaire.com/ Carnet Ordinaire è un sito che è come un diario, con appunti di viaggio, annotazioni e considerazioni personali. Considerando la natura eccentrica e intima del sito, lo stile di schizzo è il più appropriato: il layout è basato sull'immagine di una moleskine aperta, arricchita da schizzi e disegni stilizzati. Anche lo sfondo è reso più originale con alcuni cartoni inseriti in opacità e dalla presenza di una matita, lasciata casualmente vicino alla moleskine.
http://www.wingcheng.com/ Il portfolio Wing Cheng è un perfetto esempio della prospettiva fresca che lo stile di schizzo può dare a un layout. La struttura della pagina è basata su una moleskine socchiusa, dalla quale cadono le pagine. L'effetto è reso più drammatico grazie alle ombre che incorniciano il design e l'uso di caratteri calligrafici per ogni contenuto del layout, dai titoli dei progetti alla loro descrizione. Ma la vera particolarità di questo sito riguarda l'esposizione dei progetti, anch'essi tracciati a matita in modo davvero creativo.
http://www.kutztown.edu/acad/commdes/faculty/ L'università di comunicazione e design di Kutztown non è riuscita a trovare un modo migliore per rivolgersi efficacemente a creativi o aspiranti. Il layout è certamente insolito per una realtà accademica: lo sfondo in stile acquerello, la pagina basata su una pagina di un libro, le illustrazioni in acquerelli, i caratteri particolari del menu di navigazione? tutti i dettagli originali e certamente espressivi.
http://www.dannwhittakercreative.com/ Dann Whittaker nel suo sito mostra uno stile grafico comune a molti web designer. Un look casual e spontaneo, basato su un layout di un libro di pagine e su un uso coerente dei dettagli nello stile di schizzo. Nel complesso, il layout è molto efficace e piacevole esteticamente.
http://www.chernobylheart.org.uk/ Nel caso del sito di Chernobyl Heart, lo stile di schizzo è usato per evidenziare graficamente il concetto di infanzia: qui stiamo parlando di bambini e lo vediamo attraverso alcuni piccoli schizzi stilizzati che copiano il loro modo di disegnare. Efficace e piacevole.
http://demainjarrete.stpo.fr Lo stile di schizzo è perfetto per presentare fumetti e illustrazioni web, in modo che il layout rappresenti visivamente e creativamente la natura del sito. Nel caso Demain J'arrete, l'intero sito ha un? Carbone di legna? stile grafico, partendo dal gradiente dello sfondo alle linee irregolari che contengono il layout e il menu di navigazione.
http://www.natureshop.co.nz/ Aggiungendo un paio di dettagli dello schizzo in modo apparentemente casuale, puoi dare quel tocco creativo speciale a un sito minimale ed essenziale. Il risultato, visibile ad esempio nel sito Nature Shop, è estremamente piacevole.
http://www.readytomarket.net/ Il layout di Ready to Market è un esempio di come mescolare uno stile moderno con alcuni dettagli stilizzati e comici può dare un risultato nuovo e stimolante.
http://www.coucoushop.ch/ Il Cou Cou Shop è molto bello e piacevole da vedere. Uno degli elementi più particolari del layout è senza dubbio il footer, che mostra un paesaggio stilizzato della Svizzera. Anche lo schizzo della borsa da diverse angolazioni è un dettaglio molto originale.
http://upsidedowntown.me/ Colorato, insolito e stravagante: il sito del centro di apprendimento Upside-Down Town investe molto sull'originalità dello stile di schizzo. Ogni elemento del layout, in particolare nella rubrica, indica l'efficacia visiva di disegni, schizzi e colori che evidenziano graficamente e in modo piacevole il mondo dei bambini.
Abbiamo visto come il processo di sketch può aiutarci a elaborare le idee in modo creativo e, allo stesso tempo, come alcuni schizzi possono dare una prospettiva diversa e originale ai nostri layout. Fai abbozzare un'abitudine quando inizi a lavorare su un nuovo progetto di design - e non solo- può diventare estremamente utile anche in altri campi, come nel copywriting - e nel tempo svilupperai una flessibilità mentale che diventerà utile nel tuo lavoro. Quindi per concludere: spegni il computer e prendi carta e penna!
Finisco di condividere con voi due bozzetti personali: uno schizzo del mio attuale portfolio e le prime idee che ho messo per questo articolo, durante un viaggio davvero noioso in treno.
Ora è il tuo turno, voglio vedere i tuoi schizzi!
Accentsconagua