NG Motion

May 17, 2021 · View on GitHub

| Next generation angular animation

Motivation

The current solution for Angular is limited and not very ergonomic, thus often unused. Some solutions from other frameworks like Framer Motion, React Spring, Pop Motion, Vue Gesture and Vue Motion have the ergonomics and simplicity of the AngularJS animations, with robustness of the Angular 2 animations while adding natural feeling to the animations.

The core principals of the animation library should be:

  • Natural 🌳
  • Ergonomic 🤸
  • Accessible
  • Testable 🧪

Natural

In the nature, movement is rarely clean and surgically linear. There is often a tension or friction to the movement, or a certain inertia applied both at a start and at the end of the movement. Additionally, objects' energies influence each other. The library needs to provide a way to easily generate natural movement by following the Newton's laws of motion and other laws of physics.

Ergonomic

The API should be simple, clear and extendable.

Accessible

All animations functionality should provide accessibility points, to easily switch them off or enhance for greater inclusion.

Resources:

Testable

The animations, being the part of the functionality of the application should be fully testable. This implies:

  • Exposing primitives for unit/integration testing
  • Exposing mechanisms to slow down or otherwise enhance animation for easier visual debugging