20 elementi e principi di progettazione che ogni designer dovrebbe conoscere

C'è stato un tempo in cui il design era troppo controllato. Troppo modellato. Troppo sicuro.

Ma l'evoluzione è inevitabile e i designer hanno iniziato a sperimentare un po' di più.

Da lì, i design sono diventati più audaci e migliori. I progettisti hanno iniziato a scavare più a fondo nella scienza alla base del comportamento del loro pubblico, consentendo loro di diventare flessibili a ciò che il mercato richiedeva.

[twitter_link]Oggi, il design è diventato più che semplici modelli e tendenze. È diventato uno stile di vita.[/twitter_link] Qualcosa che è accuratamente intrecciato in ogni reazione e routine umana. E sotto le complessità che derivano da questo stile di vita si nascondono 20 diversi principi di design che rendono questo mondo un posto più creativo e bello in cui vivere.

Diamo un'occhiata a questi principi e ai suggerimenti per sfruttarli nei tuoi progetti.

Linee

Guarda ovunque intorno a te e vedrai delle linee. I bordi dello schermo del tuo computer. I lati di ciascun tasto sulla tastiera. Anche le lettere su quei tasti sono composte da linee, alcune diritte, altre curve, altre oblique.

Questo è esattamente quanto sono importanti le linee. Senza di loro, tutto si fonderebbe l'uno nell'altro all'infinito, rendendo il mondo un unico blob.

Ciò che rende le linee ancora più stupefacenti, oltre al fatto che definiscono la forma di ogni cosa, è il fatto che si traducono anche in emozioni e idee che sollecitano reazioni equivalenti. Metti una linea ondulata accanto a una linea verticale diritta, per esempio, e inizierai a pensare all'ordine e alla forza da un lato e al caos e alla confusione dall'altro. Questo può essere molto utile se stai chiedendo al tuo pubblico di rispondere a determinati inviti all'azione. Nel momento in cui i loro stati d'animo e le loro emozioni sono stati impostati, è più facile passare attraverso il tuo invito all'azione.

Un altro ruolo che le linee giocano nel web design è il fatto che guidano gli occhi del pubblico verso i punti focali di ogni pagina. Ad esempio, forti linee guida sotto il nome del marchio in un mare di altri testi più piccoli aiuteranno quel nome a risaltare.

Scala

Scala definisce come ridimensionerai i diversi elementi in un singolo disegno. Fondamentalmente porta la logica in un pezzo o la toglie. Ad esempio, se dovessi disegnare una formica proprio accanto a un cane, avrebbe senso solo rendere il cane molto più grande della formica (a meno che il disegno non imponga di deviare dalla realtà).

La scala è anche il modo migliore per creare drammi. Come accennato in precedenza, ci saranno casi in cui dovrai allontanarti dal realismo e creare effetti sbalorditivi ridimensionando alcuni elementi significativamente più piccoli o più grandi di altri.

Il ridimensionamento è anche un ottimo modo per enfatizzare la gerarchia. Prendi i poster dei film, per esempio. Gli attori con ruoli importanti di solito fanno risaltare le loro immagini rispetto agli altri, non perché siano più alti o più grandi degli attori secondari, ma perché i loro personaggi sono più importanti.

Ora, supponiamo che tu stia lavorando a qualcosa che contiene molto testo e non molte immagini. Il ridimensionamento si rivela ancora il modo migliore per enfatizzare alcuni dettagli rispetto agli altri. Le statistiche, ad esempio, possono essere ridimensionate in modo significativo per attirare gli occhi del pubblico direttamente su quel dato.

Colore

È incredibile quanto impatto abbia il colore su tutto. Sono stati condotti studi su studi sugli effetti del colore non solo sugli stati d'animo e sulle emozioni di una persona, ma anche sulle sue reazioni e decisioni di acquisto.

Riesci a immaginare di vedere un'azienda ambientale che usa nient'altro che bianco e nero per il proprio marchio? O un'azienda che vuole trasudare un'aura professionale e valori tradizionali utilizzando vivaci colori al neon? Questa, penso, è una spiegazione sufficiente per mostrare quale ruolo gioca il colore nel design.

Consistenza

Quando pensi alla Coca-Cola, ti immagini i colori verde o blu? Probabilmente no: la tua mente salta automaticamente al colore rosso.

Questa è la coerenza.

Progettare per un marchio è una questione di coerenza. Si tratta di utilizzare le stesse identiche sfumature, toni e tinte dello stesso identico colore, nonché gli stessi identici tipi di carattere. Rapporti d'ufficio, cartelloni pubblicitari, banner pubblicitari: ogni singola cosa associata al marchio dovrebbe essere sempre coerente. Dopotutto, se la Coca-Cola cambiasse la propria combinazione di colori ogni anno o giù di lì, pensi che provocherebbe ancora lo stesso richiamo del marchio che ha adesso? Penso di no.

Spazio Bianco

Lo spazio bianco non significa necessariamente che sia bianco, ma significa sempre la stessa cosa, indipendentemente dal colore. È lo spazio inutilizzato tra i tuoi elementi, quello spazio negativo di cui vanno matti molti designer.

