Aujourd’hui, je partage un modèle d’interaction Storyline que j’ai créé il y a peu : un modèle de slider contenu, défilant horizontalement. Il pourra servir par exemple pour réaliser une time-line ou encore pour faire rentrer dans un écran beaucoup de contenu.
Vous pouvez télécharger directement le fichier source Storyline 3 ici.
Il s’agit d’abord de créer un groupe de formes/éléments qui composent notre contour. On assigne ensuite à ce groupe une trajectoire d’animation vers la droite, à partir du milieu, quand on clique sur le bouton de droite. Puis, exactement la même trajectoire en sens inverse, du milieu vers la gauche, quand on clique sur le bouton de gauche. L’animation doit avoir un point de départ relatif, puisqu’elle se répète vers le côté, autant de fois que l’utilisateur clique sur le bouton.
La difficulté de ce modèle eet que l’on doit envelopper notre contenu dans un groupe global avant de lui appliquer les animations. Pour modifier le contenu, on devra parfois défaire le groupe pour le regrouper ensuite, et donc, ré-appliquer les animations. Ce qui peut être très fastidieux car les trajectoires de animations doivent être réglées parfaitement au pixel près pour que le défilement soit fluide.
De plus, si on a beaucoup de contenu enveloppé en plusieurs groupes et sous-groupes, comme dans le modèle ci-joint, Storyline a parfois du mal à suivre et rame un peu.
J’espère que ce modèle vous sera utile, n’hésitez pas à poster vos remarques et éventuelles idées d’améliorations.