Tendenza del design: Sfondi Bubble & Blob

Hai notato di recente tutte le forme fluide e sconfinate nei progetti di design? L'uso di bolle e macchie è di tendenza. Dai semplici cerchi ai loop di interconnessione, ai BLOB a schermo intero che si muovono e si spostano, fino alle semplici animazioni "blobby", questa tendenza si sta diffondendo ovunque.

La cosa bella è che mentre si usano bolle e blob è un elemento di design alla moda, ci sono molti modi diversi per farlo e non finirai con un design che sembra che stai solo cercando di aggiungere un elemento alla moda.

Qui, abbiamo una raccolta di mini case study di progetti di siti Web che presentano la tendenza del design di bolle e blob.

Trame di sfondo

Wed'ze

Wed'ze utilizza chiazze colorate fredde - definite da elementi un po 'arrotondati senza forma definita - per evidenziare i prodotti. Il blob mette a fuoco ogni diverso set di occhiali da sci con un diverso cambio di colore, sebbene la forma rimanga la stessa.

L'uso della forma e del colore interessanti su uno sfondo bianco netto crea un punto focale e rende un prodotto che non è poi così visivamente interessante con cui interagire.

Grazie alle dimensioni, ogni blob crea un certo flusso direzionale da sinistra a destra sullo schermo, attirando l'utente a guardare la forma, gli occhiali e quindi la descrizione dell'elemento.

Gruppo Liber Finance

Il gruppo Liber Finance utilizza una serie di bolle animate per creare un elemento artistico. Le bolle (definite più come un elemento di design rotondo e rimbalzante) includono cerchi pieni e pieni con parti ferme e mobili.

Le bolle in questo disegno fungono da filo visivo e collegano parti del sito Web in tutto il disegno. La forma viene utilizzata sotto lo scorrimento per attirare l'attenzione sul testo e sugli elementi cliccabili, nonché creare un tema per un design che non ha molte altre informazioni altamente visive.

L'uso dell'animazione è un modo efficace per creare interesse con forme semplici.

Drip Pop

Drop Pop usa un blob come segno del logo su uno sfondo troppo occupato. (Fai attenzione alla velocità di movimento se fai clic sul link.)

Il marchio è un elemento contenitore per il marchio denominativo e funziona con l'opzione di design presentata perché consente di vedere il marchio su un design vivace e colorato.

Mentre questo trattamento del logo è interessante qui, potrebbe essere più difficile usare una tecnica come questa a lungo termine.

Josh Dring

Una serie di BLOB sovrapposti crea un collage visivo per il sito Web del portfolio di John Dring.

Grazie all'uso di colori e forme interessanti, il sito è caldo e invitante. Anche se potresti non essere sicuro al 100% del tipo di lavoro che fa, il disegno astratto invita a fare clic.

Quando si utilizza uno sfondo con macchie, pensare agli elementi di stratificazione per creare un effetto di profondità. Questo può aiutare ad attirare l'attenzione e rendere il design più accattivante.

Andy Patrick

Andy Patrick utilizza anche BLOB per il sito Web del suo portfolio, ma con un approccio totalmente diverso. Dove l'esempio precedente presenta BLOB statici, le forme in questo disegno cambiano e si muovono con lievi animazioni.

Ogni blob ha anche un aspetto quasi tridimensionale grazie a scelte di sfumature di colore che enfatizzano la natura arrotondata di ciascun blob. Sembra quasi di poter raggiungere e toccare questi elementi. (Immagino che abbiano la consistenza morbida e morbida di una buona palla antistress.)

Iqor

Iqor utilizza bolle allungate come parte della scena del cielo e per consentire agli utenti di guardare oltre le nuvole e vedere cosa fa l'azienda.

Mentre queste bolle sono di natura statica, forniscono movimento direzionale grazie a un'associazione con qualcosa che si muove (nuvole nel cielo). Funzionano eccezionalmente bene grazie alle informazioni in essi contenute, fungendo da elemento artistico e informativo.

Studio Volbloed

Studio Volbloed utilizza un'altra bolla statica per le immagini nel piè di pagina della pagina Informazioni per mostrare le donne dietro l'azienda.

Mentre la maggior parte delle persone inizialmente pensa alle bolle come forme decorative, possono anche servire come elementi contenitore per le immagini. Ciò che fa funzionare queste bolle è il modo in cui le forme si collegano per formare una singola immagine.

La forma circolare si riflette anche in altre posizioni del design per una presenza di bolle leggere che è visivamente armoniosa.

Unter Freiem Himmel

Unter Freiem Himmel usa due bolle animate che sembrano bolle mentre lo schermo si carica. L'animazione si interrompe rapidamente per lasciare forme quasi perfettamente rotonde sopra il nome del sito.

Il cursore è anche una bolla semplice.

La semplice bellezza delle bolle animate in questo design è impressionante e bella. Questo esempio dimostra che non è necessario aggiungere molti elementi e tecniche per avere un design d'impatto. C'è innata bellezza nella semplicità, come dimostra questo sito web.

Hashworks

L'esempio finale di questa raccolta è di Hashworks. A prima vista potresti non vedere nemmeno le chiazze; sono un'unità connessa che funge da logo per l'azienda. Ma la versione grande del logo a destra include un'animazione interessante e molto squallida. (Fai clic per vederlo in azione.)

Il blob animato include un mucchio di pezzi che funzionano come gocce di olio nell'acqua con un design fluido con chiara separazione. Si muovono, si piegano e rimbalzano finché ciascuno dei singoli blob in movimento forma il logo del singolo blob collegato.

È una di quelle animazioni semplici e geniali che puoi guardare ancora e ancora perché è così ben fatto. Questo esempio, sebbene non sia un progetto di design completo, è un ottimo esempio di questa tendenza in azione.

Ogni bolla è diversa

È fantastico quando una tendenza del design presenta una tecnica che puoi creare da solo. A differenza di una tendenza cromatica in cui "tutti" usano una singola tonalità o tendenze di spaziatura o raggruppamento, che hanno una sensazione simile, l'uso di bolle e macchie può essere piuttosto diverso per ogni progetto.

Pochi degli esempi nei mini case study sopra sembrano simili, rappresentano vari tipi di industria e provengono da diverse località in tutto il mondo. E tutti hanno l'uso di bolle e macchie in comune.

© Copyright 2024 | computer06.com