Dites bonjour aux bots !

Vous en avez surement entendu parler, les bots arrivent ! Plus encore, certains prédisent qu’ils causeront la fin des applications mobiles ! Tout au long de cette article, nous allons répondre aux questions que tout le monde se pose. Qui sont-ils ? Pourquoi un tel engouement ? Comment créer votre premier bot avec Api.ai, Facebook Messenger et Node.js ?

Qu’est-ce qu’un bot ?

Un bot est un programme autonome, muni d’une intelligence artificielle, capable d’interagir avec des personnes et des systèmes. Une des principales caractéristiques des bots et leur capacité à se comporter comme un humain, avec plus ou moins de succès.

Si les bots sont présents dans le monde des jeux vidéos depuis plusieurs années, la tendance dans le monde est aujourd’hui du côté des agents conversationnels. Sans vraiment vous en apercevoir, vous en avez sûrement déjà utilisé, Siri, l’assistant personnel d’Apple, Google Now (ou Google Assistant), ou Cortana, la réponse de Microsoft, en sont des exemples parfaits. Ces bots la font parti de ceux qui sont capables de répondre à un très grand nombre de questions d’ordre générales, mais aussi de ceux capables d’effectuer des tâches liées à leur environnement, comme envoyer un SMS depuis le téléphone de l’interlocuteur.

Moins complets, mais toujours accès sur l’aspect conversationnel et l’échange avec une personne, les chatbots sont aussi à la mode sur les plateformes de messagerie. Ils sont très nombreux et de nouveau sont développés jour après jour. Facebook annonçait en Avril 2016 que sa plateforme Messenger comptait plus de 11000 bots, puis plus de 36000 en septembre 2016 ! Et il ne s’agit pas seulement de Facebook, Kik vient de lancer son propre “Bot Store” avec plus de 20000 bots disponible. Slack, Telegram ou encore Skype ont aussi ouvert leur plateforme aux développeurs afin d’y créer leurs chatbots.

Kik bot store

La différence avec les assistants personnels cités précédemment est qu’un chatbot est programmé pour réaliser des tâches moins nombreuses, mais plus précises. Leur intelligence artificielle se limite bien souvent au NLP (Natural Language Processing — traitement automatique du langage naturel). Autrement dit, décoder le requête d’un utilisateur, transmise sous forme de texte ou audio, afin de comprendre l’action à effectuer.

Un exemple français plutôt bien réalisé est le bot Voyage-SNCF présent sur la plateforme Facebook Messenger. En lui posant des questions, le bot va être capable de vous proposer les horaires des trains qui correspondent à vos dates et à votre trajet. Plus besoin de chercher le bon champ à remplir sur une page web munie d’une UI complexe, ou de télécharger l’application mobile, il vous suffit de discuter avec le bot pour avoir vos résultats, le tout via une interface minimaliste, 24/24heures et 7/7jours !

Voyage-sncf.com Bot

Un des grands avantages des chatbots est en effet leur disponibilité. Puisqu’ils sont autonomes, ils peuvent à tout moment vous donner instantanément l’information que vous voulez, tout en vous donnant l’impression de discuter avec une personne. Un autre avantage intéressant, vous pouvez commencer une conversation avec un bot à un certain moment dans votre journée, et continuer cette même conversation plusieurs heures, voire plusieurs jours plus tard. Imaginez la même chose avec le centre d’appel de votre fournisseur internet préféré ? Impossible aujourd’hui.

Les chatbots apparaissent ainsi comme un tout nouveau moyen pour les sociétés d’interagir avec leurs clients, quelque soit leur demande ; commander une pizza, recevoir les gros titres, acheter des vêtements, avoir des informations en direct sur un vol ou encore voir le détail d’une facture.

Et si les chatbots paraissent donc un investissement évident pour les sociétés offrant des services, leur succès est aussi dû à l’intérêt que portent les développeurs vis-à-vis des chatbots. Et pour comprendre cet intérêt, il faut regarder du côté des tendances des applications mobiles.

La fin des applications mobiles ?

Il y a plus de 4 millions d’applications mobiles disponibles sur Android et iOS, mais aux États-Unis, ¾ des utilisateurs de smartphone téléchargent en moyenne 0 application mobile par mois. Et sur toutes les applications que les utilisateurs utilisent, la majorité du temps passé est repartie entre trois applications, et la moitié du temps total concerne une seule application.

Là où internet et l’apparition de nombreux services cloud ont permis aux utilisateurs de ne plus avoir à installer des logiciels sur leurs ordinateurs, les constructeurs de smartphone ont pris une alternative différente. Et bien que justifiable en termes de réductions de la taille des transferts de données journaliers, pour pouvoir utiliser une application sur son smartphone, l’utilisateur se retrouve à devoir installer au préalable des applications qui occuperont plus ou moins de place sur son smartphone, voire la totalité de l’espace disponible.

