Diagram the relationships between AnimationController, Animation, Tween, CurveTween, and CurvedAnimation objects
@InMatrix commented on Fri Jan 05 2018
The Q4 UX study shows that developers have difficulty understanding how different objects in an animation are related to one another. It would be great to use diagrams to illustrate their relationships in the Tween Animation Tutorial.
I recommend using a timing chart to tie different concepts together. Since this type of diagram is already used in the staggered animations tutorial, it would be nice to introduce this representation earlier with a single tween animation occupying the full timeline and show how an easing curve affects the progression of the animation. In addition, it's also useful to visually show the "controls" on the AnimationControl object such as forward, reset, stop, etc.
This issue depends on API changes that might be resulted from #14482.
@xster commented on Fri Jan 05 2018
Perhaps in a separate more zoomed out diagram but consider adding Ticker, ImplicitlyAnimatedWidget, AnimatedWidget as well
@InMatrix commented on Wed Jan 10 2018
@xster Good idea for zooming into a under-the-hood view for those who're curious.
@InMatrix commented on Thu Feb 22 2018
As an example, this is the diagram I showed in my DartConf talk:

@Sfshaza, let me know if you think this is useful when you have a chance to take a look. I'm happy to provide the source file.
@Sfshaza Sure, will add this to our tracking doc so everyone can weigh in.