Mejores ejemplos de Diseños de Sitios Web para Inspirarte

Bienvenidos a nuestro artículo infinito donde vamos agregando los mejores ejemplos de sitios web que encontramos. Aquí, revisamos, analizamos y destacamos los componentes más impresionantes de estos sitios web para que puedas inspirarte y aprender de los mejores ejemplos de diseño web.

1. Amanda Braga – Jewelry Design

Este sitio web NO ES NORMAL cómo puede parecer en la foto. Te explicaré por qué. Sin embargo, te recomiendo kilométricamente visitarlo para obtener la experiencia completa.

Pantalla de carga

Recién entras al sitio web, la pantalla de carga es preciosa y llamativa. Es una animación simple pero elegante que te prepara para la sofisticación de sitio web a la que estás a punto de entregarte. No tarda mucho en cargar, y cuando lo hace, eres gratamente sorprendido con una animación única de fundido que empieza a mostrar todos los elementos de la pantalla de inicio.

Pantalla principal

Una belleza. De nuevo; simple pero elegante. Un fondo azul plano rgb(0, 74, 98) con un par de links a la izquierda, un medio círculo y el nombre de la diseñadora en el centro. Lindo inicio pero hasta ahora nada espectacular. Sin embargo, sin aviso alguno, cuando mueves el mouse se muestra una de las mejores animaciones que verás. Decenas de imágenes aparecen espontáneamente siguiendo con poco de retraso el apuntador del mouse. Es una animación increíble que no se ve en los sitios web comunes y que le añade un aire original muy especial.

Contenido

Conforme haces scroll en el sitio web, se muestra el contenido informativo del sitio web: ¿Quién es Amanda Braga?, ¿Qué hace/vende? ¿Cuál es su experiencia? y demás. El texto se ve atractivo debido a que utiliza el estilo de star wars, en el que parece una biblia infinita con texto saliendo de la nada. Sin embargo, el uso de una animación que hace parecer que el texto sale de la pantalla conforme bajas, le da un toque único.

Lo malo

A pesar de que tiene mucho diseño al principio, cuando llegas al contenido se vuelve algo repetitivo que no despierta mucho interés en el lector puesto que es demasiado texto utilizando el mismo estilo por mucho tiempo. No contiene suficientes fotos o videos que alivien la carga textual, por lo que dudo mucho que alguien lea toda la información del sitio web.

Conclusión

Les recomiendo mucho visitar este sitio web por las razones expuestas. Es un sitio web de calidad y elegancia que puede servir como inspiración para cualquier diseñador. En general es un sitio web que tiene muy pocos componentes y animaciones y aún así luce demasiado estéticamente.

Si tienes alguna sugerencia o conoces un sitio web que deba ser incluido, no dudes en dejarnos un comentario.

2. Plink – Payments

Envía solicitudes de pago…

El sitio web te da la bienvenida con una animación 3D de un celular pidiendo un pago en euros aunque rápidamente se convierte en otra cosa…

Recibe pagos rápidamente

Inmediatamente toda la animación se convierte en un cohete espacial triangular que despega, simulando que la estela de fuego, es en vez, de billetes y monedas, mientras lees: ¡recibe el pago rápidamente!

Contenido

Posteriormente te presentan algo igual de simple y elegante. Contiene poca información, sólo la que necesitas saber mientras te entretienes un poco observando las monedas girar.

Las siguientes secciones exponen solamente información esencial mientras te entretienen con elementos dinámicos e interactivos. Hay una sección oscura en la que tu mouse funciona como linterna para que puedas encontrar un código QR:

Finalmente el sitio web termina con una última sección llena de colores y vida en la que presentan todos los métodos de pago. Sin duda, es un bello sitio web que ¡tienes que visitar!

3. 5scontent – Content Studio

Toma 7 segundos hacer una impresión, nosotros lo hacemos en 5

Un sitio web debe exponer el producto/servicio que vende y demostrar su calidad en la menor cantidad de tiempo posible. Este sitio web, lo logra en menos de 5 segundos, cumpliendo su palabra.

Pantalla principal

Mientras menos elementos, mejor. Este sitio web lo sabe y es por ello que se ve limpio, elegante y no necesita más que de un par de videos para que te des cuenta de la tremenda calidad que tiene el servicio de creación de contenido de la marca 5scontent.

Proyectos que sonrojan

Posteriormente muestran algunos de sus proyectos de una forma muy creativa. ¡Necesitas verlo por tu cuenta!

Observen la misma foto con dos fondos distintos, eso es porque al hacer click en cualquier lugar del sitio web, el fondo cambia de color, mostrando una de sus varias posibles interacciones que tienes que conocer.

En conclusión, es un sitio web bastante elegante y fresco que cualquiera estaría agradecido de visitar.

4. Greta Thunberg- Timeline

Un sitio web inmersivo, con sonido incluido para que sea una experiencia surreal. El sitio web es una línea de tiempo para mostrar a los usuarios, las acciones que ha tomado Greta para favorecer al medio ambiente y al mundo en general. Aparte de ser un diseño único, terminas aprendiendo e informándote.

Como se observa en las fotos, el sitio web es interactivo, por lo que a tu ritmo, puedes arrastrar el mouse para ir leyendo el resumen de las acciones de Greta en cada mes del 2019, cuando Greta lideró el movimiento global.

Es un sitio web que no te puedes perder si eres desarrollador o diseñador web. Encontrarás mucha inspiración. ¡Necesitas verlo por tu cuenta!

5. Rouser Lab – Activism Website

No me disculpo por romper tu burbuja…

Uno de los sitios web más llamativos que he visto. Con una burbuja que te sigue cual mascota durante tu recorrido. En cada sección hay textos que te harán reflexionar sobre el calentamiento global mientras aprecias la creatividad del sitio web.

Animaciones suaves y bellas que añaden más que estética. No te quiero spoilear el final, así que recomiendo que visites el sitio web aquí.

Si ya lo visitaste, seguro quedaste sorprendido con el final del recorrido ¿cierto? Eso es buen storytelling para tu sitio web. Úsalo de inspiración.