Elige la aceleración adecuada para tu proyecto, ya sea una entrada o salida lentas, o ambas. ¡Incluso puedes usar rebotes para divertirte más!
Ahora que ya analizamos las diversas opciones disponibles para acelerar las animaciones, ¿qué tipo deberías usar en tus proyectos y qué tipos de duraciones deben tener tus animaciones?
Resumen
- usar animaciones de salida lenta para los elementos de la IU; la salida lenta Quintic es una facilidad muy linda, aunque rápida.
- Asegúrate de usar la duración de la animación. las salidas lentas y las entradas lentas deben durar entre 200 ms y 500 ms, mientras que los rebotes y las aceleraciones elásticas deben tener una duración más larga de 800 ms a 1200 ms.
En términos generales, una salida lenta será la opción correcta y, sin dudas, un buen parámetro predeterminado. Se inicia rápidamente, lo que le da a tus animaciones una sensación de receptividad, lo cual es conveniente, pero con una buena demora al final.
Existe un grupo de ecuaciones de salida lenta reconocidas que van más allá de la especificada en la palabra clave ease-out en CSS, cuyos niveles de “agresividad” varían. Para obtener un efecto de salida lenta rápida, considera la opción de salida lenta Quintic.
Cómo ver una animación de salida lenta Quintic
Otras ecuaciones de aceleración, en particular los rebotes o las aceleraciones elásticas, se deben usar con moderación y solo cuando sea apropiado para tu proyecto. Hay algunas cosas que hacen que un usuario salga de una experiencia, como una animación estridente. Si tu proyecto no pretende ser divertido, entonces no hagas que los elementos reboten por la IU. Por el contrario, si creas un sitio que debe ser alegre, ¡entonces sí usa rebotes!
Prueba las aceleraciones, descubre cuáles se adaptan a la personalidad de tu proyecto y úsalas. Para obtener una lista completa de los tipos de aceleraciones, junto con las demostraciones, consulta easings.net.
Elige la duración adecuada para las animaciones
Es importante que cualquier animación agregada a tu proyecto tenga la duración correcta. Si es demasiado corta, la animación se verá agresiva y nítida; demasiado largo y será disruptivo y molesto.
- Salidas lentas: aproximadamente entre 200 ms y 500 ms. Esto le da al ojo la oportunidad de ver la animación, pero no la obstruye.
- Entradas lentas: aproximadamente entre 200 ms y 500 ms. Ten en cuenta que se sacudirá al final y ningún cambio en la duración podrá suavizar ese impacto.
- Efectos de rebote o elásticos: alrededor de 800 ms a 1,200 ms. Debes esperar a que el efecto de rebote o elástico se "asiente". Sin este tiempo adicional, la parte de rebote elástico de la animación será agresiva y desagradable a la vista.
Por supuesto, estas son solo algunas pautas. Experimenta con tus propias aceleraciones y elige las que mejor se adapten a tus proyectos.