Todo lo que necesitas saber de las animaciones de carga en páginas web y en aplicaciones para dispositivos móviles

abril 10. 2019,
 Autor:

Animaciones de precarga

Lisa Dziuba es una experta en el desarrollo de aplicaciones para teléfonos celulares, hace un par de días publicó un artículo muy extenso e interesante
en Medium. En el artículo hace un análisis de las animaciones de carga en apps y en páginas web. Habla sobre la historia de esas pequeñas animaciones y explica por qué es importante agregar una animación de carga, en aplicaciones que hacen esperar al usuario.

Lisa menciona un punto fundamental que justifica el uso de las animaciones de carga. Y es que un usuario abandona una página web o una aplicación, si ésta tarda más de 3 segundos en cargar. Al agregar una animación al proyecto, la espera del usuario se hace menos tediosa y se reduce de manera significativa el abandono de páginas y de apps.

Lo genial del artículo es que además de leer el texto, también podrás ver muchos ejemplos. Hay animaciones que te harán recordar viejos tiempos, cuando casi todas las páginas web estaban hechas con Flash. En el 2008 era algo normal ver una pequeña animación de carga, en casi todas las páginas. Era muy raro la página que no tuviera una animación, porque si no la tenía el usuario no se daba cuenta, de que algo se estaba cargando.

Animaciones de precargaAnimaciones de precargaAnimaciones de precargaAnimaciones de precargaAnimaciones de precargaAnimaciones de precargaAnimaciones de precargaAnimaciones de precargaAnimaciones de precargaAnimaciones de precarga

Animaciones de precarga gratis y personalizados

Fue en el 2010 cuando las animaciones de carga en páginas web, se generaban con código CSS. Ahora estamos acostumbrados de ver esas animaciones en videos de YouTube o de Vimeo. Pero también encontramos animaciones de carga en aplicaciones para dispositivos móviles. Un ejemplo claro son los videos en Instagram.

Animaciones de precarga

Lisa Dziuba va dejando enlaces por todo el artículo, donde puedes descargar de manera gratuita animaciones de descarga. Por ejemplo ésta página en donde puedes conseguir animaciones de precarga gratis en formatos: GIF, APNG y SVG. Con los diseños más comunes de animaciones de descarga. Puedes personalizar el diseño de la animación, antes de descargarla a tu computadora. Tienes la opción de elegir fondo transparente o fondo del color que tu quieras. Puedes cambiar la velocidad de la animación, el número de fotogramas y decidir si quieres que sea una animación del tipo loop infinito.

Animaciones de precarga

Y ya para terminar Lisa presenta animaciones de carga con diseños diferentes, en donde se da más información al usuario. Por ejemplo te dice el tiempo restante que falta para cargar la página o el porcentaje cargado en aplicaciones.

Si eres diseñador web o diseñador de aplicaciones debes de leer el artículo. Hay mucha información interesante y lo más importante es que encontrarás muchos ejemplos y herramientas.





Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

➱ ¡Sigue el blog!
botones sociales Twitter Facebook Pinterest YouTube Society6 Instagram Feedly RedBubble
✉ ROC21 en tu correo

➱ ¡Suscríbete a nuestro boletín! Recibirás ofertas especiales en cursos y recursos gráficos, una vez a la semana.