Random deformation effect

Polaris
Javascript

Bonjour,
Je suis en train de refaire mon book et j'aimerais faire des animations.
Je m'explique : Je voudrais créer 3 formes aléatoires j'entend par la des éléments géométrique avec au moins 3 arrêtes.

Puis les déformer on continue avec une animation. Je vous met une image pour que ça soit plus claire. j'éspére.

[http://img4.hostingpics.net/pics/273609AnimationStepcv.png]()
Je ne sais pas du tous vers quel algorithme partir ni quel techno .. Canvas ? SVG ? des bibliothéques comme Three.js ?

Si vous avez des pistes je suis preneur je sais pas trop comment démarer mais je veux absolument faire cette animation :D

Merci pour votre aide.

5 réponses

Benjamin Derepas

Je pense que le plus simple serait SVG ,étant donné que tu aura juste à dessiner 3 ou 4 points et changer leur coordonnées.
Pour l'animation, tu peux le faire facilement en svg avec animate-tranform

Polaris
Auteur

oui mais justement y'en aurais plus car je voudrais que la forme est de 3 coins à 4-5 c'est possible ? j'y connais rien en SVG

Benjamin Derepas

Aucun problème avec du svg, tu peux faire des points, des lignes, des triangles, des rectangles, des formes à 10 cotés, bref ce que tu veux .
voici quelques tutos sur le SVG que je t'invite à lire :

Polaris
Auteur

Advancid non c'est super avec ton script j'ai compris l'idée . je devrais pouvoir m'en sortir avec ça . faut que je trouve comment réduire la distortion et je veux ajouter ou supprimer des coté aussi genre de 3 à 5.

Y'a aussi le fait que je veux que qu'un un nouveau coin ce génére la forme se retourne pas sur elle même comme on peut voir dans ton script

Polaris
Auteur

Par contre je comprend pas a quoi servent les points vX et Vy dans ton scripts