De historische voicebot: 8 stappen (met afbeeldingen)

2024 Auteur: John Day | [email protected]. Laatst gewijzigd: 2024-01-30 11:16

Hieronder een snel overzicht van de inhoud.

• Introductie- en presentatievideo
• Concept
• architectuur
• Stap 1: Chatbot
• Stap 2: touchscreen
• Stap 3: Pauze
• Stap 4: Vintage telefoon- en spraakkit
• Stap 5: Testen!

Benodigdheden

Kader

Touch screen

Vintage telefoon

Google AIY-stem

Node.js

Amazon Web Services AWS EC2

Google Dialogflow

Heet lijmpistool (generiek)

Handzaag

Soldeerbout (generiek)

Stap 1: Introductie- en showcasevideo

Praat met je favoriete persoon uit het verleden met de Historic Voicebot! Met deze interactieve installatie kun je zowel via chat als spraak met een historische figuur praten. Gemaakt met Dialogflow, Node.js, HTML Canvas, een AIY Voice Kit, een Raspberry Pi en een vintage telefoon.

Stap 2: Concept

Het concept bestaat uit twee delen: Een touchscreen met animaties van een historische figuur. Het touchscreen geeft ook het dialoogvenster weer en heeft knoppen zodat mensen een FAQ kunnen stellen. Een fysieke telefoon die spraak opneemt en audio-uitvoer geeft, zodat deze kan worden gebruikt om vragen te stellen en naar het antwoord te luisteren.

Stap 3: Architectuur

De drie belangrijkste onderdelen zijn:

• De backend, inclusief Dialogflow en een Node.js-server
• De frontend, die bestaat uit een HTML Canvas-pagina
• De interactieve installatie, met een touchscreen en een AIY Voice Kit geïntegreerd in een vintage telefoon

Stap 4: Stap 1: Chatbot

Dialoogvenster

Om de gesprekspartner in Dialogflow te maken, heb ik een aantal verschillende benaderingen geprobeerd en getest om de meest nauwkeurige en betrouwbare antwoorden mogelijk te krijgen. Ik wilde ook zoveel mogelijk van het maken van dialogen automatiseren. Ik ontdekte dat in dit geval de gemakkelijkste en meest betrouwbare manier om kennis toe te voegen aan een Dialogflow-chatbot was door een CSV-bestand met vraag- en antwoordparen toe te voegen. Voor de Historic Voicebot heb ik handmatig 20 vraag- en antwoordparen gemaakt en deze toegevoegd aan Dialogflow. Zoals u kunt zien, zijn de antwoorden van Ada Lovelace correct, actueel en betrouwbaar. Meer informatie over Dialogflow vind je hier.

Node.js

Server Zoals vermeld in de architectuur, is de Node.js-server het brein van de operatie, die zorgt voor de verbinding tussen Dialogflow en de verschillende apparaten. Voor de eerste versies draaide de server lokaal op mijn laptop. Voor de huidige versie is de server geïmplementeerd op een EC2 Amazon Web Services-server waarop Ubuntu draait. Er zijn een aantal geweldige tutorials over Node.js en deze draaien op AWS.

Stap 5: Stap 2: Touchscreen

Graphics De animaties voor de Historic Voicebot zijn gemaakt door verschillende elementen, zoals de armen, wenkbrauwen en kin, uit een schilderij van Ada Lovelace te knippen met Adobe Photoshop. Elk van deze elementen werd afzonderlijk op de HTML Canvasfrontend geplaatst. De TweenJSJavaScript-bibliotheek werd gebruikt om deze uitsnijdingen te verplaatsen en te animeren op basis van de input van gebruikers en de reacties van Dialogflow.

Kader Om het plaatje compleet te maken is een oud kader op maat gesneden voor het touchscreen. Zoals altijd, twee keer meten, één keer knippen.

Stap 6: Stap 3: Pauze

Vergeet niet om af en toe een ontspannende pauze te nemen!

Stap 7: Stap 4: Vintage telefoon- en spraakkit

Voor de telefoon probeerde ik er een te vinden die werd gebruikt tijdens het Ada Lovelace-tijdperk. Niet alleen werden telefoons uitgevonden lang nadat ze stierf, echt oude telefoons zijn moeilijk te vinden. Desalniettemin kon ik een oude Ericsson-draaitelefoon kopen die in de jaren zestig was geproduceerd.

Om de werkende voicebot te maken, probeerde ik de AIY-kit in de telefoon te plaatsen en zoveel mogelijk van de originele functies te hergebruiken.

Ik kon de luidspreker en de twee bellen in de telefoon opnieuw gebruiken. De roterende schijf werd ook intact gehouden, maar is momenteel niet functioneel. Ik heb de microfoon die in het handvat zat geüpdatet naar een moderne, om de audio-invoer nauwkeurig te kunnen vastleggen. Ik heb het oude telefoonsnoer vervangen door een nieuwe om de nieuwe microfoon correct te kunnen aansluiten.

Stap 8: Stap 5: Test

Werkt het eigenlijk? Er is maar één manier om erachter te komen, laten we het testen!

Dat was het voor het Historic Voicebot-project, spreek je later!