Butterfly Effect

[megam]

How can i make this book effect like butterfly , like its left side and right side fly like a wing ? is it possible with gsap ?

See the Pen MWjYjoq by midn07 (@midn07) on CodePen

[akapowl]

 

Hey @megam

 

Maybe you could split the SVG into multiple independent pieces (probably best to prepare it like that in a graphic SVG editor app) and then find the right point to rotate each of those pieces independently in different rotation directions similar to like you do it with the whole SVG there. But then you'd probably get some sort of overlap of the independent sections - so you'd also have to pre-prepare it so you could avoid that happen when tweening on it. 

 

This is what I meant by animating seperated parts of the SVG

 

See the Pen deda24225b3a5520e7e39842514bf29b by akapowl (@akapowl) on CodePen

 

 

 

 

Another option (although I think in this case a pretty complex one) could be to try morphing on it from this state to a more closed one (would of course also best be pre-prepared in a vector-editor app). But I don't know if that would give you the exact sort of effect, you are after.

 

 

 

[megam]

yea that's what i want to achieve , thank you akapowl