Share
Oggi daremo un'occhiata a un principio di progettazione che gioca un ruolo importante nel successo di un web design: Unity. Come con molti elementi progettati nel mondo, l'unità può creare o distruggere il design di un sito. Un sito ben "unificato" si sente naturale, organico e senza soluzione di continuità; Dove un sito privo di unità può sentirsi sconnesso, discontinuo e scombussolato (in altre parole, cade a pezzi visivamente). Continuate a leggere per saperne di più!
L'unità è un concetto interessante. Se diamo un'occhiata alla definizione tecnica, ce ne sono alcuni che possono essere applicati nel contesto del web design? come "lo stato di essere uniti o uniti nel suo insieme" e "l'armonia o l'accordo tra persone o gruppi". Nello specifico, però, possiamo guardare ad una definizione che si applica a questo scenario come alle regole d'oro del buon web design: "lo stato di formazione di un completo completo e piacevole".
Unity è molto importante perché aiuta a creare un marchio e un'identità coerenti per il tuo sito. Crea una connessione tra i tuoi elementi in modo che gli utenti possano passare facilmente da un elemento all'altro e anche tra le diverse pagine del tuo sito web. Fondamentalmente, il concetto di unità crea una forte relazione tra gli elementi in modo che l'utente li percepisca come uno, non come un gruppo.
Pensare in questo modo. Se vivi in una casa fatta di mattoni, non dici "vivo dentro un mucchio di mattoni". Invece, tu dici "Io vivo in una casa". Questo perché hai un gruppo di elementi diversi (vale a dire i mattoni) che sono unificati come una casa e le persone prendono nella struttura come edificio singolo grazie alle connessioni e alle forti relazioni tra i mattoni (letterali).
Lo stesso vale per molte cose nel mondo naturale. Considera la foglia a destra. Contiene milioni di celle e altre strutture di blocchi, ma la maggior parte delle persone la pensa come una foglia.
Unity tiene insieme il tuo progetto come struttura, sia visivamente che concettualmente. Aggiunge l'organizzazione e faciliterà il viaggio dell'utente sulla tua pagina Web perché non è necessario elaborare ogni elemento singolarmente. Questo, indirettamente, aiuta a spingere il contenuto fuori e permette all'utente di concentrarsi sul messaggio principale della pagina web.
Ci sono molti fattori che contribuiscono al senso di unità all'interno di una pagina web. Tuttavia, prima di provare ad applicare uno di questi, è necessario assicurarsi di capire qual è lo scopo principale del progetto. Lo scopo del design dovrebbe essere supportato dal design unificato che rende tutto visibilmente collegato e più facile da percepire.
Ora spieghiamo un po 'di più come ognuno di questi fattori può essere utilizzato per creare una forte relazione tra gli elementi.
Come abbiamo già stabilito, il colore può essere un ottimo modo per formare una connessione tra gli oggetti. Quasi tutto si attacca a una combinazione di colori - sito Web o meno - poiché aiuta a creare una relazione, specialmente se utilizzata in connessione con un prodotto o con un'entità non web. Ad esempio, il sito Web Coca-cola (vedi sotto) utilizza i colori rosso e bianco primari, lo stesso del suo prodotto di punta. Pertanto, il nostro utilizzo del prodotto può essere immediatamente collegato al sito grazie alla sua consistenza di colore.
L'unità attraverso il colore può anche essere generata semplicemente assicurandosi di seguire una combinazione di colori definita nei progetti. Non essere coerenti in questo senso si tradurrà in un design che si sente distaccato perché mancherà una delle più grandi influenze a un collegamento visivo. Possiamo persino arrivare a dire che puoi danneggiare la tua unità se la tua scelta non è legata al tuo tipo di prodotto, come il modo in cui il verde può essere collegato alla finanza.
Elementi ricorrenti che sembrano identici formano una connessione dal momento che il tuo cervello penserà, "hey, l'ho già visto prima!". Crea familiarità all'interno del design in modo che i tuoi utenti non siano obbligati a rielaborare quella parte particolare del tuo sito web di nuovo. Connette le pagine attraverso la loro somiglianza, quindi il tuo obiettivo principale è sul contenuto e sul messaggio che desideri inviare.
Naturalmente, la ripetizione di elementi non è l'unico metodo per creare unità nel tuo progetto. Usare semplicemente fattori simili (come il colore o la tipografia) può collegare gli elementi del tuo design perché sembrano simili. Utilizzando la stessa combinazione di colori, lo stesso stile del bordo o solo lo stesso carattere può allegare le pagine, o gli oggetti, nella progettazione.
Per una migliore comprensione, diamo un'occhiata ad un'analogia. Possiamo guardare alla ripetizione da un'altra prospettiva: molti siti malevoli replicano il design di un sito popolare in modo che appaia all'utente come un'altra pagina di un servizio che usano ogni giorno. Una finta schermata di login di Facebook replicherà la combinazione di colori e il layout di Facebook.com così apparirà, all'utente innocente, come una pagina ufficiale dal social network. L'utente non istruito non ci penserà due volte perché il loro cervello non è costretto a rielaborare questi particolari elementi sulla pagina.
Mantenere un allineamento coerente contribuisce all'unità visiva entro un elemento. La progettazione attorno ad un asse comune rende gli elementi correlati. Un mucchio di paragrafi con lo stesso allineamento sembrano essere parte di un articolo, non solo pezzi di testo diversi gettati insieme, e finiscono per apparire organizzati e posizionati in modo pulito.
Gli allineamenti multipli richiedono solo uno sforzo maggiore per formare una connessione, ed è semplicemente troppo migliore per evitare di sprecare tempo a farlo.
Considera anche come una griglia possa avere un ruolo nell'allineamento. Limitando le dimensioni di una griglia per un nuovo designer, offre una solida base per allineare una vasta gamma di elementi su una singola griglia. Si consideri il sito Web di Squarespace qui sotto:
Nota come la semplice griglia a tre colonne trasforma una pagina piena zeppa di informazioni in una pagina ben disegnata e ben allineata che si sente unificato. Non male vero?
La prossimità è un altro concetto che contribuisce all'unità generale del tuo design. Man mano che spingi gli elementi più vicino, essi sono più facilmente presi come uno. Nel tentativo di creare un'analogia, ho potuto solo pensare a quanto segue, se avessi un branco di pecore insieme in un campo, potrebbero essere chiamate mandrie. Tuttavia, se fossero stazionati in campi diversi, potresti non riconoscerli istantaneamente come parte dello stesso mob (e sì, questo è un termine collettivo corretto per pecora). Forse un'analogia più appropriata sarebbe quella di guardare due persone che si svegliano per strada, ridendo e parlando insieme. A causa della loro vicinanza reciproca, possiamo immaginare che abbiano una relazione precedente.
Come veniamo ad applicare questo al web design, non è troppo diverso. Più vicini sono gli elementi, più forte è il rapporto che l'utente riconosce e migliore l'unità che crea. Se facciamo un passo indietro e apprezziamo che tutta l'unità in realtà significa l'interazione tra gli elementi, possiamo riconoscere che una relazione più forte si correla senza intoppi con il livello di interazione e, in tale misura, l'unità.
Abbiamo un ottimo articolo qui su Tuts + sulla direzione visiva e su come può influenzare un design. In poche parole, è la teoria che possiamo influenzare una direzione specifica di un utente su una pagina web adattando il nostro contenuto a tale obiettivo. In una certa misura, possiamo utilizzare la direzione visiva in questo scenario per aiutare gli utenti a spostarsi su un altro elemento in modo naturale.
Forse lo sto spingendo un po 'qui, ma introducendo questo tipo di manipolazione, possiamo spingere insieme gli elementi di una pagina per creare legami più forti, in modo da scivolare senza soluzione di continuità tra ognuno di essi, ma colpire tutte le aree che il designer vuole che tu faccia vedere. Questa relazione può essere utilizzata nel contesto per attirare l'attenzione dell'utente su un'altra storia sulla tua pagina web, o eventualmente per continuare a leggere una pagina. Potresti usare il concetto per incoraggiare, inconsciamente, naturalmente, qualcuno a guardare e interagire con il pulsante tweet o con "Aggiungi al carrello".
La coerenza nel tuo web design è un principio fondamentale che contribuisce all'unità. Una squadra di football non uscirebbe e giocherebbe in magliette con un colore diverso per giocatore. Invece, sono uniti come una squadra con un unico design che rappresenta il loro marchio (o in questo caso, una squadra).
La coerenza si ottiene cercando di mantenere lo stile di elementi simili uguali e si riferisce a temi come il colore, poiché sono proprio questi i fattori che creano una coerenza di successo. Per raggiungerlo, non c'è molto altro da fare se non aderire a uno schema attraverso i tuoi elementi.
L'unità fa semplicemente sentire le cose connesse e insieme facendole sembrare come dovrebbero essere. Un sito Web è un sito Web, non una barra di navigazione e una barra laterale, un logo e un contenuto. No, invece, è una cosa che visitiamo: un sito web.
Tuttavia, se disponiamo di troppi colori e caratteri, o se gli elementi vengono spostati, o se l'allineamento differisce all'interno del testo, i legami sono rotti e non si sentono più connessi. Potresti chiedere, però, perché il mio design dovrebbe essere unificato? In parole povere, significa che l'utente non ha bisogno di elaborare ogni elemento, o ogni pagina, ogni volta che ne incontrano una nuova perché è riconoscibile. Migliora anche il viaggio attraverso una pagina dal momento che il menu non sembra essere in un territorio diverso rispetto al contenuto.
Accentsconagua