Para nuestra selección de sitios web de septiembre de 2022, analizamos proyectos que logran cautivar y entretener.
Uno utiliza la interacción y las animaciones para crear un juego para el retiro anual de su equipo. Otros emplean efectos de fondo, una navegación interesante y diseños centrados en la fotografía para captar nuestra atención.
Animación cautivadora
Los sitios web pueden usar la animación de formas fascinantes y visualmente hipnóticas. También pueden emplearla para involucrar a los usuarios de una manera más profunda, añadiendo al sitio un significado que no tendría con una página estática.
Retiro de ThreeSixtyEight
ThreeSixtyEight es una agencia de diseño especializada en experiencias interactivas profundamente envolventes. No es de extrañar que su invitación al retiro de equipo de 2022 tomara la forma de un juego nostálgico al estilo Oregon Trail. Gana el juego y descubre la ubicación secreta de su retiro.
La revelación del viaje por carretera que creó la empresa te permite reunir a un equipo, elegir suministros y conducir tu furgoneta hacia el paisaje. Eso sí, asegúrate de tomar las decisiones correctas, o tus compañeros de trabajo podrían no llegar al destino.
El uso inteligente de las interacciones al hacer scroll y pasar el ratón, junto con un estilo de juego de opciones múltiples, hacen que la experiencia sea atractiva sin una complejidad técnica excesiva. Los efectos de sonido y unas ilustraciones encantadoras hacen que sea muy divertido jugar.
Para ver un desglose de los elementos de su diseño, visita su página en Awwwards.
Sabina met een A
Sabina met een A (que se traduce como Sabina con A) es el sitio web de la fotógrafa y redactora Sabina van Gils. Su fotografía es inesperada e intrigante. Su composición limpia y sencilla dirige toda nuestra atención hacia sus interesantes sujetos.
Su sitio web es igual de minimalista pero peculiar. Tiene el aire despreocupado y creativo de un álbum de recortes. Lo que lo lleva al siguiente nivel creativo es el uso de la animación. Las animaciones de carga, las interacciones con el ratón y los efectos al hacer scroll hacen que navegar por su sitio sea una experiencia encantadora.
Las fotografías de Sabina se muestran justo en el centro de la página con un sutil efecto de iluminación al pasar el ratón y un desplazamiento lento y deliberado. Estas animaciones atraen nuestra atención hacia su trabajo en lugar de distraernos de él.
Forward Obsessed
En el podcast Forward Obsessed, Pete Sena y David Salinas entrevistan a emprendedores y líderes empresariales sobre sus experiencias y visiones para el futuro de los negocios. El sitio web de su podcast utiliza efectos animados para crear una experiencia minimalista pero intrigante para los visitantes.
Lo primero que notas son las hipnóticas animaciones abstractas del fondo. Con un diseño en blanco y negro extremadamente limpio y pocos elementos que distraigan, las animaciones de fondo captan toda nuestra atención hacia la página.
También utilizan un efecto animado para añadir información adicional a su lista de episodios del podcast. Cuando pasas el ratón sobre el título de un episodio, aparece un pequeño icono animado que da una pista sobre el tema principal. Es la información justa para despertar nuestra curiosidad y animarnos a hacer clic para escuchar.
La fotografía como diseño
A veces, basar tu diseño en una fotografía —o varias— crea un sitio web realmente hermoso. La versión moderna no es una galería ni una presentación de diapositivas. En su lugar, estos diseñadores utilizaron imágenes cuidadosamente seleccionadas a lo largo de sus diseños para construir significado y conexión.
LIIV Atlanta
LIIV Atlanta es “una iglesia centrada en la presencia de Dios que prospera gracias a personas auténticas”. Su enfoque está totalmente puesto en su comunidad y en las personas que la integran. La iglesia organiza servicios, ofrece cuidado infantil y construye una red de apoyo para sus fieles. La decisión de basar el diseño de su sitio web en fotografías de personas comunica esa misión a la perfección.
El sitio de LIIV se abre con vídeos impactantes que ocupan toda la sección principal. Desde el primer momento en que entras, sabes dónde está la iglesia y qué representa. El resto del sitio intercala fotografías alegres y luminosas de sus miembros. Este diseño funciona de maravilla para una organización centrada en la comunidad.
Dieter Rams
El sitio web de Dieter Rams, por el contrario, se inclina hacia el arte del minimalismo, lo cual tiene sentido tratándose de un diseñador industrial alemán. Sus diseños, al igual que su página, presumen de una estética limpia y vintage que apuesta por la funcionalidad y la eficiencia.
La impactante imagen de un teclado que aparece al abrir su sitio cumple a la perfección con las expectativas del espectador. A pesar de ser una fotografía, la pureza del fondo blanco y la simetría perfecta de la imagen crean un efecto gráfico. Hay imágenes de Rams y de su obra por todo el sitio, y el diseño minimalista dirige toda la atención del usuario hacia sus creaciones.
Empieza gratis
Crea sitios web personalizados y escalables, sin escribir código. Empieza a construir en Webflow.
Navegación multirruta
A veces necesitas llevar al usuario a un resultado concreto, sin importar el camino. Estos sitios web utilizan múltiples opciones de navegación para que los visitantes exploren, asegurándose al mismo tiempo de que lleguen a su destino final.
Festival X
Festival X traerá música y fiesta a la Costa Dorada de Australia este noviembre. Su sitio es tan colorido y emocionante como su cartel. En las páginas de festivales de música, tres cosas son vitales: el dónde y cuándo, el cartel y las entradas. Su navegación garantiza que obtengas toda esta información, sea cual sea el camino que elijas.
El cartel es lo primero que ves al abrir el sitio. Los visitantes pueden hacer clic en los nombres de los artistas para ver fotos y detalles. También pueden acceder a estas páginas a través del menú hamburguesa en la esquina superior derecha, un botón de “Cartel” a la izquierda y otro menú visible en la parte inferior de las páginas.
El botón de “Comprar entradas” permanece siempre a la vista, flotando en la esquina inferior izquierda sin importar dónde se encuentre el usuario. De este modo, siempre que decidan asistir al festival, el camino está claro.
Bottomless
Bottomless es un servicio de entrega de café que ofrece pedidos de reposición de suministros personalizados para preparar café. La empresa colabora con tostadores de alta gama para que los clientes tengan acceso a café sin tener que ir a una tienda.
El sitio sigue en desarrollo, pero la empresa utiliza una llamada a la acción de “Elige tu café” en todo su diseño. Los visitantes pueden navegar libremente y, cuando estén listos, empezar a comprar sus granos de café favoritos. El botón de llamada a la acción se repite por todo el sitio, ofreciendo a los usuarios un camino sencillo para comprar.
Una vez que hacen clic en el botón de compra, los visitantes son guiados a través de una serie de páginas donde pueden personalizar sus elecciones. Cada página incluye descripciones e imágenes con botones grandes y claros para realizar la selección.
¿Prefieren tueste oscuro, medio o suave? ¿Qué tipo de molienda necesitan? ¿Cuánto café consumen a la semana? Basándose en esto, el sitio recomienda un tamaño de pedido y una frecuencia de reposición. Cuando los clientes han configurado su caja de café perfectamente a medida, saben exactamente cuál es la propuesta de valor.
Comparte tus creaciones con Made in Webflow
A la comunidad de Webflow le encanta explorar proyectos a través de Made in Webflow, ¡y a nosotros también! Comparte el tuyo y podrías aparecer en nuestro resumen mensual.
