shh! Non condividere questo segreto da insider sui principi di progettazione CRAP

L'utilizzo dei principi di progettazione CRAP è un modo straordinario per creare un design visivo efficace.

“COSA?!” avete detto tutti, vero? Bene, questa è stata sicuramente una sorpresa per te se non avevi mai sentito parlare di CRAP prima. Robin Patricia Williams, una fantastica autrice americana che ha scritto molti libri sull'informatica, ha descritto una serie di principi di progettazione grafica nel suo libro, The Non-Designer's InDesign Book. L'ha chiamata CRAP.

(Puoi anche leggere una breve intervista con lei qui ).

Allora, cos'è CRAP? Non quello che conosciamo, ovviamente!

Bene, per creare design efficaci e accattivanti, dovremmo essere coerenti. La coerenza viene fornita con l'implementazione di basi e fondamenti che sono sempre necessari. Queste basi sono gli elementi essenziali che ogni designer dovrebbe considerare costantemente.

Come graphic designer, il tuo lavoro è produrre qualcosa che affascini lo spettatore in un modo in cui non può lasciare il sito web. Gli spettatori devono essere incollati ai loro posti con il tuo design grafico avvincente e, per questo, arriva CRAP.

CRAP è un acronimo che sta per Contrasto, Ripetizione, Allineamento e Prossimità.

1. Contrasto

Il contrasto è descritto come "giustapposizione di elementi dissimili (come colore, tono o emozione) in un'opera d'arte". Il contrasto è la cosa che fa risaltare gli elementi. Prima di approfondire, c'è un consiglio che dovresti considerare. Se usi una funzione di contrasto troppe volte, stai semplicemente riducendo il contrasto, non aumentandolo. Come mai? Perché contrasto significa cosa significa quando vuoi che alcuni elementi si distinguano. Se tutto risalta, niente risalta! Come elemento importante nei principi di progettazione di schifezze, devi sapere come usarlo bene. Quindi, veniamo a questo!

Colore

Puoi usare la differenza di colore per creare contrasto. Il World Wide Web Consortium (W3C) ha creato linee guida sul contrasto minimo necessario tra il testo e il suo sfondo. Sebbene avere un contrasto elevato sia un must quando si tratta di testo e sfondo, questo non è vero quando si parla di elementi diversi. Avere un contrasto elevato tra i diversi elementi può affaticare gli occhi degli utenti. Puoi guardare una versione in scala di grigi del tuo progetto per vedere se è stato utilizzato o meno il contrasto ottimale.

Come regola generale, utilizzare sfumature di colori complementari che non creano un contrasto elevato che affatica gli occhi può essere una buona pratica.

Misurare

Le differenze nelle dimensioni degli elementi, soprattutto quando si tratta di testo, possono essere fonte di contrasto. Mantenere le dimensioni di un elemento significativamente più grandi di quelle che lo circondano lo renderà accattivante. Anche i pulsanti di invito all'azione (CTA) possono beneficiare di queste dimensioni maggiori. I tuoi spettatori li noteranno di più e ti aiuteranno con il tuo CRO. Inoltre, se hai bisogno di ulteriore aiuto con le tue strategie CRO, controlla questa guida.

Forma

Avere forme diverse può generare il contrasto che stai cercando. Puoi vedere in modo efficace il contrasto nella forma utilizzata nelle infografiche. L'uso di forme diverse l'una accanto all'altra può aiutare a coinvolgere le menti dei lettori. Anche l'aggiunta di angoli arrotondati a forme quadrilatere o l'utilizzo di elementi quadrati insieme a elementi rotondi e circolari possono essere esempi di forme contrastanti.

Font

Possiamo classificare i caratteri in diversi gruppi. Serif, Sans-serif, script, monospaced e display sono le classificazioni dattiloscritte di base. L'uso di diversi gruppi di caratteri può creare contrasto per il testo che vogliamo significare. Inoltre, l'utilizzo di diversi pesi dei caratteri (grassetto o normale), stili dei caratteri (corsivo, opaco o normale) e decorazioni dei caratteri (sottolineato, barrato, ecc.) può portare il tuo gioco a un livello superiore.

2. Ripetizione

