La primavera ya está aquí. Y como no podemos enviarte flores de verdad, te llenaremos de inspiración, cortesía de Made in Webflow.
El mes de marzo nos trajo una selección fresca de sitios que promueven la atención plena, fomentan la competencia divertida, apelan a tu sentido de la nostalgia y mucho más.
1. Headspace Health
Headspace Health nos recibe con tonos cálidos amarillos y naranjas, que combinan a la perfección con su enfoque en la atención plena.
La mayor parte de la información se presenta con un texto sencillo en negro o gris, lo que hace que el sitio sea fácil de leer y repasar. Los toques de color repartidos por toda la página dirigen nuestra mirada hacia fotos sonrientes, estadísticas importantes y anuncios. Nos encanta el movimiento sutil de las formas geométricas que parecen deslizarse a su lugar a medida que haces scroll. Este sitio también utiliza menús desplegables, manteniendo el diseño despejado y ofreciéndonos la opción de encontrar más información.
2. Jack Jaeschke (aviso de movimiento)
El animador, diseñador de movimiento y editor Jack Jaeschke nos saluda con una animación pixelada que intercambia las palabras después de “I am a...” por títulos que van desde lo serio hasta lo divertido.
La experiencia de navegar por el portafolio de Jack se siente como una mezcla entre hacer zapping en una televisión antigua y explorar internet a principios de los 90. El estilo glitch y pixelado del sitio web muestra su personalidad y sus habilidades en diseño de movimiento. Y aunque los toques de esa técnica de diseño nostálgica están por todo el sitio, las muestras de video y trabajo para clientes de Jack, por el contrario, brillan en alta definición.
3. Webflow CMS Tournament Bracket (clonable)
El cuadro de torneo de Webflow CMS te permite organizar competencias cara a cara, ya sea que estés llevando el registro de las posiciones de tu liga fantástica o enfrentando dulces entre sí para encontrar el postre definitivo (el helado es el #1, no me discutas).
El cuadro se inspiró en el desafío de construcción rápida de No-Code Conf 2021, que incluyó a 8 competidores. Pero puedes personalizar el cuadro con hasta 64 participantes (o tipos de postres, películas, equipos, etc.). Clona este proyecto para tu próximo gran torneo o discusión acalorada con amigos.
4. Harriet
Harriet va directo al grano con una tipografía de gran tamaño que nos dice quién es, qué hace y qué le apasiona.
El diseño de página única de Harriet es limpio y sencillo, a la vez que proporciona toda la información que los clientes potenciales necesitan. Cada proyecto en “work” incluye una ilustración preciosa con su estilo distintivo, junto con una breve descripción de su participación. Nos encantan los toques sutiles en todo el sitio, como la animación de fondo granulada que parece estática de luz.
5. On Trend
On Trend ofrece “videos del tamaño de un bocado de creadores de contenido seleccionados”, así que no es de extrañar que su sitio esté salpicado de animaciones de teléfonos móviles que muestran diferentes clips de video.
El sitio web divide su diseño de una sola página en categorías a las que podemos acceder mediante enlaces de salto en la barra de menú superior. Cada sección tiene un encabezado claro, una breve descripción y un teléfono móvil animado que muestra el producto en acción. La estética organizada pero lúdica es coherente con la marca para un sitio de inversión dirigido a jóvenes inversores.
Empieza gratis
Crea sitios web personalizados y escalables, sin escribir código. Empieza a construir en Webflow.
6. Product School: The Future of Product Management Report
El sitio web del informe The Future of Product Management, creado por Product School, está lleno de animaciones fluidas activadas por el scroll que presentan las mismas formas y colores que vemos en la sección principal.
Estas animaciones y los sorprendentes cambios entre el desplazamiento horizontal y vertical nos mantienen enganchados, invitándonos sutilmente a explorar más. Es un diseño ingenioso y llamativo que atrae a los visitantes y los mantiene haciendo scroll.
7. Cuestionario de arrastrar y soltar (clonable)
El creador Timothy Ricks nos regala un cuestionario clonable sencillo pero muy efectivo.
Esta práctica plantilla de cuestionario permite crear una pregunta y añadir varias respuestas posibles como elementos arrastrables. Al soltar la respuesta correcta en el círculo indicado, se activa una animación rápida: la palabra "correcto" se desliza en la pantalla desde la derecha.
8. Juego de mecanografía (clonable)
Atención a todos los niños de los 90 que recuerdan cuando la "clase de informática" era lo más. Este juego de mecanografía te transportará a los días en los que aprendías a colocar los dedos en el teclado y competías contra tus compañeros.
El objetivo es escribir con la mayor rapidez y precisión posible. A medida que avanzas por las frases generadas al azar, el sitio registra tus palabras por minuto y tu precisión. ¿Qué puntuación puedes conseguir sin mirar las teclas?
9. Jude Wasfi
Jude Wasfi, autoproclamada amante de los píxeles, nos deleita con un portafolio que recuerda a los juegos de la Nintendo original.
Jude incluso nos invita a jugar: nos otorga "puntos de píxel" por hacer clic en corazones y nos desafía a "lanzar sombra" (throw shade) haciendo clic en los logotipos de clientes anteriores. (No te preocupes, la "sombra" a la que se refiere es solo un cambio de paleta de colores).
¿Qué ideas están floreciendo en tu Designer?
Nos encanta ver sitios nuevos apareciendo en Made in Webflow. La próxima vez que crees algo de lo que te sientas orgulloso, ¡asegúrate de compartirlo con nosotros!
