No hay balas de plata para grandes animaciones, además de pasar mucho tiempo probándolas y optimizándolas. Sin embargo, después de años de experimentación y de alcanzar los límites del rendimiento de los navegadores, hemos elaborado una serie de principios de diseño y código que parecen dar lugar a buenas animaciones. Estas técnicas deben obtener resultados eficaces, funcionan en modernos navegadores de escritorio y móviles y, lo que es más importante, son fáciles de mantener.

  1. No cambie ninguna propiedad además de opacidad o transformación.
  2. Oculte el contenido a simple vista
  3. No anime todo al mismo tiempo.
  4. Pequeños incrementos en el retraso de las transiciones hace más fácil coreografiar el movimiento
  5. Use un multiplicado global para diseñar en slow motion
  6. Capture vídeos de su UI y muéstrelos para obtener perspectiva de una tercera persona.
  7. La actividad de la red puede causar retraso.
  8. No vincule directamente la animación al scroll.
  9. Haga pruebas en movil desde un primer momento.
  10. Haga pruebas en multiples dispositivos.

Por Anand Sharma
Fuente