Du côté des développeurs, la méthode parfaite pour créer une application mobile ne semble pas exister. Chaque année de nouvelles technologies et frameworks apparaissent, Cordova, Titanium, Ionic, React Native et tant d’autres… Et malgré toutes ces solutions, le développement natif semble être la seule solution capable de donner aux utilisateurs une expérience unique et apportant un vrai avantage par rapport a un site web responsive.

Seulement, le développement d’une application pour Android et pour iOS a un coût, un coût de design et de développement, un coût de maintenance, un coût que malheureusement peu d’entreprises sont prêtes à payer.

Pour en revenir aux bots, leur développement est bien plus simple, les plateformes de messagerie ayant toute (à quelques détails près) le même format d’entré, un champ de texte, il est très simple de développer un bot qui fonctionnera sur n’importe quel smartphone ou ordinateur.

Si en France, il est probablement encore un peu tôt pour voire les applications mobiles disparaître, WeChat, l’application de messagerie majeure en chine a su ouvrir la porte aux développeurs il y a maintenant plus de 4 ans. Le résultat est simple, WeChat est devenu presque une surcouche OS, où l’utilisateur n’a plus besoin de quitter l’application de messagerie pour acheter des vêtements ou commander des places de concerts. Les bots disponibles sur WeChat ont remplacé les applications mobiles. Cette démocratisation du commerce conversationnel reste à faire aux États-Unis et en Europe, mais Facebook, avec son milliards d’utilisateurs à bien pour intention de reprendre le même modèle que WeChat, et de faire de sa plateforme Messenger, un OS à part entière.

WeChat, Dites a Chumen Wenwen ce que vous voulez : restaurant, film, message, et il vous enverra la liste des possibilités autour de vous.

Si Android, iOS et les applications mobiles ont pris la place des navigateurs et des sites internet dans nos habitudes il y a quelques années, les applications de messagerie et les chabots ont l’ambition de prendre le relais le plus vite possible.

Facebook Messenger, KLM Royal Dutch Airlines bot.

Afin de suivre cette tendance voici un petit tutoriel concernant la création d’un bot sur Facebook Messenger.

Créer votre propre bot sur Facebook Messenger grâce a API.AI

Afin de rendre l’exemple suivant réaliste, la suite de l’article sera basée sur la création d’un bot lié aux services proposés par un cinéma. Toutefois, le workflow proposé ci-dessous peut très bien s’appliquer à d’autres services, comme un bot orienté services clients, ou un bot vendeur de produits divers et variés.

Avant de commencer, assurer d’avoir un serveur Node.js tournant sous HTTPS.

La première étape consiste à créer votre agent sur api.ai. Api.ai est une plateforme de création d’agents conversationnels très complets, facile à configurer, et à personnaliser, et probablement une des meilleures plateformes gratuites de NLP. Après un peu de configuration, Api.ai permettra à votre bot de comprendre les requêtes de son interlocuteur et de choisir une action à effectuer en fonction de ces mêmes requêtes.

Api.ai, création de l’agent conversationnel

Après avoir créé votre agent, vous pouvez voir sur la gauche de la plateforme un certain nombre d’onglets, avant de vous y intéresser, il y a deux mots à savoir.

Un Intent représente un mapping entre une requête utilisateur et une action qui va être effectué par le back-end du bot. Plus d’info ici https://docs.api.ai/docs/concept-intents.

Une Entity représente un paramètre spécial présent dans un Intent. Plus d’info ici https://docs.api.ai/docs/concept-entities.

Par exemple sur notre bot de cinéma, on peut considérer trois Intents (on pourrait en choisir beaucoup plus, mais c’est un bon départ):

  1. Affiche, c’est fonctionnalité va permettre à l’utilisateur de récupérer une liste des filmes à l’affiche
  2. Description, ici, on permet à l’utilisateur d’avoir une petite description d’un film en question. À la différence de l’Intent précédent, on trouve ici une Entity “Film” qui va nous permettre de récupérer le nom du film dont l’utilisateur veut la description
  3. Localisation, qui va permettre à l’utilisateur de récupérer l’adresse du cinéma
Api.ai, la liste d’Intent

Lors de la création d’un Intent, assurez de donner suffisamment d’exemples pour chaque fonctionnalité. Plus vous donnerez d’exemples, plus votre bot sera capable de détecter avec précision la fonctionnalité voulue par l’utilisateur. Assurez vous aussi de remplir le champ « action », c’est ce champ la que vous utiliserez dans votre backend pour choisir la fonction à effectuer.

