Inbound Marketing & Expertise HubSpot

Créer des infographies interactives avec Genially

Rédigé par Stéphane Viaud-Murat | 27 sept. 2016 12:54:00

Vous devez réaliser des infographies ou supports digitaux mais et n’avez aucune connaissance en graphisme ? Cet outil est fait pour vous !

Nous avions déjà couvert il y a quelques temps les principaux outils de création d’infographie. Le web demande des illustrations et supports digitaux de plus en plus riches, qu’il devient difficile de produire. Juan Rubio et Chema Roldan (les fondateurs) ont ainsi décidé de créer Genially pour permettre aux producteurs de contenu d’illustrer de manière interactive leurs idées et contenus.

Prise en main

Dés la première utilisation de l’outil, nous sommes amenés à sélectionner le template de notre choix. L’interface qui présente les différents templates paraît un peu  chargée graphiquement mais ce point de vue ne concerne que l’aspect visuel et ne gâche en rien l’expérience utilisateur. Cette interface s’avère toutefois accessible, claire et rapide à prendre en main.

Cette dernière, très colorée, donne envie de parcourir davantage l’outil afin d’en découvrir tous les secrets. La première étape consiste donc à sélectionner un template parmi les cinq proposés actuellement. Chacun d’entre eux répondent à un besoin bien spécifique et votre choix sera déterminé en fonction de ce que vous voulez produire.

Les différents templates proposés

Comme le montre la capture d’écran ci-dessus, Genially dispose de plusieurs approches graphiques qui couvrent les grands standards du web. Voici la liste des layouts que Genially propose actuellement :

1. Image interactiveLe premier template proposé est une image interactive de 800 x 800px à réaliser en trois étapes. Classique, mais absolument indispensable. Il suffit tout simplement d’uploader une image et d’y incorporer des points appelés « pins » pour cibler des éléments bien précis situés dans l’image. Après cela, il faut leur attribuer une interaction.

2. Infographie interactiveLe second correspond à l’indémodable infographie mais cette fois-ci, il s’agit d’infographie interactive. Ce format est l’un des plus efficaces que nous connaissons. C’est d’ailleurs celui-ci que je vais utiliser pour notre test. Plusieurs mises en forme pré-définies sont disponibles afin de ne pas partir de zéro.

3. Présentation interactiveCe format permet de gérer des présentations navigables à l’aide de sliders dotés de flèches. Ils permettent de passer d’une image à une autre avec un effet de transition dynamique et visuellement très agréable, à la manière d’un PowerPoint.

4. Poster interactifComme son nom l’indique, ce modèle semble correspondre au besoin particulier de produire un contenu de grande taille, très graphique mais plutôt minimaliste. Un choix quelque peu limité de designs pré-définis s’offre à nous.

5. AutresTous les contenus divers et inclassables du type CV, guide, questionnaire, etc…

From scratchVous pouvez également partir d’un template vide « from scratch ». Cela permet de choisir les dimensions exactes de votre contenu mais aussi de laisser plus de place à la créativité. Les possibilités sont alors infinies.

Outils d’édition

La prise en main des outils d’édition est rapide et relativement aisée même si le fonctionnement demeure semblable à d’autres solutions du même genre. Le placement des différents éléments est facile à prendre en main et s’effectue via un système de Drag’n Drop.

Dans cette section, Nous allons découvrir ensemble les différents outils mis à disposition par Genially :

Les pins (gestion de l’interactivité des éléments)Ces points peuvent prendre la forme d’une icône personnalisable. Une fois placés, il est possible de leur attribuer une façon spécifique d’interagir avec l’utilisateur. Par exemple, je peux, lorsque quelqu’un clique sur un pin, afficher du texte, faire apparaître une fenêtre de type « lightbox », rediriger vers un autre slide mais aussi insérer une URL.

TexteL’outil texte permet de créer des titres, des sous-titres, des paragraphes et des listes numérotées.

RessourcesDans ces ressources, nous retrouvons des bibliothèques qui contiennent des formes géométriques basiques, des illustrations colorées, des icônes flat, des photos et des GIFs.

BackgroundVous l’aurez facilement deviné, il s’agit ici de définir l’image de fond ou bien simplement la couleur de fond pour un rendu plus abstrait. Vous pouvez aussi choisir un background parmi ceux proposés par Genially.

AnimationSuffisamment d’options sont disponibles pour permettre de créer des effets fort sympathiques. Du choix de l’effet en passant par la direction et la vitesse d’exécution, il y a largement de quoi faire pour rendre un contenu dynamique et vivant.

EmbedCette fonction possède la faculté d’importer du code HTML, des fichiers, des vidéos et quelques autres éléments du genre.

ImageL’import d’image s’effectue via un système de glisser-déposer classique, le poids de l’image étant limité à 5 Mb.

L’interface

Au premier abord, l’interface est plutôt séduisante et agréable à l’œil. A notre gauche, vous retrouverez les outils d’édition présentés dans la section fonctionnement de cet article. En haut à gauche se situe l’accès au profil de l’utilisateur, aux paramètres du compte et au support du site.

A droite, un élément important est présent, c’est l’éditeur de slides. Ces derniers peuvent être dupliqués ou supprimés si besoin. Enfin, en haut à droite, diverses options sont présentes comme par exemple l’export et la preview de la création.

Création d’une infographie

Dans le cadre de notre test, nous décidons de produire une infographie animée sur le thème des pistolets Nerf.

Voici l’infographie créée pour ce test :

Autre exemple

Voici un autre exemple d’infographie réalisée avec Genially. Cette dernière, ci-dessous, est placée sous le thème du Tour de France et illustre très bien les possibilités du soft.

Tarifs

En ce qui concerne les tarifs, trois formules sont proposées. La première formule est gratuite et les deux autres sont payantes. Le test a été effectué avec un compte gratuit et cette formule ne nous limite que pour certaines options comme l’export HTML / PDF et la possibilité de rendre la création Genially privée ou publique.

Une fois que votre création est achevée et que vous désirez la partager, plusieurs options de partage sont disponibles en cliquant sur l’onglet Share en haut à droite de l’écran.

La première option permet de partager l’oeuvre graphique vers les réseaux sociaux. La seconde option affiche tout simplement un lien à transmettre. La troisième propose un code HTML à importer dans un site web. La dernière option est l’envoi par mail.

Genially, en conclusion

En résumé, Genial.ly dispose d’un panel complet et largement suffisant pour concevoir un contenu interactif à forte valeur ajoutée. En l’espace d’une matinée nous avons pu concevoir rapidement une infographie interactive de façon intuitive.

La grande puissance de l’outil réside dans sa capacité à transformer un média statique en un média riche, vivant et interactif.

Bien que cet outil ne soit disponible qu’en anglais, la plateforme est simple d’utilisation.

Dernier avantage, et pas des moindre : son coût. Totalement gratuit, il ne demande qu’une inscription ultra simple pour pourvoir l’utiliser.

Alors n’hésitez plus, foncez !