Quel outil utiliser pour vos images interactives ?

Ajouter des éléments interactifs à une image permet souvent d’économiser de nombreux paragraphes d’explication et d’exploiter tout le potentiel visuel d’un article. Trois outils en ligne permettent aujourd’hui de créer des images interactives.

Si vous n’êtes pas convaincu(e) par l’intérêt pour les journalistes d’utiliser l’image interactive, lisez notre liste des 7 raisons de le faire.

1 » Thinglink

Thinglink a tout de l’outil idéal. Il assure le support natif d’un nombre incroyable de services en ligne :

Vidéo
Musique
Images
Social
E-commerce
Autres
Youtube Spotify Flickr Facebook Amazon Wikipedia
Vimeo SoundCloud Instagram Twitter Etsy CNET
TED Official.fm 23hq LinkedIn Best Buy Slideshare
Bambuser Rdio deviantART Scribd eBay Eventbrite
Qik Mixcloud Photobucket Meetup Savalanche Speaker Deck
Hulu iTunes Imgur yelp Google Maps
Clickthrough Chirbit ThingLink Polldaddy
Blip Huffduffer TwitrPix Thrillcall
USTREAM Mailchimp
VHX FanBridge
dotSUB TopSpin
Animoto

C’est à dire qu’en indiquant l’adresse d’une vidéo Youtube, d’une photo Flickr ou d’une compte Twitter, l’outil embedde automatiquement leur contenu dans son infobulle. Thinglink vous permet également de créer vos propres tags « rich media » à partir d’autres sites ou services grâce au système Open Graph.

Deuxième avantage : la variété des icônes disponibles, qui permet au lecteur de différencier aisément une vidéo d’un lien Amazon ou d’un compte Facebook. Il est même possible d’importer vos propres icônes !

Troisième point fort : la facilité d’utilisation. Il suffit de cliquer sur l’image pour ajouter un point sur l’image. Quant à l’embed, il se fait en un clic, avec un code similaire à celui de Youtube à insérer dans votre site/blog.

Quatrième atout : la dimension très sociale du service. Thinglink propose en effet un système de commentaires ainsi qu’un bouton « touch », équivalent du « like » Facebook.

A noter aussi qu’il est possible d’utiliser directement des images provenant de Facebook et de Flickr, et qu’une option permet à n’importe quel utilisateur de venir enrichir votre image.

Voilà ce que cela donne :

 

Des utilisations de Thinglink par France Diplomatie, CNN, le HuffPost ou L’Echo.

2 » Stipple

Ce concurrent ressemble comme deux gouttes d’eau à Thinglink, avec un look soigné, une utilisation facile et un support natif de nombreux services (Evenbrite, Facebook, Flickr, Foursquare, Soundcloud, Twitter, Vimeo, Wikipédia, YoutubeGoogle Maps).

Comme Thinglink, les images Stipple s’embeddent automatiquement dans les tweets, à la manière des vidéos Youtube :

Stipple embeddé dans un tweet


[MàJ le 29/01/2013 suite à une précision de Stipple par mail]


Le petit plus qui change tout : Stipple permet d’embedder n’importe quel code HTML à l’intérieur de vos tags, en insérant simplement vos balises à l’intérieur du champ « Description »


Stipple est également très axé monétisation de contenu, avec un système de tags publicitaires sur les produits présents dans l’image, qui permettent aux marques de rémunérer les auteurs de l’image


[/MàJ]


Le résultat :  

Des utilisations de Stipple par le Washington Post, CNN, France 3 ou People.

3 » ImageSpike

ImageSpike fait clairement moins bien que les deux premiers.

Il ne propose le support natif que de Youtube et des images.

Un petit plus intéressant, toutefois : ImageSpike permet (ici) de personnaliser entièrement le contenu de votre info-bulle, en insérant un code HTML arbitraire. Un moyen détourné d’embedder tous les contenus que vous souhaitez (Dailymotion, Vimeo, un tweet, des liens…) malgré l’absence de support natif.

Il est également possible de personnaliser les icônes (mais pas une par une, malheureusement) et les couleurs.

Le résultat est donc nettement moins séduisant :

4 » Taggstar

Difficile de trouver des arguments en faveur de Taggstar : installation compliquée, incompatibilité avec les sites hébergés sur WordPress.com, utilisation peu intuitive, embed impossible hors du site d’origine…

L’outil séduira davantage l’e-commerce et les médias spécialisés dans la mode, puisque Taggstar intègre une techonologie de reconnaissance des vêtements issus de plus de 200 boutiques en ligne. MSN Style l’a par exemple testé sur la garde-robe de Kate de Middleton.

Seuls bons points : le support de Youtube, Vimeo et Flickr ainsi que la possibilité d’associer chaque point à un lieu sur une Google map.

Pour un résultat très limité… qui a une fâcheuse tendance à bugger sous Google Chrome :

Taggstar

5 » Luminate

Aussi peu convainquant, Luminate requiert d’insérer un petit script dans le code source de vos pages pour pouvoir l’utiliser, ce qui n’est pas toujours pratique/évident.

L’outil permet uniquement d’insérer du texte et des liens, mais n’embedde aucun média. Il est seulement possible d’activer des « applications » secondaires, qui permettent par exemple d’afficher des tweets liés, des publicités ou des produits commerciaux similaires (avec une solution de monétisation).

Décevant :

Luminate

» Bilan : le meilleur outil

Thinglink gagne selon nous la bataille grâce à sa facilité d’utilisation et sa compatibilité avec la plupart des services en ligne existants. Il est talonné de près par Stipple grâce à sa fonction d’embed personnalisé.

Comment l’utiliser au mieux dans votre rédaction web ? Lisez notre liste des 7 utilisations possibles de Thinglink dans le journalisme web.

» Autres exemples d’images interactives

Le Washington Post a pris une photo très haute définition de la prestation de serment de Barack Obama pour un second mandat, en « taguant » toutes les personnalités officielles et en proposant aux lecteurs de se « taguer » eux-mêmes via Facebook s’ils étaient présents.

La prestation de serment de Barack Obama, par le Washington post

Le Monde.fr a utilisé la photo officielle du gouvernement Ayrault pour faire des liens vers les portraits respectifs des ministres :

La photo cliquable du gouvernement Ayrault

Vous avez repéré d’autres utilisations de l’image interactive ? Mentionnez-les dans les commentaires de l’article !

N’hésitez pas à :

2 thoughts on “Quel outil utiliser pour vos images interactives ?

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Vous pouvez utiliser ces balises et attributs HTML : <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>