Share
Nell'articolo precedente abbiamo appreso come è possibile utilizzare le dimensioni e il ridimensionamento per rendere i progetti armoniosi e chiari. In questo, il nostro ultimo articolo sulle forze invisibili nel design, scopriremo come l'uso sottile della spaziatura, spesso chiamato "spazio bianco" o "spazio negativo", può essere usato per rendere i vostri progetti comunicanti in modo efficiente.
Più lo spazio bianco è ponderato, più alto è il "rapporto dati / inchiostro". Questo è un concetto introdotto dal guru del design dell'informazione Edward Tufte. È una funzione di quante informazioni vengono trasmesse da ogni goccia di inchiostro o, in caso di mobile e web design, da ogni pixel.
Il grafico a sinistra ha un rapporto dati / inchiostro molto più alto rispetto al grafico a destra. Il grafico ha davvero bisogno di essere riempito con "inchiostro"? No, comunica bene con punti e linee.
Che cosa succede se hai fatto un passo in più, e rimosso le linee, lasciando solo i punti?
Ora, la comunicazione è andata in pezzi. Sì, puoi vedere tutti i punti dati, ma ora hai perso la "storia" su come i dati sono cambiati nel tempo. Inoltre, è diventato difficile distinguere da un semplice diagramma di grafico a dispersione, in cui "tempo" non è una delle variabili e i dati non vanno in modo lineare.
Nel primo articolo di questa serie abbiamo appreso come l'allineamento degli elementi implica relazioni tra questi elementi. Inoltre, ciò che è importante è quanto siano vicini questi elementi.
Questa è solo una semplice griglia di quadrati, come le piastrelle su un pavimento.
Ma se crei spazi orizzontali più ampi tra file verticali di quadrati, ora hai una serie di colonne.
Quindi, quando ci sono cambiamenti drastici nei dati nel grafico sopra, la mente potrebbe voler collegare i punti nella sequenza sbagliata, solo perché un punto è più vicino a un altro.
Questi principi si estendono ben oltre i grafici a linee. Sono presenti in tutto ciò che disegni. Soprattutto quando si progetta per schermi di piccole dimensioni, non si desidera che i pixel vadano a sprecare: si desidera progettare con un elevato rapporto dati / inchiostro.
I progettisti tendono a utilizzare le griglie per organizzare le informazioni in un layout. Le griglie aiutano ad allineare elementi, come linee di testo, che creano regioni di informazioni correlate l'una con l'altra.
Ecco un layout di base, progettato su una griglia. Il lato sinistro è la tua navigazione e l'area più grande contiene il contenuto principale.
Questo layout va bene, ma si noti che lo spazio bianco tra la navigazione e lo spazio bianco tra le colonne di testo all'interno dell'area del contenuto principale è lo stesso.
Avrebbe senso allargare leggermente la grondaia tra la navigazione e l'area del contenuto principale.
Ora c'è una delineazione più nitida tra la navigazione e il contenuto principale, e tutto ciò che dovevamo fare era aggiungere un piccolo spazio bianco.
Nel precedente articolo abbiamo appreso come il dimensionamento è uno dei tanti fattori che possono essere utilizzati per creare una gerarchia tipografica. Lo spazio bianco può aiutarti anche a organizzare la tua tipografia.
Ad esempio, guarda questa intestazione, i metadati e la copia del corpo.
Hanno rapporti di dimensioni armoniosi tra loro, grazie al fatto che le loro dimensioni sono scelte da una scala varia, ma, sembrano piuttosto sciatte!
Il problema è che gli spazi negativi tra questi elementi non sono stati considerati.
La linea dei metadati è già ben differenziata dall'intestazione: è di dimensioni diverse, è in maiuscolo, ed è anche leggermente distanziata un po '.
Un grande trucco consiste nell'utilizzare l'altezza del tipo di metadati per determinare quanto spazio ci dovrebbe essere tra esso e l'intestazione. Come questo:
In genere, utilizzerai i tuoi occhi per capire questa spaziatura. Non c'è un modo matematico per dirti esattamente quanto spazio ci sarebbe. È una funzione dell'altezza della linea, della quantità di margine o riempimento che stai utilizzando e delle caratteristiche del particolare tipo di carattere.
Ha senso che i metadati siano davvero vicini all'intestazione, ma l'intestazione non deve necessariamente essere così vicina alla copia del corpo. In effetti, l'intestazione e i metadati possono essere la propria unità.
Puoi usare la distanza tra la parte superiore dell'intestazione e la parte inferiore dei metadati come guida e posizionare metà della distanza tra i metadati e la copia del corpo.
Pensando al modo in cui modellerai il layout e comunicherai con lo spazio bianco, i tuoi disegni appariranno più chiari e più chiari, pur essendo più utilizzabili e convertendo meglio.
Per ora non ci sono problemi, se non l'hai già fatto, assicurati di controllare il primo e il secondo articolo della serie!
Accentsconagua