Api.ai, Affiche Intent

Dans le cas de la fonctionnalité « description », nous allons devoir dans un premier temps créer une Entity « Film ». Cette Entity comprendra le nom des différents films dont l’utilisateur pourra récupérer la description.

Api.ai, Film Entity

Un conseil lorsque vous créez une Entity, entrez aussi comme synonyme des fautes d’orthographe que pourrait potentiellement faire un utilisateur. Api.ai traite assez bien les fautes d’orthographe pour les Intents, mais paraît être moins performant pour les Entities.

Lors de la création de l’Intent description, entrez d’abord les phrases d’exemples, puis sélectionnez les mots correspondants a l’Entity. Dans notre exemple, les titres des films représentent l’Entity Film.

Api.ai, Description Intent

Je vous invite aussi à tester votre bot directement dans la console de test sur la droite, elle a l’avantage d’afficher aussi la réponse sous forme de JSON, ce qui sera utile lors du développement du bot.

Pour aller plus loin avec Api.ai, jetez un œil du côté des « Domains » qui sont des interactions déjà implémentés dans le bot, et du côté du « Context » dans les Intents qui permet de créer des conversations basées sur plusieurs échanges.

Pour plus d’info :
• Domain : https://docs.api.ai/docs/domains
• Context : https://docs.api.ai/docs/concept-contexts


Intéressons-nous maintenant à la plateforme Facebook Messenger. Pour commencer, connectez-vous sur https://developers.facebook.com.

Facebook developers console

Avec de créer votre application Messenger, vous allez devoir créer une page Facebook pour votre bot. Rendez-vous sur https://www.facebook.com/pages/create et créez une page. Lors des développements, je vous conseille de ne pas publier votre page pour faire en sorte que seules les personnes autorisées puissent y accéder.

Création d’un page Facebook

Une fois votre page créée, vous pouvez créer votre application Messenger, https://developers.facebook.com/apps. Faites bien attention à choisir la catégorie Messenger.

Création de l’application pour Facebook Messenger

Une fois sur le dashboard de votre application, il y a quelques étapes de configuration :

  1. La génération d’un token lié à votre page créé précédemment
  2. La configuration d’un webhook. C’est à cette URL que les messages venant des utilisateurs seront envoyés. Attention l’URL que vous choisissez doit être HTTPS. Entrez votre URL et choisissez les events messages et messaging_postbacks
  3. Lorsque vous allez vérifier la page, il est nécessaire d’avoir au préalable développé la vérification du webhook sur votre server

4. Enfin, abonnez le webhook a votre page.

Configuration du webhook

Si nécessaire, referez-vous à la documentation official de Facebook Messenger, https://developers.facebook.com/docs/messenger-platform.

Configuration finale de l’application Messenger

Votre app/page est maintenant configurée. Prochaine étape, recevoir et répondre aux messages en utilisant la Send/Receive API de Facebook Messenger.

À notre code de base, nous allons ajouter quelques fonctions :

La méthode sendTextMessage permet de créer le format de donnée correspondant à l’envoi d’un message de type text via l’API Send/Receive.

La méthode callSendAPI va envoyer ce message à l’API, soyez sûre d’avoir remplacer le token par votre propre token.

Après avoir intégré ce code, vous aurez un bot pour le moment uniquement capable de répéter les messages qu’il reçoit.

Votre premier bot sur Messenger

Nous allons maintenant intégrer Api.ai au bot. Nous allons créer deux fonctions dans la classe FBCinema.

La première, apiaiRequest, va envoyer le message reçu a la plateforme Api.ai et va récupérer la fonction à exécuter et éventuellement les paramètres (Entities) de la requête.

La fonction createResponse va simplement analyser le résultat renvoyé par Api.ai et créer le message à envoyer à l’utilisateur. C’est ici que votre bot devra chercher les informations depuis une ressources extérieurs (Base de données ou API). Pour notre cas d’exemple, j’ai choisi de renvoyer uniquement une phrase prédéfinie par action.

Attention la fonction receivedMessage a été modifiée.

Voici donc le résultat:

Votre bot sur Facebook Messenger

La plateforme Facebook Messenger offre beaucoup d’autre fonctionnalité, comme la réception et l’envoi de documents, de photos, et bien d’autres types de messages. Mais aussi la création d’une landing page pour votre bot, un menu, les ‘quick responses’ ou encore la capacité d’authentifier les utilisateurs via un serveur OAuth. Facebook améliore constamment cette plateforme, donc n’hésitez à regarder régulièrement les nouvelles fonctionnalités apportées.

Il ne vous reste plus qu’à améliorer vos actions présentes dans la fonction createResponse afin d’interagir avec vos API favorites :)