Alcuni siti Web sembrano grandiosi, anche se sfidano la saggezza convenzionale oi principi della teoria del design. Una nuova tendenza di design sta mettendo in mostra quella stessa idea con elementi che coprono o ostacolare parte del testo nel design.
È una tendenza interessante perché va contro tutto ciò di cui si parla comunemente con il design - che deve essere leggibile per connettersi rapidamente con gli utenti.
Inutile dire che questa può essere una tecnica complicata da tirare fuori efficacemente, ma i progetti sono sorprendenti e di grande impatto se fatti bene. Ecco una ripartizione della tendenza e alcune idee su come puoi provare tu stesso.
Semplice ostruzione
Se il testo è trattato in un disegno, tutto il resto deve essere visivamente semplice in modo che l'utente non si perda in troppi effetti.
Ad ogni breakpoint reattivo, il testo non è più oscurato di nessun altro.Root Studio fa un ottimo lavoro con una prima impressione che attira l'attenzione con i colori e la semplice giraffa animata che copre parte delle lettere sovradimensionate. Il trucco qui è che anche se alcune delle lettere sono ostruite, non c'è dubbio su quale sia la parola sullo schermo. Le lettere sono ancora leggibili, a causa delle dimensioni, della semplicità del carattere tipografico e del posizionamento dell'elemento ostruttivo.
Il team di progettazione ha prestato particolare attenzione all'ostruzione del testo per mantenere l'integrità di? ROOT ,? che è il marchio di questo particolare sito web. Ad ogni breakpoint reattivo, il testo non è più oscurato di nessun altro. (Questo è il motivo per cui molti di questi progetti non sono all'altezza. Hanno un bell'aspetto sulle risoluzioni del desktop, ma il testo è troppo ostruito per poter essere letto su schermi più piccoli.)
Strati tridimensionali
L'aggiunta di un effetto a più livelli tridimensionale può aiutare gli elementi a saltare fuori dallo schermo in modo che gli utenti si sentano quasi in grado di raggiungere e toccarli. Il testo può fungere da elemento di sfondo in alcuni casi.
Assicurati che il livello in cima al testo non copra troppo della parola (o delle parole). Ed è sempre fondamentale assicurarsi che le ostruzioni di testo non risultino in parole indesiderate a causa del posizionamento di altri elementi.
Simply Chocolate utilizza bene questo effetto di stratificazione. Funziona principalmente a causa della combinazione di caratteri sovradimensionati che utilizza parole comuni in un carattere grassetto e un elemento superiore che non è molto grande e contiene esattamente le stesse parole che sono oscurate dall'elemento caramella.
Questo trattamento rende le grandi lettere sullo sfondo più di un elemento grafico che leggibile, creando un nuovo contrasto e un effetto di stratificazione eccezionale. (Potresti trovarti a scorrere tutti i diversi gusti di caramelle per vedere come creano l'effetto in modi diversi).
Dimentica le regole dello spazio
A volte le ostruzioni di testo in realtà non coprono le lettere ma invadono il loro spazio.
È una di quelle regole che North Street rompe senza che il design sia ingombrante o disarticolato. La descrizione della società si scontra con la regola verticale centrale sullo schermo (il resto del design utilizza questo divisore per un'estetica a schermo diviso).
Se qualcuno dicesse che useranno questo trattamento, probabilmente proverai a convincerli altrimenti, ma qui funziona. La composizione visiva è così leggera - grazie all'abbondanza di spazio bianco - e le loro scelte tipografiche sono abbastanza audaci che la linea grigia leggera quasi cade sullo sfondo anche se entra nello spazio che dovrebbe essere riservato per il testo.
Una seconda linea grigia divide ulteriormente il testo nella navigazione, ma la maggior parte degli utenti probabilmente non noterà nemmeno l'ostruzione.
Solo per caratteri grandi
Guardando tutti gli esempi qui, probabilmente noterai un tema comune. Tutte le lettere ostruite sono piuttosto grandi e usano caratteri tipografici semplici.
Le scritte piccole in genere non ti danno abbastanza spazio per coprire parte del testo in un modo che sembra intenzionale. Se progetti di progettare con un'ostruzione di testo, dovrebbe essere intenzionale e avere un significato.
Gli script complicati degli stili di novità sono troppo difficili da leggere con un elemento sopra di essi.Coprire piccoli caratteri è incredibilmente difficile, in termini di design e leggibilità. Ecco perché la tecnica è abbinata a tipografia sovradimensionata.
Questi ampi caratteri, spesso sans serif, sono facili da leggere a colpo d'occhio e spesso hanno larghezze di corsa medie e grandi ciotole e contatori che rendono più pratico l'uso di elementi di stratificazione. Per far funzionare questo concetto, hai bisogno di lettere con forme che si prestino a questo concetto. Gli stili di tipo sottile o condensato spesso non funzionano e gli script complicati degli stili di novità sono troppo difficili da leggere con un elemento sopra di essi.
Elementi con poco contrasto
A volte l'ostruzione del testo non è un elemento che si trova in cima al testo; è la relazione tra l'elemento testuale e ciò che lo circonda. Una mancanza di contrasto tra il testo e gli elementi di sfondo può comportare anche un'ostruzione del testo.
Ancora una volta, questo può essere un concetto difficile da realizzare efficacemente. Il testo esiste innatamente per essere letto. Una mancanza di contrasto può renderlo difficile.
Se abbinati a testi altamente leggibili, gli elementi di testo a basso contrasto sono sottili promemoria sullo schermo. Questi elementi saranno letti dopo altri elementi di contrasto più alti.
Nella progettazione di Anew, sopra, la descrizione dell'attività è più importante della marca. Questo è ciò che il design dice agli utenti a causa del tipo di trattamento. Le parole chiave? Rooftop + test kitchen? sono facili da vedere e leggere. Il nome? Nuovo? appare in una posizione a basso contrasto sotto il marchio. L'occhio è ancora attratto dal logo grande, ma non è il punto focale principale quando si tratta di leggere e raccogliere informazioni.
Parte del motivo per cui questo trattamento funziona in questo spazio è a causa del contenuto del design.Pensa alla simbiosi tra la parola? e i piatti luminosi bianchi. Sembra fresco, diverso e allettante.
Conclusione
I disegni di testo ostruiti stanno diventando sempre più popolari. Non molto tempo fa avresti avuto difficoltà a trovare qualcosa con questo stile online. (I progetti di stampa l'hanno usato in modo più coerente perché i progettisti non dovevano preoccuparsi dei punti di risposta sensibili).
Fai solo attenzione a creare qualcosa con un testo che non è completamente visibile. Assicurati che le parole continuino a dire (e significano) ciò che intendi. In caso di dubbi su come un disegno verrà percepito o letto, quando si utilizza testo ostruito, prendere in considerazione un'altra opzione. Non vuoi mai rendere il tuo design difficile da capire per gli utenti.