In breve
- Una texture di sfondo è un dettaglio fine della superficie, come la grana, le fibre della carta, un tessuto o il vetro satinato, sovrapposto a un colore o a un gradiente.
- La texture funziona meglio a bassa intensità, percepita più che vista, così aggiunge calore senza competere con il contenuto che ci sta sopra.
- La scala della texture deve corrispondere alla dimensione di visione: grana fine per schermi piccoli e visione ravvicinata, texture più grossolana per formati grandi visti da lontano.
- Sovrapporre la grana a un gradiente nasconde il banding, perché il dettaglio casuale spezza i gradini visibili tra le sfumature.
- Le piattaforme social e i codificatori video ricomprimono le immagini, e questo può impastare le texture molto fini: controlla la texture dopo il caricamento.
In questa pagina
Una texture di sfondo è un dettaglio fine della superficie steso su un colore o un gradiente: il puntinato della grana della pellicola, le fibre della carta, la trama del lino, la brina del vetro. È ciò che fa leggere uno sfondo come un materiale e non come pixel. La regola che conta di più è l’intensità. Una texture che senti senza notarla rende un design più caldo e più prezioso; una texture che noti per prima diventa il soggetto e combatte con tutto ciò che c’è sopra.
Un gradiente con texture su un post verticale: la superficie si legge come un materiale, e le parole restano in primo piano.
Tipi di texture di sfondo
| Texture | Dà la sensazione di | Ideale per |
|---|---|---|
| Grana o rumore | Pellicola, stampa, una finitura opaca | Gradienti, sfondi scuri, tutto ciò che fa banding |
| Carta | Stampato, artigianale, editoriale | Citazioni, diari, inviti, brand calmi |
| Tessuto e lino | Morbido, intrecciato, tattile | Moda, interni, ospitalità |
| Vetro satinato | Moderno, a strati, luminoso | Interfacce, card sopra il colore, brand tech |
| Mezzatinta e punti riso | Stampa retrò, zine, poster | Post social giocosi ed editoriali |
| Pietra e cemento | Solido, architettonico, silenzioso | Lusso, architettura, fotografia di prodotto |
Ogni texture porta con sé un’associazione. La grana dice pellicola e stampa, la carta dice artigianale, il vetro dice interfaccia. Scegli quella che corrisponde a ciò che il tuo brand deve trasmettere, poi usala ovunque; la carta su un post e il vetro su quello dopo annullano l’effetto. Se non hai ancora deciso che sensazione dare, personalità del brand ha un modo semplice per scegliere.
Scala: adattare la texture alla dimensione di visione
La texture si legge in modo diverso a dimensioni diverse. Uno schermo di telefono tenuto vicino mostra ogni granello, quindi basta una grana fine. Un poster visto dall’altra parte di una stanza o una slide su un proiettore hanno bisogno di una texture più grossolana per farsi notare. E una texture che va bene su un post da 1080×1350 può sparire quando una piattaforma lo riduce a miniatura, o trasformarsi in macchie quando viene ricompressa.
Story 1080×1920: fine
1080 × 1920
Post 1080×1350: fine
1080 × 1350
Slide 1920×1080: media
1920 × 1080
Stampa A3 3508×4961: grossa
3508 × 4961
In stampa la grana in genere resiste bene e aiuta anche a riprodurre i gradienti in modo pulito; stampare i gradienti tratta i dettagli.
Texture sopra i gradienti
L’abbinamento più utile è la texture sopra un gradiente. La grana spezza i gradini visibili che compaiono nelle sfumature lisce, il cosiddetto banding, e fa sembrare stampato un gradiente digitale. Il metodo abituale è mettere la texture come livello separato sopra il colore e fonderla con una modalità come Sovrapponi o Luce soffusa a bassa opacità, così ombreggia il colore invece di coprirlo.
- 1
Parti dal colore
Sistema prima il gradiente. La texture non salva colori che non stanno bene insieme.
- 2
Aggiungi un livello di texture
Mettilo sopra il gradiente. Usa una texture grigia o neutra, così non colora il colore.
- 3
Fondila
Imposta il livello su Sovrapponi o Luce soffusa. Luce soffusa è più delicata e mantiene puliti i colori.
- 4
Abbassa l’intensità
Riduci l’opacità finché noti la texture solo se la cerchi, spesso molto sotto la metà.
- 5
Controlla la zona più scura
Il banding si nasconde nelle sfumature lente e scure. Assicurati che la texture vi abbia sciolto ogni gradino.
Sul web lo stesso approccio richiede poche righe di codice; vedi texture di rumore in CSS. Per capire perché la grana in particolare sta così bene sui gradienti, leggi gradienti con grana.
Texture e leggibilità
Evita
- Texture forte direttamente dietro il testo piccolo
- Motivi ad alto contrasto, come una trama di lino marcata sotto il testo corrente
- Due o tre texture diverse in un solo design
- Texture così fine da impastarsi dopo il caricamento
Fai
- Texture appena visibile, o una zona più calma dove stanno le parole
- Texture a basso contrasto in tonalità vicine di un solo colore
- Una sola famiglia di texture in ogni formato
- Controlla la versione caricata, non solo l’esportazione
La texture aggiunge rumore visivo vicino alle lettere, e il testo piccolo ne soffre per primo. Tieni la texture appena visibile dove sta il testo, oppure dai alle parole una zona calma e uniforme dello sfondo. Testo su sfondi affollati tratta le tecniche nel dettaglio.
Texture e colore che attraversano le parole…
…e lo stesso sfondo che fa spazio calmo dietro di esse.
Una texture che resta coerente
La texture si perde facilmente da uno strumento all’altro: un livello di grana in un file, un’immagine di carta in un altro, un’intensità diversa a ogni esportazione. In Gradiently la texture fa parte dello sfondo stesso. Un Mark sovrappone fino a tre materiali con grana e luce, così la stessa superficie viene resa dietro ogni design a ogni dimensione, e la sua zona più calma si sposta dietro le parole.
GR·N4D7·V5
Evening Station
Vedi questo MarkLe domande più frequenti
Cos’è una texture di sfondo?
Un dettaglio fine della superficie, come la grana, le fibre della carta, la trama di un tessuto o il vetro satinato, sovrapposto a un colore o a un gradiente perché si legga come un materiale fisico.
Quanto deve essere forte una texture di sfondo?
Appena visibile. Dovresti notarla solo se la cerchi. Se la texture è la prima cosa che vedi, riducine l’opacità.
Aggiungere texture risolve il banding dei gradienti?
Di solito la grana sì. Il dettaglio fine e casuale spezza i gradini visibili tra le sfumature, così il passaggio sembra liscio.
Quale modalità di fusione devo usare per la texture?
Luce soffusa per un effetto delicato che mantiene puliti i colori, oppure Sovrapponi per uno più forte. Usa una texture grigia neutra, così non colora il colore.
Perché la mia texture sembra macchiata sui social?
Le piattaforme ricomprimono i caricamenti, e questo può impastare le texture molto fini. Usa una texture un po’ più grossolana e controlla il risultato caricato.
Scritto da Gradiently
Il team dietro Gradiently, uno strumento di design costruito attorno ai Mark: gradienti vivi che fanno sembrare tuo tutto ciò che progetti.
Vedi il nostro profilo
