È un fatto innegabile: usare le immagini sfocate è una tecnica di design del web di tendenza nel 2015. Sembra che ovunque guardi ci sia un elemento di sfocatura.
Ma questa non è una soluzione per alcuni dei tuoi problemi con le foto. È una tecnica distinta che richiede pratica per perfezionare e attenzione ai dettagli per farlo bene. Quindi, prima di saltare sulla tendenza, pensa alle opzioni per l'utilizzo di immagini sfocate per decidere se è giusto per te e come puoi sfruttare al meglio questa tecnica nei tuoi progetti.
Le foto sfocate sono alla moda
Potremmo dedicare intere pagine al numero di siti web usando immagini sfocate. La tendenza è un grosso problema in questo momento.
Questa è la prima cosa che devi considerare quando vai avanti con un'idea che include immagini sfocate.
- Vuoi far parte della tendenza?
- Puoi usare la tendenza in un modo un po 'diverso da altri siti web?
- È il tuo stile o un po 'troppo abusato per i tuoi gusti?
- Sarai d'accordo con il design del sito dopo che la tendenza avrà corso? O avrai bisogno di una riprogettazione?
Non c'è assolutamente nulla di sbagliato nel creare qualcosa di trendy. Ma è una decisione che dovresti prendere in considerazione fin dall'inizio. La creazione di un sito Web con immagini sfocate, a seconda dello stile e dell'utilizzo che preferisci, può richiedere molto tempo e, se non hai esperienza con il software di fotoritocco, potresti richiedere una formazione aggiuntiva.
Sfocatura è una tecnica da usare con buone immagini
Questa potrebbe essere la frase più importante che leggerai quando pensi alle immagini sfocate. Funziona solo se hai buone immagini per iniziare. Blur non è un modo per risolvere? un'immagine povera.
Per dirlo in un altro modo. Se ti viene data una foto sfocata e ti viene detto di farne un sito web, non è trendy. Questa è una brutta foto. Se questa è la tua situazione, questa non è la tecnica adatta a te. (Potresti voler iniziare a pensare di creare un elemento artistico con la tipografia o cercare immagini di stock).
Ma se hai una bella immagine da cui vuoi ottenere qualche miglia in più o usarla in un modo nuovo, la tecnica sfocata è una possibilità. Ci sono molti modi per pensare alla sfocatura (ci concentreremo su ciascuno di seguito), ma il primo passo è capire come effettivamente creare la sfocatura. Adobe ha un tutorial molto carino per iniziare con Photoshop.
Sfocare l'intera immagine
Una delle cose che ha contribuito alla tendenza dell'immagine sfocata è un'altra tendenza: l'uso delle intestazioni degli eroi. I progettisti stanno mettendo insieme le tecniche per creare immagini a tutto schermo, immagini sfocate come immagini dominanti sulle pagine di destinazione dei siti web.
Il sito Web di Trellis Farm utilizza un'immagine iconica di una fattoria per darti un senso del luogo per il suo sito web. Per ulteriore interesse, la foto è in bianco e nero - per trasmettere quella sensazione di vecchio stile - e stratificata con un grande carattere tipografico per attirare la vostra attenzione. La pergamena continua quella sensazione mentre aggiunge colore al mix. La sfocatura è piacevole perché sai cosa c'è nell'immagine e aiuta l'utente a concentrarsi sul testo e sulle azioni successive da intraprendere sullo schermo.
Perché funziona:
- Uno sfondo sfocato può mettere a fuoco i livelli sopra l'immagine come il testo. Assicurati di selezionare un carattere tipografico di impatto.
- Può creare nuovo interesse con un'immagine che usi regolarmente, come una foto di marca standard.
- Può essere utilizzato con quasi ogni tipo di contenuto in quasi tutti i colori per un appeal universale.
Sfondi e immagini a strati
La sfocatura non è una tecnica a immagine intera. Parti specifiche di un'immagine possono essere sfocate per l'impatto. Mentre è più comune vedere sfondi sfocati con una nitida messa a fuoco in primo piano, alcuni designer adottano l'approccio opposto per una nuova opzione che ha uno sfondo sfocato con uno sfondo a fuoco.
L'agenzia Anchour utilizza la sfocatura nelle foto sulla sua pagina di destinazione. La tecnica utilizzata nell'immagine può essere parte della fotografia reale o è possibile creare lo stesso effetto nel software di fotoritocco. Il trucco qui quando crei questo stile di sfocatura è che non puoi dire che è stato creato? e dovrebbe sembrare naturale come se la foto fosse stata scattata in quel modo. (Nel software di fotoritocco, puoi farlo utilizzando lo strumento sfocatura gaussiana con piccole regolazioni incrementali).
Perché funziona:
- Sfocatura crea contrasto visivo e può attenuare la sensazione occupata di un'immagine.
- Cambia la prospettiva dell'immagine e la visione dell'utente della vista.
- Aggiunge dimensione a un'immagine che altrimenti potrebbe sembrare piatta per un rendering quasi 3D.
Drammatico sfocatura per l'arte astratta
Quando hai bisogno di un'immagine di sfondo per il tuo sito web, ma puoi trovare un motivo o un colore che fa il trucco, una foto con una sfocatura drammatica può essere la soluzione perfetta. Considerare una sfocatura drammatica come qualcosa che rende il contenuto fotografico non visibile a colpo d'occhio e potrebbe rendere la foto completamente irriconoscibile.
Questa è un'opzione popolare per i siti Web che stanno lanciando o promuovendo un progetto digitale con uno sfondo di foto sfocato astratto dietro un telefono che mostra il prodotto. Piction utilizza la stessa immagine sullo sfondo e nel telefono con diversi livelli di zoom e sfocatura per un design molto accattivante.
Perché funziona:
- Porta attenzione al prodotto in primo piano.
- Crea uno sfondo personalizzato anziché utilizzare uno schema che potrebbe trovarsi su altri siti web.
- Fornisce al designer il controllo sul colore e la sensazione quando si tratta di come la sfocatura astratta funzioni dalla nitidezza a colori e forme morbide, alla leggibilità dell'immagine di sfondo e alla connessione al marchio.
Sfocatura sottile per qualsiasi immagine
Un piccolo grado di sfocatura può funzionare anche in molti altri tipi di foto e non deve essere utilizzato esclusivamente per un'immagine a schermo intero. I progettisti possono aggiungere un tocco di sfocatura a un'immagine che richiede una messa a fuoco in primo piano per aiutare gli utenti a guardare le parti giuste di un'immagine, a stilizzare un logo o semplicemente a creare una visuale più complessa.
Il logo di Zeo utilizza una sfocatura sottile ma piacevole nel design rotondo. La sfocatura ti costringe a guardare il logo più da vicino a causa della forma interessante e del bordo che un lato del logo ha rispetto alla nitidezza dell'altro lato. La tecnica viene ulteriormente enfatizzata perché il design del sito web nel suo insieme utilizza la sfocatura in altri luoghi, come sullo sfondo dell'immagine dominante nella pagina di destinazione.
Perché funziona:
- Piccole sfumature possono creare un elemento di sorpresa.
- Si focalizza su parti specifiche di una foto, con attenzione visiva. (Dai un'occhiata ad alcuni dei promo sul sito di Zeo per altri usi di sfocatura sottile per il focus fotografico).
- Può darti la giusta quantità di contrasto per sovrapporre altri elementi su una sezione di un'immagine, come il testo, nello stesso modo in cui una sfocatura a schermo intero può funzionare con un'intestazione di eroe.
Usalo anche per i video
Puoi abbinare la tendenza alla sfocatura anche con un altro elemento di design caldo: il video. Puoi usarlo come faresti con qualsiasi altra tecnica di immagine. Funziona allo stesso modo (anche se gli strumenti di modifica e il processo sono leggermente diversi).
Il design di livello 2 utilizza il blu e un effetto di tipo schermo per aggiungere interesse a un video a schermo intero. (Aggiorna il browser per vedere altri video sfocati). L'effetto è divertente e fresco e funziona con video che dovrebbero avere una sensazione di vecchia scuola. I loop video veloci sono altamente leggibili e attirano l'attenzione.
Conclusione
Esistono molti modi per utilizzare efficacemente la sfocatura per i progetti di web design. Il segreto - se ce n'è davvero uno - è creare un effetto sfocato che si fonde perfettamente con il resto del design. E puoi farlo quasi pensando alle sfocature negli estremi.
Usa un sacco di sfocatura per un impatto elevato e una sensazione astratta. Usa una sfocatura minima per creare un contrasto sottile e mettere a fuoco. Come con qualsiasi progetto, testalo su alcuni utenti prima del lancio e guarda cosa ne pensano. Notano la sfocatura? (La maggior parte dei non-designer non ci penseranno davvero.)