Webseiten mit Alexa und Websockets navigieren

Keine Kommentare

In dieser Artikelserie werde ich praxisnah zeigen, wie man mithilfe eines Alexa Skills eine Webseite fernsteuern kann. Dabei werde ich zeigen, wie man:

  1. einen eigenen Alexa Skill mit dem Alexa Skill Kit erstellt (in diesem Artikel)
  2. eine Deployment Pipeline für Lambda mit AWS CodeStar erzeugt
  3. den Lambda Code für Alexa erzeugt und WebSockets nutzt, um eine Webseite damit zu navigieren.

Die Architektur des Skills wird am Ende die Folgende sein:

Architektur Alexa Websockets Webseite

Alexa Skills Kit 101

Voraussetzungen

Bevor wir uns mit der Entwicklung eines Skills beschäftigen können, müssen folgende Voraussetzungen erfüllt sein:

Einen Skill erstellen

Für das Erstellen eines Alexa Skills verwenden wir das sog. Alexa Skills Kit (ASK). Dieses finden wir in der Amazon-Developer-Konsole (https://developer.amazon.com/home.html).

Amazon Developer Console

Wir klicken hier auf “Alexa Skills Kit” und kommen zur Übersicht unserer Alexa Skills.

Create new Alexa Skill

In der rechten oberen Ecke klicken wir auf den Button “Create Skill”.

Name und Sprache vom Alexa Skill

Auf der folgenden Seite wählen wir unseren Namen für den Skill. In unserem Beispiel entscheide ich mich für “Webseiten Navigator”. Als Sprache wähle ich “German”.

Auf Konferenzen und Vorträgen wird häufig gefragt, ob der Skill-Name einzigartig sein muss. Die Antwort ist nein. Es kann im Skill-Store auch Skills mit gleichem Namen geben. Jeder Nutzer muss die Skills für seine Alexa sowieso manuell aktivieren. Aktiviert man zwei Skills mit demselben Namen, wird Alexa den Skill verwenden, der zuerst aktiviert wurde. Trotzdem ist es natürlich sinnvoll, aus Marketinggründen ggf. einen eindeutigen eigenen Namen zu finden.

Model des Alexa Skills

Mit einem Klick auf “Next” kommen wir zur Auswahl des Skill Models. Hier entscheiden wir uns, ob wir einen eigenen “Custom Skill” oder einen vordefinierten Skill erstellen wollen. Vordefinierte Skills sind z.B. Skills für die tägliche Zusammenfassung (“Flash Briefing”), Smart Home Skills oder Video-Skills für neuere Echo-Geräte mit Bildschirm. Wir entscheiden uns für den Custom Skill, da wir hier die meisten Möglichkeiten haben, den Skill nach unseren Vorlieben zu gestalten und wir in die anderen Modelle mit unserem Anwendungsfall auch nicht hineinpassen.
Dann klicken wir oben rechts auf “Create Skill”.

Invocation Name

Wir werden nun zu unserem Model Editor weitergeleitet, wo wir definieren, was unser Skill alles kann. Wir beginnen damit, den “Invocation Name” festzulegen. Das ist der Name, den der Nutzer sagen muss, um unseren Skill zu starten.

Invocation Names des Alexa Skills

Beim Invocation Name müssen wir beachten, dass Alexa in der deutschen Ausführung auch versucht, alles, was der Nutzer sagt, auf deutsche Wörter zu mappen. Sollten wir einen englischen Firmennamen haben, kann das dazu führen, dass Alexa nicht immer versteht, was wir von ihr wollen. Deswegen kann es Sinn ergeben, anstelle des englischen Namens eine Art deutsche phonetische Bezeichnung zu nutzen. Also anstatt “christmas” als Invocation Name zu nutzen, könnten wir “kris mäss” nehmen. Meistens funktionieren solche phonetischen Namen besser als die englischen Originale. Aber das muss man im Einzelfall einfach testen.
Invocation Name des Alexa Skills German

In unserem Fall habe ich bereits die deutschen Begriffe „webseiten navigator“ gewählt, weshalb es nicht zu Problemen kommen sollte.

Intents, Utterances und Slots

Als nächstes kümmern wir uns um die sog. “Intents”. Das sind im Grunde die unterschiedlichen Funktionen unseres Skills, die ein Nutzer verwenden kann. Ein Intent besteht aus einem Intent-Namen und den sog. “Utterances”. Die Utterances sind die Sätze oder Wortgruppen, die der Nutzer sagen muss, um den Intent aufzurufen. Es gibt in jedem Skill vordefinierte Intents, auf die Amazon besteht. Diese heißen AMAZON.StopIntent, AMAZON.HelpIntent und AMAZON.CancelIntent. Wie der Name schon vermuten lässt, sind die Intents dazu da, den Skill zu beenden (AMAZON.StopIntent), eine Hilfe aufzurufen (AMAZON.HelpIntent) oder Alexa bei der aktuellen Konversation zu unterbrechen, ohne den Skill zu verlassen (AMAZON.CancelIntent).

Alexa Intent erstellen

Wir legen nun unseren eigenen Intent an durch Klick auf die Schaltfläche “+ Add Intent” im Intents-Dialog.

Alexa Intent Name vergeben

Wir wählen einen Custom Intent und vergeben den Namen “NavigateToPage”.

Alexa Utterances erstellen

Im folgenden Dialog werden wir dazu aufgefordert, die Utterances anzugeben. Wir tragen dort folgenden Satz ein: “Navigiere zur Seite {PAGE_NAME}”. Wenn wir die öffnende geschweifte Klammer eintragen, zeigt uns der Editor ein Overlay für die sog. “Slots” an.
Wir erstellen in diesem Overlay einen neuen Slot mit dem Namen “PAGE_NAME” und klicken auf die Schaltfläche “Add”. Anschließend bestätigen wir den Satz noch mit Enter im Eingabefeld und sehen dann, dass die Utterance hinzugefügt wurde und auch der Slot dem Intent zugewiesen wird:

Alexa Utterance erstellt

Slots sind im Prinzip so etwas wie Variablen in unserem Satz. Der Nutzer kann also z.B. “Navigiere zur Seite Home oder “Navigiere zur Seite Impressum sagen. In beiden Fällen würde unser Intent aufgerufen werden und der Slot wird als Parameter an unsere Funktion übergeben – dazu später mehr.

Einen eigenen Slot Type anlegen

Jeder Slot muss einen bestimmten Slot Type haben. Es gibt vordefinierte Slot Types wie z.B. AMAZON.NUMBER oder AMAZON.DATE oder wir erstellen unseren eigenen Slot Type. Slot Types sind in der Regel feste Datentypen wie Date oder Number oder endliche Aufzählungen von Werten, ähnlich eines Enums. Ein Sonderfall ist der vordefinierte Slot Type AMAZON.SearchQuery. Dieser erlaubt so etwas wie Freitexteingaben, ohne dass feste Werte vorgegeben werden müssen.

Alexa Custom Slot Type

Bisher hat unser Slot “PAGE_NAME” noch keinen Slot Type. Diesen werden wir jetzt erstellen. Dazu wechseln wir in den Unterpunkt “Slot Types (0)” in der linken Navigationsleiste. Anschließend klicken wir auf den Button “+ Add Slot Type”. Wir vergeben den Namen “LIST_OF_PAGES” und bestätigen mit einem Klick auf “Create custom slot type”.

Alexa List of Pages Slot

Im Anschluss geben wir die Werte ein, die unser Slot Type annehmen kann. Ich beschränke mich hier auf die beiden Werte “Home” und “Impressum”.

Select Slot Type

Wir weisen nun diesen Slot Type unserem Slot “PAGE_NAME” zu. Dazu gehen wir zurück in unseren Intent “NavigateToPage” und wählen dort unseren neu erstellen Slot Type “LIST_OF_PAGES” aus.

Save Alexa Model

Jetzt ist ein guter Zeitpunkt gekommen, unser Model zu speichern und bauen zu lassen. Wir klicken dazu auf den Button “Build Model” im oberen Bereich.

Endpoint definieren

Als letztes müssen wir in diesem Editor noch unseren Endpoint festlegen. Der Endpoint ist die Funktion, die auf die Intents unseres Skills reagiert und dafür verantwortlich ist, die richtigen Antworten zu geben und im Hintergrund Aktionen auszuführen. Wir klicken also auf den Punkt “Endpoint” in der linken Navigation und wählen dann die Option “AWS Lambda ARN” aus.

Set Endpoint for Alexa Lambda

Hier muss nun die ARN, also die ID der Lambda-Funktion, eingetragen werden. Jedoch haben wir die Lambda bisher noch nicht erstellt. Dies machen wir im folgenden Teil dieser Serie mithilfe von AWS CodeStar.

Habt ihr bis hierhin Fragen oder Anregungen, dann freue ich mich über einen Kommentar von euch.

René Bohrenfeldt

René Bohrenfeldt ist seit mehr als 10 Jahren in der Software-Entwicklung tätig und fokussiert sich dabei hauptsächlich auf Frontend-Technologien. Bei der codecentric AG setzt er als IT-Consultant sowohl sein Entwicklungs-Know-how als auch seine Kommunikationsstärke als PO und Moderator ein.
Darüber hinaus engagiert sich der studierte Betriebswirt unternehmerisch und ist Mitgründer einer Busvermietung in Berlin.

Kommentieren

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.