DEV Community

José Antonio Fernández
José Antonio Fernández

Posted on

🔥 Hablemos de animaciones web. 🔥

Cover Hablemos de animaciones

No podemos hablar de animaciones si no hablamos de desarrollo web moderno.

En la actualidad, los sitios web existentes son básicamente una copia el uno del otro. Solo se diferencian por sus colores de marca o por el contenido que hay dentro.

Las animaciones en la actualidad en el mundo del desarrollo web son parte importante porque hacen que un sitio web se sienta no sólo interactivo, sino que se sienta que me está hablando cuando lo visitó, el sitio web puede saber lo que estoy sintiendo cuando doy click en un botón de buscar y no me sale nada.

😁 El sitio web puede generar una animación que me haga sentir el efecto de que hay un error. Este símbolo se cambió de cargando a una una carita triste, pero todo fue totalmente animado (motion). Entonces mi experiencia de usuario y mi ansiedad por haber fracasado en esa búsqueda se va a reducir. Al contrario de un sitio web donde solo hay una caja de texto en la cual escribes, das click y te va a decir únicamente que no hay resultados. Eso genera la sensación de que ahí no puedo encontrar nada. Mi posibilidad de encontrar algo se redujo en el primer intento, sin embargo, con una animación puedes hacer que un usuario no se dé por vencido en el primer intento, sino que siga interactuando con tu página de otra manera, cambiando las palabras y diferentes formas de hacer que el usuario se quede en lugar de irse decepcionado y ansioso.

🛒 Lo mismo pasa con el concepto de E-commerce, muchas empresas te ofrecen ecommerce, pero nunca te asesoran de que la real diferenciación de un E-commerce con otro no es sólo la plataforma que usas para alojar tu tienda en línea o el método de pago
Interaccion de compra en ECommerce
🛒 A mí me gustaría entrar en un ecommerce y saber que cuando compro algo la interacción es que mi artículo se anima dentro de una cesta como si yo lo hubiese guardado ahí.

🌐 Si no existe esa pequeña animación yo sé que el elemento al cual le di click está en esa cesta y no me genera la sensación de que lo almacene en una cesta.
Sin embargo, si simplemente le das clic en añadir y por intuición sabes que eso lo almacena en una cesta.
Es muy poco atractivo entonces, generas una sensación de antigüedad o algo tradicional.

🌐 Sin embargo, la animación mientras el elemento se mueve de un lugar de la pantalla al otro y se guarda en una cesta, esa animación me genera una experiencia de que estoy comprando realmente comprando y guardando algo en mi canasta.

Esa es la principal razón por la que nunca debes pasar por alto la implementación de animaciones.

No vamos a hablar de interacciones, porque podemos abarcarlo en otro post, pero es la razón más importante por la cual tienes que diferenciarte de alguna manera. ¿Ya no te diferencias solo por colores y porque la página tiene esta fuente o estas imágenes con esta bonita no?

🔹 Ahora el usuario necesita sentir más allá de un contenido que está consumiendo.

webdesign #diseñoweb #desarrolloweb #animaciones #webmoderna #programacion #programador

Top comments (0)