Come esseri umani, le nostre menti sono programmate secondo schemi di simpatia; Li cerchiamo ovunque. Cosa crea i modelli? Ripetizione! Inoltre, creiamo un senso di identità quando incontriamo una ripetizione delle cose. Pensa a un brano musicale in cui i temi principali non vengono ripetuti. Ti sentiresti perso.

La stessa identica cosa accade nel design. Abbiamo bisogno di ripetere colori, forme, trame, dimensioni e altri attributi nel nostro design per renderlo coerente e dargli una sorta di identità. Inoltre, le aziende utilizzano la ripetizione nel design per costruire la consapevolezza del marchio. Ripetono un set predefinito di colori e caratteri per portare coerenza nelle loro diverse piattaforme e canali.

La ripetizione nel design è un altro principio importante nei quattro principi CRAP del design. L'utente ha bisogno di sentirsi al sicuro, non perso. Aiuta a ottimizzare la UX del tuo sito web.

3. Allineamento

L'allineamento, come un altro fattore cruciale nei principi di progettazione CRAP, specifica il posizionamento di un elemento nel progetto. È ciò che dà coesione e senso di ordine a un progetto. In termini di elementi, puoi allinearli in base ai loro bordi o ai loro centri. Tuttavia, i testi possono essere allineati a sinistra, a destra, al centro o semplicemente giustificati. A seconda della lingua del testo utilizzata, gli allineamenti sinistro e destro, essendo LTR o RTL, sono i più popolari. Possiamo usare l'allineamento al centro per brevi intervalli di testo (ma è difficile da leggere su testi più lunghi). La giustificazione è una buona scelta quando la lunghezza della riga è lunga, la dimensione del carattere è piccola e le parole sono più corte (usarla su righe strette composte da parole lunghe riduce la leggibilità).

Ogni disegno dovrebbe avere alcune linee verticali che fungono da guide di allineamento orizzontale. Il testo che fluttua ovunque sulla pagina confonde solo il tuo visualizzatore. I tuoi spettatori dovrebbero essere semplicemente in grado di realizzare la relazione di ogni parte della pagina tra loro.

4. Prossimità

Ultimo ma non meno importante, la vicinanza è un altro principio che gioca un ruolo fondamentale nella progettazione CRAP. La prossimità nel design afferma che dovremmo mettere elementi che si relazionano tra loro e sono strettamente associati tra loro. Ha senso, no? Non vuoi cercare un link relativo all'articolo che stai leggendo nella barra di navigazione, vero? Inoltre, la spaziatura uniforme degli elementi in tutta la pagina rende il design più difficile da seguire. Raggruppa gli elementi correlati il ​​più possibile per rendere più facile per il tuo visualizzatore trovare le informazioni desiderate.

La seconda regola delle 3

"Ci vogliono solo 3 secondi per innamorarsi."

Quindi, il test finale che puoi fare per vedere se il tuo design CRAP è impeccabile è verificare se è efficace in 3 secondi. Puoi farlo da solo schiarendo la mente e distogliendo lo sguardo, quindi tornando indietro. Puoi anche chiedere ad un amico oa un parente le loro opinioni dopo 3 secondi. Decidiamo se qualcosa ci attrae e se vogliamo continuare o meno in soli 3 secondi.

Il rapporto

Non dovremmo usare questi principi in isolamento. La ripetizione e l'allineamento lavorano insieme per fornire lo stato "normale", che consente di modificare la forma o la posizione di una parte di testo per generare contrasto. Inoltre, ripetizione e prossimità lavorano insieme per produrre formati efficaci come gli elenchi puntati: la ripetizione del punto elenco enfatizza la vicinanza dei punti.

Conclusione

Oscar Wilde, nella prefazione del suo libro più famoso, “Il ritratto di Dorian Gray”, afferma: “L'artista è il creatore di cose belle. Rivelare l'arte e nascondere l'artista è lo scopo dell'arte”.

Infine, l'obiettivo è che lo sforzo che dedichi alla creazione di un documento svanisca, diventi invisibile, consentendo al tuo lettore o visualizzatore di accedere senza restrizioni alle idee che stai tentando di comunicare, sia direttamente nel testo che in modo sempre più sottile, tramite la tua scelta di componenti di design. A questo proposito, è un lavoro ingrato poiché poche persone noteranno (o noteranno) la qualità del design, ma noteranno e agiranno in base al messaggio. Non è di questo che si tratta?