Table des matières:

Le Voicebot historique : 8 étapes (avec photos)
Le Voicebot historique : 8 étapes (avec photos)

Vidéo: Le Voicebot historique : 8 étapes (avec photos)

Vidéo: Le Voicebot historique : 8 étapes (avec photos)
Vidéo: Cas pratique Voicebot avec Enedis 2024, Juillet
Anonim
Le Voicebot historique
Le Voicebot historique

Ci-dessous un aperçu rapide du contenu.

  • Vidéo d'introduction et de présentation
  • Concept
  • Architecture
  • Étape 1: Chatbot
  • Étape 2: Écran tactile
  • Étape 3: Pause
  • Étape 4: Kit téléphone et voix vintage
  • Étape 5: Testez !

Fournitures

Cadre

Écran tactile

Téléphone vintage

Google AIY Voix

Node.js

Amazon Web Services AWS EC2

Flux de dialogue Google

Pistolet à colle chaude (générique)

Scie à main

Fer à souder (générique)

Étape 1: Vidéo d'introduction et de présentation

Image
Image

Discutez avec votre personne préférée du passé avec le Voicebot historique ! Avec cette installation interactive, vous pouvez parler à un personnage historique par le biais du chat et de la voix. Réalisé avec Dialogflow, Node.js, HTML Canvas, un AIY Voice Kit, un Raspberry Pi et un téléphone vintage.

Étape 2: Conception

Architecture
Architecture

Le concept se compose de deux parties: Un écran tactile avec des animations d'un personnage historique. L'écran tactile affiche également la boîte de dialogue et comporte des boutons permettant aux utilisateurs de poser une FAQ. Un téléphone physique qui capture la parole et fournit une sortie audio, il peut donc être utilisé pour poser des questions et écouter la réponse.

Étape 3: Architecture

Les trois parties principales sont:

  • Le backend, qui inclut Dialogflow et un serveur Node.js
  • Le frontend, qui consiste en une page HTML Canvas
  • L'installation interactive, qui comprend un écran tactile et un kit vocal AIY intégré dans un téléphone vintage

Étape 4: Étape 1: Chatbot

Étape 1: Chatbot
Étape 1: Chatbot

Flux de dialogue

Pour créer l'agent conversationnel dans Dialogflow, j'ai essayé et testé un certain nombre d'approches différentes pour obtenir les réponses les plus précises et les plus fiables possibles. J'ai également entrepris d'automatiser autant que possible la création de dialogue. J'ai découvert que dans ce cas, le moyen le plus simple et le plus fiable d'ajouter des connaissances à un chatbot Dialogflow consistait à ajouter un fichier CSV avec des paires de questions et réponses. Pour le Voicebot historique, j'ai créé manuellement 20 paires de questions et réponses et les ai ajoutées à Dialogflow. Comme vous pouvez le voir, les réponses d'Ada Lovelace sont correctes, opportunes et fiables. Vous pouvez trouver plus d'informations sur Dialogflow ici.

Node.js

Serveur Comme mentionné dans l'architecture, le serveur Node.js est le cerveau de l'opération, assurant la connexion entre Dialogflow et les différents appareils. Pour les premières versions, le serveur fonctionnait localement sur mon ordinateur portable. Pour la version actuelle, le serveur est déployé sur un serveur EC2 Amazon Web Services exécutant Ubuntu. Il existe d'excellents tutoriels sur Node.js et son exécution sur AWS.

Étape 5: Étape 2: Écran tactile

Étape 2: Écran tactile
Étape 2: Écran tactile
Étape 2: Écran tactile
Étape 2: Écran tactile
Étape 2: Écran tactile
Étape 2: Écran tactile

Graphismes Les animations de l'Historic Voicebot ont été créées en découpant divers éléments, comme les bras, les sourcils et le menton, dans une peinture d'Ada Lovelace à l'aide d'Adobe Photoshop. Chacun de ces éléments a été placé individuellement sur le HTML Canvasfrontend. La bibliothèque TweenJSJavaScript a été utilisée pour déplacer et animer ces découpes en fonction des entrées des utilisateurs et des réponses de Dialogflow.

CadrePour compléter le tableau, un ancien cadre a été découpé à la taille de l'écran tactile. Comme toujours, mesurez deux fois, coupez une fois.

Étape 6: Étape 3: Pause

Étape 3: Pause
Étape 3: Pause

N'oubliez pas de faire une pause détente de temps en temps !

Étape 7: Étape 4: Kit téléphone et voix vintage

Étape 4: Kit téléphone et voix vintage
Étape 4: Kit téléphone et voix vintage
Étape 4: Kit téléphone et voix vintage
Étape 4: Kit téléphone et voix vintage
Étape 4: Kit téléphone et voix vintage
Étape 4: Kit téléphone et voix vintage

Pour le téléphone, j'ai essayé d'en trouver un qui a été utilisé à l'époque d'Ada Lovelace. Non seulement les téléphones ont été inventés longtemps après sa mort, mais les très vieux téléphones sont difficiles à trouver. Néanmoins, j'ai pu acheter un vieux téléphone à cadran Ericsson produit dans les années 1960.

Pour créer le voicebot fonctionnel, j'ai cherché à placer le kit AIY à l'intérieur du téléphone tout en réutilisant autant de fonctionnalités d'origine que possible.

J'ai pu réutiliser le haut-parleur et les deux cloches à l'intérieur du téléphone. Le disque rotatif a également été conservé intact, mais n'est actuellement pas fonctionnel. J'ai mis à jour le microphone qui se trouvait à l'intérieur de la poignée en un microphone moderne, pour pouvoir capturer avec précision l'entrée audio. J'ai remplacé l'ancien cordon téléphonique par un nouveau pour pouvoir câbler correctement le nouveau microphone.

Étape 8: Étape 5: Testez

Étape 5: Testez !
Étape 5: Testez !
Étape 5: Testez !
Étape 5: Testez !

Est-ce que ça marche vraiment ? Une seule façon de le savoir, testons-la !

C'est tout pour le projet Historic Voicebot, à plus tard !

Conseillé: