Come progettare l'immagine di intestazione Twitter perfetta
Twitter ha recentemente lanciato un design aggiornato per le pagine del profilo, che consente di inserire una nuova "foto di intestazione" che si trova in cima al feed, proprio come l'immagine di copertina della timeline di Facebook.
Oggi ci immergeremo e vedremo alcuni esempi di buone immagini del profilo Twitter e discuteremo di come puoi progettare il tuo. Lancerò anche un modello gratuito in modo da poter iniziare subito.
Esplora Envato Elements
Modello gratuito!
Prima di approfondire l'articolo, ecco un pratico modello gratuito che puoi utilizzare per progettare la tua immagine di intestazione di Twitter. Il file fornito è un PSD creato in Photoshop CS6.
Prendi il tuo PSD gratuito: fai clic qui per scaricare.
Come usarlo
Per utilizzare questo modello, è sufficiente sostituire l'immagine di sfondo. Il gruppo di livelli dell'interfaccia utente è pensato per aiutarti a farti un'idea di come apparirà l'immagine una volta implementata sul sito. Nascondi i livelli raggruppati prima di salvare.
Scopri il nuovo profilo Twitter
C'era una volta, Twitter era un servizio incentrato sul testo. In questi giorni, cercano costantemente di migliorare l'esperienza visiva integrando funzionalità e supporto multimediali.
La riprogettazione del profilo più recente spinge questa idea attraverso flussi di foto più importanti e una nuova funzionalità: l'intestazione del profilo Twitter.
Come puoi vedere, questa nuova immagine si trova nella parte superiore dei tuoi tweet recenti e contiene l'immagine del tuo profilo, nonché un breve testo su di te. Per aiutare a lanciare i nuovi profili, Twitter sembra aver collaborato con NBC, quindi molti dei nostri esempi verranno dai loro vari account (non tutti gli utenti hanno ancora effettuato l'aggiornamento).
In definitiva, questo non sta aggiungendo un sacco di lavori di progettazione al tuo profilo, è semplicemente un'immagine extra. Tuttavia, anche una piccola immagine può portare molte domande, quindi sono qui per rispondere ad alcune che potresti avere mentre ti avvicini alla costruzione dell'immagine dell'intestazione di Twitter.
Come si imposta l'intestazione del profilo?
La prima domanda che devi porre è: come accendi questa cosa? Se vai al tuo profilo, sembrerà come sempre. Attualmente, gli utenti che non hanno impostato un'immagine di intestazione manterranno il vecchio design.
Per aggiornare il tuo profilo, fai clic sull'ingranaggio Impostazioni in alto a destra nella pagina. Da qui, fai clic sulla scheda "Design" nella barra di navigazione a sinistra.
Una volta che sei nella pagina Design, scorri verso il basso fino alla sezione "Personalizza il tuo". Qui vedrai un pulsante "Cambia intestazione". Basta fare clic su di esso e caricare l'immagine per impostare l'intestazione.
Questo è tutto quello che c'è da fare! Ora devi solo decidere cosa mettere lì!
Che misura?
La prossima domanda importante da porre quando si progetta l'intestazione del proprio profilo è "Che taglia?" Se diamo un'occhiata alle immagini NBC che Twitter ha sicuramente contribuito a configurare personalmente, vediamo che le dimensioni sono 520 px di larghezza e 260 px di altezza.
In definitiva, questo si divide in un rapporto 2: 1 tra larghezza e altezza con una dimensione massima di upload di 5 MB o 1252 px per 626 px.
Suggerimenti e considerazioni sulla progettazione
La dimensione dell'immagine che carichi non è certamente l'unica considerazione che devi tenere a mente. Ho notato alcune stranezze che devi assolutamente sapere se riuscirai a realizzare un design di successo.
Guarda la tua leggibilità
Per sperimentare lo spazio sul mio account personale, ho scattato una foto casuale che ho fatto di un display digitale a New York City. Sembrava che avrebbe reso il perfetto sfondo astratto. Ecco il risultato:
Come puoi vedere, è un aspetto abbastanza attraente. Il problema però è che sta interferendo un po 'con il testo, e io sono un dado di leggibilità.
Ovviamente, con il testo bianco, vorrai uno sfondo decentemente scuro. Il mio si adatta a questa descrizione, ma le luci fungono da punti luminosi che riducono il contrasto tra le lettere e lo sfondo e aggiungono troppe distrazioni.
La soluzione qui è piuttosto semplice, ho appena oscurato lo sfondo in cui si trova il testo in modo che le luci non interferiscano così tanto. Il risultato non è altrettanto bello visivamente, ma è molto più leggibile:
Twitter Viti con la tua immagine
Le persone su Twitter sanno che il trucco che ho usato sopra, scurendo il fondo dell'immagine, è qualcosa che dovrà essere fatto su molte immagini. In realtà, il sito lo fa automaticamente se lo vuoi o no.
Come test, ho preso questa immagine e l'ho preparata per l'intestazione Design Shack. Ecco cosa vedo in Photoshop:
Ora, se carico quell'immagine come la vedi sopra, ecco il risultato come appare sulla nostra pagina del profilo:
Vedi la differenza? Un gradiente di sfondo è stato applicato automaticamente, scurendo notevolmente i colori originali. È un effetto sottile sulla maggior parte delle foto ma quando entri in qualcosa con meno dettagli si distingue davvero.
Questa non è certamente una cosa negativa, aiuta davvero il testo a risaltare, è solo qualcosa da tenere a mente mentre prepari la tua immagine. Inoltre, tieni presente che Twitter applica automaticamente gli angoli arrotondati sia al profilo che all'immagine dell'intestazione.
Suggerimenti per la progettazione
Ora che sappiamo tutto su come creare e applicare la nostra immagine, diamo un'occhiata in giro e vediamo cosa stanno facendo gli altri in quest'area per trarre ispirazione.
Integra la tua immagine del profilo
Uno dei migliori che abbia mai visto finora è quello di Ryan Seacrest. Adoro l'integrazione della foto del profilo nell'immagine dell'intestazione. Brillante. Puoi aspettarti di vedere tonnellate di utenti che provano a farlo in diversi modi.
Mostra il tuo lavoro
Graham Smith, il designer di logo preferito da tutti, ha colto al volo l'opportunità di aggiornare il suo profilo immediatamente. La sua idea è semplice ed efficace: mostra il suo lavoro in una griglia di loghi discreta e discreta.
Abbina lo sfondo del tuo profilo
Una cosa da tenere a mente quando si lavora sull'immagine dell'intestazione è che in realtà fa parte di un design più grande e dovrebbe andare bene con l'immagine di sfondo.
Lo vediamo bene sul seguente account di notizie. L'immagine dell'intestazione è una mappa del mondo rossa composta da pixel.
Questa è in realtà la stessa immagine che hanno usato sullo sfondo della pagina, solo più piccola e di colore diverso. Questo rende piacevole l'aspetto coerente.
Adoro come lo sfondo di grandi dimensioni sia la versione più sottile mentre l'immagine dell'intestazione attira davvero la tua attenzione con un colore audace.
Keep It Simple
Se hai problemi a trovare una buona immagine di intestazione, ricorda tre parole potenti: mantienila semplice. Anche a parte l'immagine, c'è molto da fare in questo spazio e il tuo obiettivo è quello di legare tutto insieme, non complicarlo eccessivamente.
Nella famiglia allargata di Twitter vediamo alcuni esempi positivi e negativi di questo. Il co-fondatore di Twitter Evan Williams ha sicuramente scelto male la grafica con una grafica troppo impegnata per questo spazio.
Confronta questo con l'immagine utilizzata dal creatore di Bootstrap di Twitter Mark Otto. La sua scelta è molto migliore:
Questo è carino, semplice e in realtà piuttosto sorprendente. La maggior parte dell'immagine è uno spazio bianco (spazio nero in questo caso) quindi non c'è molto da interferire con il testo. Il contenuto rappresenta un evento carico di emozione e meraviglia per tutti noi, il che rende un'esperienza memorabile.
Mostraci i tuoi!
Ecco qua, tutto quello che devi sapere per creare l'immagine dell'intestazione Twitter perfetta. Ora che hai letto i miei consigli e visto una grande ispirazione, creane uno tuo con il nostro modello gratuito!
Una volta che la tua immagine di intestazione di Twitter è pronta, lascia un commento qui sotto con un link in modo che possiamo vedere cosa ti è venuto in mente.
