Design Trend Bubble & Blob Sfondi

Hai notato tutte le forme fluide e sconfinate nei progetti di design di recente? L'uso di bolle e bolle è di tendenza. Da semplici cerchi a circuiti di interconnessione, a blob a schermo intero che si muovono e si spostano, a semplici? Blobby? animazioni, questa tendenza sta spuntando ovunque.

La cosa bella è che mentre si usano bolle e blob è un elemento di design alla moda, ci sono tanti modi diversi per farlo, e non si finirà con un design che sembra che tu stia solo cercando di aggiungere un elemento alla moda. Qui, abbiamo una raccolta di mini casi di studio di design di siti web che presentano la tendenza del design a bolle e blob.

Wed'ze

Wed'ze utilizza cool blob colorati, definiti da elementi un po 'arrotondati senza forma definita, per evidenziare i prodotti. Il blob focalizza l'attenzione su ogni diverso set di maschere da sci con un netto cambiamento di colore, sebbene la forma rimanga la stessa.

L'uso di forme e colori interessanti su uno sfondo bianco e rigido crea un punto focale e rende un prodotto che non è tutto ciò che è visivamente interessante con cui realmente interagire.

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

Liber Finance Group

Liber Finance Group 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 solidi e pieni con parti fisse e mobili.

Le bolle in questo disegno servono come filo visivo e collegano parti del sito web in tutto il design. La forma viene utilizzata sotto la pergamena per aiutare a disegnare l'occhio per gli elementi di testo e cliccabili e per creare un tema per un disegno 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 utilizza un blob come marchio del logo su uno sfondo troppo occupato. (Fai attenzione alla velocità di movimento se fai clic sul link.)

Il segno è un elemento contenitore per il marchio e funziona con l'opzione di progettazione presentata perché consente di visualizzare il marchio su un design occupato e colorato.

Anche se questo trattamento con il 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'utilizzo di colori e forme interessanti, il sito sembra caldo e invitante. Anche se potresti non essere sicuro al 100 percento del tipo di lavoro che fa, il disegno astratto invita i clic.

Quando si utilizza uno sfondo con BLOB, pensate agli elementi di stratificazione per creare un effetto di profondità. Questo può aiutare a disegnare l'occhio e rendere il design più coinvolgente.

Andy Patrick

Andy Patrick utilizza anche BLOB per il suo sito Web di portfolio, ma con un approccio totalmente diverso. Nei casi in cui l'esempio precedente presenta blob statici, le forme in questo disegno si spostano e si muovono con piccole animazioni.

Ogni blob ha anche una sensazione quasi tridimensionale, grazie a scelte di colori sfumati che enfatizzano la natura arrotondata di ogni blob. Sembra quasi di poter raggiungere e toccare questi elementi. (Immagino che abbiano la consistenza soffice e soffice 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 all'associazione con qualcosa che si muove (nuvole nel cielo). Funzionano eccezionalmente bene grazie alle informazioni in esso 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 su per mostrare le donne dietro l'azienda.

Mentre la maggior parte delle persone inizialmente pensa alle bolle come a forme decorative, possono anche fungere da elementi contenitore per le immagini. Ciò che fa funzionare queste bolle è il modo in cui le forme si connettono per formare un'unica immagine.

La forma circolare è anche specchiata in altre parti del design per una presenza di bolle luminose visivamente armoniosa.

Unter Freiem Himmel

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

Il cursore è anche una semplice bolla.

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

Hashworks

L'ultimo esempio di questa raccolta proviene da Hashworks. A prima vista potresti anche non vedere veramente i blob; sono un'unità connessa che funge da logo per l'azienda. Ma la versione grande del logo a destra include un'animazione cool - e molto flaccida. (Fare clic per vederlo in azione.)

Il blob animato include un gruppo di pezzi che funzionano come gocce di olio in acqua con un design fluido con separazione netta. 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 brillanti che puoi guardare più e più volte perché è così ben fatta. Questo esempio - sebbene non sia un progetto di design completo - è un ottimo esempio di questa tendenza in atto.

Ogni bolla è diversa

È fantastico quando una tendenza di design presenta una tecnica che puoi creare da sola. A differenza di una tendenza di colore in cui? Tutti? usa una tonalità singola o spaziatura o tendenze di raggruppamento, che hanno un aspetto simile, l'uso di bolle e BLOB può essere molto diverso per ogni progetto.

Pochi degli esempi nei mini casi illustrati 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 bolle in comune.

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.