Animation components that can take any React Component and apply animations to them.

[ishank-s]

I want to write a component that could be used throughout the project , for eg , we could give it args [hide, show, rotate ] Pros- Easy to debug Consistent look and feel (everyone could give a different time when performing anim, this would prevent that) Cons- Every PR merge must be checked that it uses our animations Thoughts @twishasaraiya ?

[twishasaraiya]

@prophet It is not yet decided which components will be animated in which way. We will be animating DOM elements by experimenting and discussing what would look better. Since GreenSock is a very powerful API we can create some very interesting Animations. Moreover having a separate component would not be required since we can do the following

import TweenMax from 'gasp'
class SampleComponent extends React.Componet{
componentDidMount(){
   TweenMax.to(DOM Id, duration, {CSS Property Object });
  }
render(){...}
}

Please do let me if you have any doubts.

[ishank-s]

Yes thats my point @twishasaraiya Imagine one dev make Component1 and other Component2 It'll be hard to force consistency in animations Component 1 may animate for 0.5 sec and Component2 may animate for 0.3 sec That would produce a really bad and inconsistent ui experience. So i was suggesting if we could make an animation wrapper ,which would animate a views for anyone who want to make ui component That would seperate the concern as well So that everyone wouldnt have to know how to animate when they're making a component that is consistent to our app

[twishasaraiya]

@prophet1996 I understand different developers will animate stuff differently. That's the reason we will be first developing the entire page including all components and then animation them. We will not be working on developing components and animating them at the same time.One single developer could take an entire page to animate the DOM elements after discussing with others. Once the basic quiz app is running (without animations) we can discuss further on how to add animations. Besides for now you can work on Landing Page design and animations.

[ishank-s]

oh okay makes sense , we can close this then