Questa non è la tipica carrellata di trame da utilizzare per gli sfondi del sito web. Se stai cercando una texture specifica, li abbiamo qui. Ma cosa succede se si desidera creare il proprio? O trovi un modo per personalizzare una texture per adattarla al tuo progetto? Questo è quello su cui ci concentreremo oggi.
Anche se ci sono molti modi per utilizzare le trame nel web design, otterrai molto più chilometraggio di questi sfondi se segui un approccio moderno e segui alcune semplici regole. Ecco sette suggerimenti per aiutarti a utilizzare le trame di sfondo nel web design in modo corretto (e in linea con i modelli e le tendenze di progettazione del 2018).
1. Diventa semplice e comprensibile
Un'ottima texture di sfondo potrebbe non essere notata da molti utenti. Dovrebbe essere un elemento quasi invisibile che contribuisce alla leggibilità generale e all'usabilità fornendo allo stesso tempo profondità o interesse visivo.
Trame di sfondo semplici e sobrie sono il modo perfetto per farlo. Per un evento alla fine dello scorso anno, la Conferenza Universo di Github ha utilizzato un design che includeva un semplice sfondo nero con punti bianchi. L'effetto del cielo notturno scende davvero sullo sfondo in modo che il logotipo gradiente divertente e le informazioni sugli eventi siano facili da trovare.
Le texture di sfondo semplici tendono ad avere schemi ripetuti piccoli o stretti e possono avere quasi tutti i colori. L'idea è che queste trame di sfondo non sono un punto focale; servono per aiutare a portare l'attenzione sul resto del design.
2. Diventa grande e audace
Forse sottile non è la tua cosa. In questo caso, scegli una trama o uno schema di sfondo grandi e in grassetto.
Questi stili più grandi della vita funzionano per i progetti in cui il primo piano è più pesante di testo o di interfaccia utente e non ci sono altre immagini concorrenti da gestire. L'uso di questo tipo di texture di sfondo può risultare complicato, dalla creazione di un motivo di piastrellatura invisibile all'utente che impedisca che lo sfondo diventi inavvertitamente il punto focale principale dell'intero progetto.
Per garantire che la trama di sfondo sovradimensionata funzioni, tieni d'occhio analisi e abitudini dell'utente una volta per apportare le modifiche. Una brusca diminuzione del traffico o delle conversioni è un segnale che immagini e utenti potrebbero non connettersi.
3. Incorporare una tendenza
Una trama di fondo con una tendenza può rendere il tuo design ultra moderno e fresco.
Con forme geometriche come la rabbia in questo momento, non c'è da meravigliarsi che il sito Web di Apacio è attraente. Con un mix di geometrie colorate brillanti su uno sfondo scuro, il pattern crea una bella trama e profondità che aiuta l'utente a concentrarsi sul grande testo e chiama all'azione perché questi elementi contrastano con lo sfondo. Il testo - semplice lettering sans serif - sembra sollevare proprio dalle forme verdi.
La stratificazione delle trame contribuisce anche a questo effetto complessivo. Nota che il colore separa due strati di sfondi con elementi più scuri? elementi più luminosi.
4. Usa un'immagine
Una trama di sfondo non deve essere un motivo ripetuto estratto da un sito di download. Alcune delle migliori trame di sfondo sono immagini che si riferiscono al marchio o alla messaggistica principale per aggiungere un altro livello di interesse visivo e coinvolgimento.
Il trucco consiste nel dissolvere efficacemente l'immagine sullo sfondo. (E questo non significa necessariamente usare una tecnica di dissolvenza.) Dissolvenza dell'immagine significa che esce dall'area dell'immagine principale e in lontananza.
Nell'esempio sopra, Oxeva lo fa in due modi: Scurisce la foto in modo che solo i contorni siano visibili del paesaggio urbano, e utilizza in primo piano un trattamento di colore audace per attirare l'occhio in modo naturale. La foto ha anche un po 'di sfocatura, in modo che l'immagine è distinguibile, ma non con un livello di dettaglio che rende importanti i punti fini della foto.
5. Usa variazioni di colore
Mescolare e abbinare tinte e toni della stessa tavolozza di colori per creare una texture audace da lettere o forme. Le variazioni di colore, anche quelle della stessa famiglia, possono creare profondità e interesse visivo.
Tipi di tipi utilizza una divertente combinazione di colori con lettere giganti per creare la trama dello sfondo. Anche senza tecniche come sfumature o ombre, le linee delle forme delle lettere stabiliscono profondità e equilibrio, mentre aiutano a disegnare l'occhio verso il punto in cui i colori dello sfondo si incontrano e il titolo principale si trova.
6. Afferra un gradiente
Le sfumature sono alla moda e visivamente coinvolgenti. Quando si tratta di utilizzare una sfumatura come trama di sfondo, è possibile utilizzarla da sola o sovrapporla a una foto.
Quasi tutte le combinazioni di colori vanno, quindi usare una sfumatura per creare texture e profondità non è difficile. Puoi trovare una combinazione di sfumature che ami da WebGradients se non hai ancora in mente campioni con cui lavorare.
Mobipaid utilizza sfumature multiple e sottili per creare profondità e texture sullo sfondo. Le animazioni illustrate in primo piano quasi spuntano dai gradienti e l'invito all'azione di colore scuro è facile da vedere. Spazi più chiari e più scuri nella texture del gradiente aiutano a muovere l'utente attraverso il design a colpo d'occhio.
7. Animalo
Mentre molti dei suggerimenti si sono concentrati su elementi di sfondo statici, non esiste una regola che dica che uno sfondo non può essere dinamico.
Per sfruttare al meglio questo tipo di texture di sfondo, il movimento dovrebbe essere sottile in modo da non sminuire l'immagine principale o la messaggistica. Anche una tavolozza di colori tenui o tenui, come l'alfabeto lettone, è un'ottima opzione.
Questa animazione può includere elementi che si muovono o girano o girano o video. Il movimento è un buon modo per attirare l'attenzione degli utenti. Ottieni il massimo da una texture di sfondo animata assicurandoti che questo movimento non sommerga il primo piano del disegno.
Conclusione
Un'ottima texture di sfondo può aggiungere profondità e interesse visivo al design generale del tuo sito web. Mentre molti designer usano ancora più sfondi piatti, come il singolo colore, aggiungere un tocco di texture può far risaltare il tuo progetto.
Il trucco per usare le trame è che devono essere sottili e in realtà cadere nello sfondo in modo che gli elementi in primo piano siano facili da leggere e comprendere. Questo può essere un equilibrio piuttosto delicato. Ricorda di stabilire un sacco di contrasto tra trame di sfondo e immagini in primo piano, elementi dell'interfaccia utente e testo per massimizzare l'impatto del design complessivo.
Trame di sfondo
Scegliere la giusta trama di sfondo per il tuo sito web o progetto di design può essere complicato. La nostra serie ti insegna come lavorare e incorporare trame di sfondo, oltre a dove trovare una grafica straordinaria con cui lavorare.