Mosaico Elearning
Carriere
ChiamaciParliamo

Percorso Mosaico

Livello 1

Esplora Mosaico e sblocca l'accesso speciale ai nostri prodotti e servizi.

Harry
Parliamo del tuo progetto
Torna al blog

Digital Learning

Consigli di Visual Design per Newbie

Consigli di Visual Design per Newbie
Mano che regge un tablet con icone colorate e la scritta e-learning, simboli della formazione digitale

Come grafico e visual designer professionale, ho potuto lavorare su progetti in molti campi. Come tale, ho usato e visto molte tecniche per creare ottimi risultati nel progetto finale. Ci sono gli errori di progettazione che il tuo professore universitario ti ha detto di non fare mai (come usare il carattere tipografico Papyrus per qualcosa di diverso da una barzelletta), e poi ci sono le tecniche che (si spera) sono intrinsecamente parte del tuo nucleo creativo. Queste sono le basi del design che usiamo ogni singolo giorno così tante volte che potremmo anche non renderci conto consapevolmente di farlo.

Numero 4 viola e testo Graphic Design Tips for eLearning Newbies su sfondo chiaro, copertina per principi di visual design

Ecco quattro suggerimenti che ogni designer, newbie o professionista possono e deve usare in ogni progetto. Questi suggerimenti riguardano il contrasto, la ripetizione, i margini e l’allineamento. Se il tuo progetto è un corso elearning, un banner web, un catalogo di prodotti o un poster, si applicano tutti questi principi e suggerimenti. Sempre.

Contrasto

Il contrasto, un principio chiave del design, è un concetto molto più che ampio del nero rispetto al bianco.

Può essere realizzato e utilizzato in molti modi, come il contrasto di:

  • Testo su un colore di sfondo
  • Caratteri tipografici: serif vs. sans serif)
  • Stile carattere: ad esempio, Grassetto vs. Corsivo
  • Valore del colore / tonalità
  • Scala
  • Forme
  • Immagini
  • Modelli / trame, altri vari elementi di design

Indipendentemente dal tipo di contrasto che stai utilizzando, l'obiettivo è quello di aiutarti a organizzare il tuo progetto, stabilire una gerarchia (creare enfasi) e mantenere visivamente impegnato lo spettatore. Un design in cui tutto è della stessa dimensione, forma o colore sarà terribilmente noioso… sì, atrocemente!

Esempio di contrasto debole:

Griglia di nove quadrati viola con due lettere C di diverso contrasto che mostra il principio del contrasto nel visual design

Esempio di contrasto migliore:

Esempi di forme geometriche e testo che illustrano il principio del contrasto nel visual design per eLearning

Al contrario, troppo contrasto può essere altrettanto brutto di nessuno. Il tuo progetto può diventare molto confuso e gli spettatori si possono sentire come se i loro occhi venissero aggrediti. Inoltre, se tutto è in contrasto, nulla spicca.

Quindi qual è il trucco veloce per diventare un “master contraster”? Mi dispiace dirlo, ma non esiste. Lavorare, esercitarsi, fare pratica aumenteranno le tue già fantastiche abilità di design. Puoi anche guardare i disegni di altri artisti e studiarli per vedere come usano il contrasto nel loro lavoro.

Ripetizione

La ripetizione è quando riutili gli stessi elementi o elementi simili in tutto il tuo progetto.

Ad esempio, se op dovessi costruire un corso eLearning o di formazione con più diapositive e interazioni, vorrei riutilizzare cose come colore, caratteri tipografici (anche le dimensioni), motivi / trame di sfondo e altri elementi di progettazione che possono essere ripetuti.

La ripetizione porta un chiaro senso di coerenza, coesione e unità; ma, come la maggior parte delle cose, non devi esagerare.

Queste parole suonano familiari, ad esempio quando ti viene chiesto di costruire un marchio per te o per un cliente? Su una scala molto più ampia, l'uso coerente di elementi ripetuti contribuisce a creare il marchio di una società e svolge un ruolo importante nella fiducia di un consumatore con tale società.

In questi esempi per una campagna, possiamo vedere il tipo, il colore e le forme ripetuti (il motivo a triangolo e le forme angolari ripetute nel logo e negli elementi di sfondo, nonché i simboli colorati):

Due elementi grafici coordinati che ripetono colori, forme e motivi per promuovere un evento eLearning

Margini

L'uso improprio dei margini mi fa assolutamente impazzire, e lo stesso dovrebbe essere anche per te. Dare ai tuoi contenuti abbastanza spazio per "respirare" è molto importante. I margini aiutano a dare al tuo progetto uno spazio bianco in modo che gli occhi degli spettatori abbiano un posto dove riposare, mantengano un design pulito ed equilibrato e contribuiscano a non farlo sembrare così claustrofobico.

I margini dovrebbero anche essere sempre considerati quando si posiziona il testo in un box colorato o sopra un'immagine. Si applicano gli stessi principi: assicurati che ci sia molto spazio intorno ai tuoi contenuti. Renderà più facile leggere e far sembrare le proporzioni corrette.

Esempio di uso improprio dei margini:

Elementi grafici e testo troppo vicini ai bordi mostrano un uso scorretto dei margini nei progetti eLearning

Esempio di uso corretto dei margini:

Composizione grafica con forme geometriche viola e rosa che mostra l’uso corretto dei margini nei progetti eLearning

C'è, come sempre, l'eccezione alle regole, come il fatto che il testo, le immagini o gli elementi del disegno scompaiano dalla tua tavola da disegno. Tuttavia, assicurati di essere consapevole di ciò che stai facendo e che lo stai facendo con uno scopo. Esempio di elementi che scompaiono dalla pagina che utilizza margini appropriati:

Esempio di box colorato che esce dai margini del layout mentre il testo rimane allineato correttamenteAllineamento

A volte non prendiamo la decisione cosciente di guardare come le cose sono allineate, e questo è male. Inizia guardando oggetti ed elementi vicino ai tuoi margini. Sono allineati, spinti a fianco e a filo con il tuo margine?

I margini non si applicano solo alla parte più esterna del tuo file. Assicurati:

  • Che ci sia lo spazio giusto e uniforme tra le colonne e le righe di contenuto interno;
  • Di allineare tutti i contenuti e gli elementi visivi in una colonna o riga insieme.

Se eseguito correttamente, il risultato finale è molto gradevole alla vista e crea una linea implicita che lo spettatore può seguire facilmente.

Esempio di utilizzo e allineamento di oggetti in colonne e righe:

Griglia con forme geometriche e testo che evidenzia l'importanza di margini e allineamento nel visual design eLearning

Questo è tutto! Ora buttati e crea fantastici progetti, giovane designer!

Traduzione autorizzata. Fonte. Ti è piaciuto questo articolo? Segnalalo ai tuoi colleghi o utilizza i tasti social in alto per condividerlo!

Articoli correlati