Ad alcuni, tutto quello spazio inutilizzato sembra essere un tale spreco. Ma aspetta di usare quello spazio a tuo vantaggio lasciandolo strategicamente vuoto. Puoi aprire un nuovo livello di creatività che lascerebbe a bocca aperta il tuo pubblico.

Non mi credi? Dai un'occhiata a Sky and Water di MC Escher e capirai esattamente cosa intendo.

Simmetria

Sapevi che i tuoi occhi sono naturalmente attratti da qualsiasi cosa simmetrica? Questo è il concetto di cui hanno approfittato marchi come Target e Chanel, rendendo i loro loghi incredibilmente memorabili.

La simmetria è una cosa che porta un senso di equilibrio e ordine a qualsiasi progetto. Potrebbe non essere così ovvio a volte, ma per ogni grande opera d'arte arriva un modo unico di formare simmetria per compiacere l'occhio.

Opacità

L'opacità di un elemento di design mostra quanto sia "trasparente". Determina quanto tutto sia trasparente. Tutto ciò che ha un'opacità inferiore è fondamentalmente più chiaro, mentre gli elementi che hanno un'opacità maggiore sono più solidi alla vista.

L'opacità può aiutarti a sovrapporre elementi diversi uno sull'altro senza eliminare del tutto la presenza di quelli sottostanti. Viene anche utilizzato per aggiungere un senso di movimento a un'immagine.

Struttura

Senza trama, qualsiasi disegno potrebbe sembrare vuoto e semplice. Aggiungi un po' di texture e il design prende vita, facendolo sembrare pronto per uscire dallo schermo o dalla superficie su cui è stampato.

Questo non significa che ogni pezzo di design richieda texture. Ci saranno sempre progetti di design che avranno un aspetto migliore quando sono puliti e nitidi. Tuttavia, ci saranno anche casi in cui un po' di texture non farebbe male.

Puoi ravvivare la trama del tuo disegno aggiungendo uno sfondo che aggiunge profondità alla superficie. Puoi anche provare a goffrare alcuni elementi.

Bilancia

L'equilibrio a volte può essere confuso con la simmetria, ma in realtà sono due cose diverse. Quando le cose sono simmetriche, ogni elemento potrebbe terminare sullo stesso margine o potrebbe esserci lo stesso numero di elementi su entrambi i lati di una pagina. Sebbene questo di solito si traduca in un senso di equilibrio, puoi anche ottenere quella sensazione senza utilizzare un design simmetrico.

Supponiamo, ad esempio, che desideri progettare una pagina di informazioni con del testo e un'immagine. Puoi trovare un senso di equilibrio con un layout a due colonne anche se il testo non è un elemento identico all'immagine.

L'equilibrio è solo qualcosa che fa sembrare completo un pezzo di design. Quando un'immagine è sbilanciata, può sembrare semicotta o, peggio, priva di ispirazione.

Gerarchia

La gerarchia mostra quali elementi sono più importanti rispetto a tutto il resto. Ciò non significa che gli elementi alla fine della gerarchia (gli ultimi alimentatori, per così dire) siano cose di cui puoi fare a meno. Dopotutto, senza gli elementi all'altro capo della gerarchia, non saresti in grado di ottenere la quantità di impatto a cui miri.

La gerarchia può essere espressa in tanti modi diversi oltre al ridimensionamento. Puoi usare colori più brillanti per quelli in cima alla catena alimentare, con il colore che diventa più chiaro man mano che ti sposti più in basso.

Contrasto

Il contrasto è la regola degli opposti. Fondamentalmente distingue la luce dall'oscurità, grande contro piccolo. Per i designer che mirano sempre a far emergere uno o due elementi dal loro design, il contrasto è solitamente uno degli approcci che usano.

Ma il contrasto va molto più in profondità della semplice estetica. Il contrasto influisce anche sulla leggibilità. Usa due colori che sono quasi gli stessi per il testo e lo sfondo e probabilmente ti caverai gli occhi cercando di leggere cosa dice il testo. Utilizzando due colori ad alto contrasto, i tuoi occhi vedranno immediatamente ciò che dovrebbero vedere.

Inquadratura

Vedi come una cornice mette un confine attorno alle immagini che ci metti dentro? Ecco a cosa serve l'inquadratura. Fondamentalmente ti mostra cosa dovrebbe e non dovrebbe far parte dell'immagine.

Contorni della scatola, margini: tutte queste sono forme di inquadratura. Consente inoltre di evidenziare alcuni elementi rispetto ad altri, come una singola citazione al centro di una pagina piena di testo.

Puoi anche essere creativo e utilizzare altre cose per la tua cornice oltre alle solite linee e margini. Ad esempio, un poster a tema spiaggia potrebbe utilizzare conchiglie allineate attorno al testo per inquadrarle in modo efficace.

Griglia

Cercare di allineare le cose su uno spazio vuoto può essere difficile, motivo per cui le griglie sono molto importanti nel design.

