Diseño de fondos de burbujas y burbujas

¿Ha notado todas las formas fluidas e ilimitadas en proyectos de diseño recientemente? El uso de burbujas y manchas es tendencia. Desde círculos simples a bucles de interconexión, a blobs de pantalla completa que se mueven y cambian, a simples? Animaciones, esta tendencia está apareciendo en todas partes.

Lo bueno es que si bien el uso de burbujas y burbujas es un elemento de diseño moderno, hay muchas maneras diferentes de hacerlo, y no terminarás con un diseño que parece que solo estás intentando agregar un elemento moderno. Aquí, tenemos una colección de mini estudios de casos de diseños de sitios web que muestran la tendencia del diseño de burbujas y burbujas.

Wed'ze

Wed'ze utiliza manchas de colores fríos, definidas por elementos algo redondeados sin forma definida, para resaltar los productos. El blob enfoca cada conjunto diferente de gafas de esquí con un cambio de color distinto, aunque la forma sigue siendo la misma.

El uso de la forma y el color interesantes sobre un fondo blanco puro crea un punto focal y hace que un producto que no sea tan interesante visualmente sea algo con lo que realmente pueda interactuar.

Gracias al tamaño, cada blob crea un flujo direccional también de izquierda a derecha en la pantalla, haciendo que el usuario observe la forma, las gafas y luego la descripción del elemento.

Grupo de Finanzas Liber

Liber Finance Group utiliza una serie de burbujas animadas para crear un elemento de arte. Las burbujas (definidas más como un elemento de diseño redondo y hinchable) incluyen círculos sólidos y rellenos con partes fijas y móviles.

Las burbujas en este diseño sirven como un hilo visual y conectan partes del sitio web en todo el diseño. La forma se utiliza debajo del desplazamiento para ayudar a llamar la atención sobre el texto y los elementos a los que se puede hacer clic, así como crear un tema para un diseño que no tenga mucha otra información altamente visual.

El uso de la animación es una forma efectiva de crear interés con formas simples.

Drip Pop

Drop Pop utiliza un blob como la marca del logotipo en un fondo demasiado ocupado. (Tenga cuidado con la velocidad del movimiento si hace clic en el enlace).

La marca es un elemento contenedor de la marca de palabra y funciona con la opción de diseño presentada porque permite que la marca se vea en un diseño colorido y ocupado.

Si bien este tratamiento con el logotipo es interesante aquí, podría ser más difícil utilizar una técnica como esta a largo plazo.

Josh Dring

Una serie de manchas superpuestas crea un collage visual para el sitio web de la cartera de John Dring.

Gracias al uso de colores y formas interesantes, el sitio se siente cálido y acogedor. Si bien es posible que no esté 100 por ciento seguro de qué tipo de trabajo realiza, el diseño abstracto invita a los clics.

Cuando utilice un fondo con manchas, piense en elementos de capas para crear un efecto de profundidad. Esto puede ayudar a llamar la atención y hacer que el diseño sea más atractivo.

Andy Patrick

Andy Patrick también utiliza blobs para el sitio web de su cartera, pero con un enfoque totalmente diferente. Donde el ejemplo anterior presenta manchas estáticas, las formas en este diseño cambian y se mueven con ligeras animaciones.

Cada gota también tiene una sensación casi tridimensional gracias a las opciones de color de degradado que enfatizan la naturaleza redondeada de cada burbuja. Casi se siente como si pudieras alcanzar y tocar estos elementos. (Me imagino que tienen la textura suave y blanda de una buena pelota antiestrés).

Iqor

Iqor utiliza burbujas alargadas como parte de la escena del cielo y permite a los usuarios mirar más allá de las nubes y ver lo que hace la compañía.

Si bien estas burbujas son estáticas por naturaleza, proporcionan movimiento direccional gracias a una asociación con algo que se mueve (nubes en el cielo). Funcionan excepcionalmente bien gracias a la información contenida en el mismo, que sirve como elemento artístico e informativo.

Estudio volbloed

Studio Volbloed usa otra burbuja estática para las imágenes en el pie de página de Acerca de para mostrar a las mujeres detrás de la compañía.

Si bien la mayoría de las personas piensan inicialmente en las burbujas como formas decorativas, también pueden servir como elementos contenedores para imágenes. Lo que hace que estas burbujas funcionen es la hermosa forma en que las formas se conectan para formar una sola imagen.

La forma circular también se refleja en otras ubicaciones a lo largo del diseño para una presencia de burbuja ligera que es visualmente armoniosa.

Unter Freiem Himmel

Unter Freiem Himmel usa dos burbujas animadas que parecen burbujas a medida que se carga la pantalla. La animación se detiene rápidamente para dejar formas casi perfectamente redondas sobre el nombre del sitio.

El cursor es también una burbuja simple.

La belleza simple de las burbujas animadas en este diseño es impresionante y hermosa. Este ejemplo demuestra que no tiene que agregar muchos elementos y técnicas para tener un diseño impactante. Hay belleza innata en la simplicidad, como lo muestra este sitio web.

Hashworks

El último ejemplo en esta colección es de Hashworks. A primera vista es posible que ni siquiera veas las manchas; Son una unidad conectada que sirve como logotipo para la empresa. Pero la versión grande del logotipo a la derecha incluye una animación genial y muy divertida. (Haga clic para verlo en acción.)

La burbuja animada incluye un montón de piezas que funcionan como gotas de aceite en agua con un diseño fluido con clara separación. Se mueven y se pliegan y rebotan hasta que cada una de las burbujas individuales en movimiento forma el logotipo de una sola gota conectada.

Es una de esas animaciones simples y brillantes que puedes ver una y otra vez porque está muy bien hecho. Este ejemplo, aunque no es un proyecto de diseño completo, es un excelente ejemplo de esta tendencia en acción.

Cada burbuja es diferente

Es genial cuando una tendencia de diseño presenta una técnica que puedes hacer tú mismo. A diferencia de una tendencia de color, ¿dónde? utiliza un solo tono o espaciado o tendencias de agrupación, que tienen una sensación similar, el uso de burbujas y manchas puede ser bastante diferente para cada proyecto.

Pocos de los ejemplos en los mini estudios de casos anteriores parecen similares, representan distintos tipos de industria y son de diferentes lugares del mundo. Y todos tienen uso de burbujas y manchas en común.

Texturas de fondo

Elegir la textura de fondo adecuada para su sitio web o proyecto de diseño puede ser complicado. Nuestra serie le enseña cómo trabajar e incorporar texturas de fondo, así como dónde encontrar gráficos asombrosos para trabajar.