Le griglie aiutano i progettisti ad allineare e disporre gli elementi. Un perfetto esempio di ciò sarebbero le colonne su una pagina di una rivista o un giornale. Riesci a immaginare di avere tutto quel testo posizionato in modo casuale senza la guida di una griglia? Sarebbe un disastro cercare di dare un senso.

D'altra parte, se stai cercando un design un po' meno rigido, rompere la griglia è un modo meraviglioso per creare istantaneamente un senso di caos. I nostri occhi tendono a cercare naturalmente il layout e la griglia di un disegno, quindi uscire da quella struttura contribuirà a creare un senso di disordine.

Spontaneità

Certo certo. Abbiamo bisogno di equilibrio. Abbiamo bisogno di simmetria. Segui la griglia. Usa le linee per incorniciarlo. Ma tutto ciò non significa che tutto debba essere fatto secondo il manuale. A volte, è necessario anche un po' di follia per creare un design sorprendente.

Solo perché hai già una chiara divisione tra colonne e righe non significa che non puoi inserire improvvisamente una citazione nel mezzo senza seguire i frame esistenti. Se questo è il modo migliore per far risaltare quella linea, allora così sia.

Mentre progetti, prenditi una pausa dalle tue “regole” e trova spazio per un po' di spontaneità – qualcosa di inaspettato. Questo potrebbe essere proprio ciò di cui ha bisogno il tuo design.

Direzione

Questo può anche essere indicato come segnali visivi o grafici. Posiziona un'immagine di qualcuno che punta verso il tuo pulsante di invito all'azione e gli occhi di quasi ogni singolo lettore andranno immediatamente dritti a quel pulsante.

Naturalmente, anche gli occhi seguono determinati schemi mentre guardano una pagina. Gli studi dimostrano, ad esempio, che i modelli più comuni seguiti dagli occhi sarebbero una forma E, F o Z. Questo è il motivo per cui è meglio posizionare il contenuto più importante in alto a sinistra della pagina, poiché l'istinto naturale degli occhi sarebbe quello di spostarsi prima dall'angolo in alto a sinistra a quello in alto a destra.

Regole

Sì, sebbene la creatività sia spesso spontanea, ci sono ancora molte regole di progettazione che dovresti seguire. Ma poi di nuovo, infrangere queste regole ogni tanto ti spingerebbe anche a creare pezzi sorprendentemente belli.

Quindi, come fai a sapere quando seguire le regole e quando infrangerle?

Innanzitutto, devi essere esperto con le basi in modo da sapere esattamente cosa stai rompendo. Quindi, assicurati che infrangere le regole corrisponda al punto che stai cercando di chiarire.

Movimento

Non hai bisogno della magia per creare movimento sul design stampato. Ci sono così tanti effetti che puoi usare che ti permetterebbero di dare l'impressione che un'immagine si muova.

Su un'immagine di un bambino che va in bicicletta, ad esempio, puoi sfocare il resto dell'immagine intorno a lui per mostrare che sta sfrecciando accanto a tutto ciò che incontra. Puoi anche usare le linee di movimento, così come gli effetti onda. Puoi anche usare l'opacità per dare l'illusione ottica del movimento, come con questo logo disegnato da Vladimir Mirzoyan sopra.

Profondità

Certo, i design piatti sono di gran moda da un paio d'anni. Devi ammettere però che l'aggiunta di profondità ad alcuni dei tuoi progetti si adatta ancora meglio. Dopotutto, quanto è sorprendente che qualcosa di fisicamente bidimensionale possa effettivamente sembrare che stia saltando fuori da una pagina?

Esistono diverse tecniche che puoi utilizzare per creare profondità nei tuoi progetti, ad esempio:

• Ombre
• Sovrapposizione
• Giocare con la prospettiva (si ottiene un effetto 3D)

Se il tuo design sembra che potrebbe richiedere un po' di vita, prova uno di questi approcci e guarda l'immagine prima di sollevarti dalla sua superficie.

Tipografia

Potresti avere tutte le immagini, le trame, gli sfondi e altri elementi del tuo design, ma se la tua tipografia ha bisogno di un po' di lavoro, allora l'intero design è compromesso. La tipografia non è solo stili di carattere e dimensioni dei caratteri. Ha anche qualcosa a che fare con il ridimensionamento, la spaziatura, il colore e molti altri concetti di base del design.

Poiché la tipografia copre molto terreno, probabilmente saresti più illuminato se leggessi questi libri su come migliorare la tua tipografia.

Composizione

Invece di essere un elemento a sé stante, la composizione è in realtà una combinazione di alcuni degli elementi di cui abbiamo discusso in precedenza. Scala, gerarchia, profondità: tutto questo e molto altro contribuisce alla composizione complessiva di un progetto.

La composizione, nel suo senso più elementare, copre la disposizione complessiva di ogni singolo elemento del tuo progetto. Immagina solo tutti gli elementi di cui abbiamo discusso: se mescolati insieme, il risultato finale funziona o no? È così che misuri la composizione.

20 elementi diversi, 20 modi diversi per creare o distruggere un design. Tieni sempre accanto a te un elenco di questi elementi mentre lavori e lascia che sia la tua guida mentre cerchi di affrontare le sfide che derivano dal completamento del tuo prossimo progetto di design.