ElfLabs Tutorial: Erstellen einer einfachen Wortschreib-App mit Sprachsynthese

Einführung

Heutzutage ist eine der aufregendsten Zeiten für die Softwareentwicklung, mit dem Aufkommen verschiedener "generativer KI"-Tools auf dem Markt. Nennen Sie es einfach: Erstellung von Bewerbungsschreiben? Check! E-Mail-Generierung? Check! Automatische Codekommentargestaltung? Check! Selbst außerhalb der Programmierung und Softwareentwicklung sind die Möglichkeiten der Anwendungsfälle enorm. Jetzt können wir Bilder mit Textaufforderungen unter Verwendung verschiedener Bildgenerierungsmodelle generieren. Diese Innovation ermöglicht es uns, generierte Assets in unsere verschiedenen Produkte zu integrieren. Die nächste Frage ist: Wie steht es um Stimmen? Der Trend der Benutzererfahrungen in den letzten Jahren hat "Sprachbefehle" als aufkommenden Trend hervorgehoben. Es ist nur natürlich, dass die Software, die wir entwickeln, Stimmen als eine der Funktionen integriert. In diesem Tutorial werden wir die Funktion "Sprachsynthese" vorstellen, die von ElevenLabs in einer einfachen App angeboten wird, die zufällige Wörter generiert und sie buchstabiert. Um die Benutzeroberfläche für diese auf Python basierende App zu erstellen, verwenden wir Streamlit, eine neue UI-Bibliothek zum Teilen von Data-Science-Projekten.

Einführung in ElevenLabs

ElevenLabs ist ein Forschungsunternehmen für Sprachtechnologie, das eine Sprachsyntheselösung anbietet. Mit einer benutzerfreundlichen API ermöglicht es Entwicklern, qualitativ hochwertige Sprache mithilfe von KI zu generieren. Dies ist möglich aufgrund eines KI-Modells, das auf einer riesigen Menge von Hörbüchern und Podcasts trainiert wurde. Das Training ermöglicht es der KI, vorhersehbare und qualitativ hochwertige Ergebnisse in der Sprachgenerierung zu liefern. ElevenLabs bietet zwei Hauptfähigkeiten: VoiceLab, wo Benutzer Stimmen aus aufgezeichneter Audio und/oder vorhandenen vorgefertigten Stimmen klonen und Stimmen basierend auf Geschlecht, Alter, Ethnien und Rassen gestalten können. Sobald Benutzer die Stimmen haben, mit denen sie arbeiten können, können sie zur Sprachsynthese übergehen, sodass sie Reden mit ihren gestalteten oder vorgefertigten Stimmen generieren können.

Einführung in das Claude-Modell von Anthropic

Claude ist das neueste KI-Modell, das von Anthropic, einer Forschungsorganisation für KI, entwickelt wurde, die sich auf die Verbesserung der Interoperabilität, Robustheit und Sicherheit von KI-Systemen konzentriert. Das Claude-Modell ist so konzipiert, dass es menschenähnliche Antworten generiert, was es zu einem leistungsstarken Werkzeug für verschiedene Anwendungen macht, darunter Inhaltscreation, rechtliche Angelegenheiten und Kundenservice. Im Gegensatz zu anderen KI-Modellen legt Claude Wert auf Sicherheit, was es ihm ermöglicht, Ausgaben zu verweigern, die er als schädlich oder unwahr für Benutzer erachtet.

Einführung in Streamlit

Streamlit ist eine Open-Source-Python-Bibliothek, die die Erstellung und das Teilen von visuell ansprechenden und benutzerdefinierten Web-Apps für Entwickler und Data Scientists vereinfacht. Streamlit ermöglicht es Benutzern, voll funktionsfähige Data-Science-Apps in wenigen Minuten zu erstellen und bereitzustellen, dank seiner unkomplizierten und intuitiven API und verwandelt Daten-Skripte in UI-Komponenten.

Voraussetzungen

• Grundkenntnisse in Python und der UI-Entwicklung mit Streamlit
• Zugriff auf die Anthropic API
• Zugriff auf die ElevenLabs API

Gliederung

1. Initialisierung unseres Streamlit-Projekts
2. Hinzufügen der Funktion zur Wortgenerierung unter Verwendung des Claude-Modells
3. Hinzufügen der Funktion zur Sprachgenerierung mit der ElevenLabs API
4. Testen der Wortgenerator-App

Diskussion

In diesem Tutorial werden wir vier wesentliche Schritte durchlaufen. Zuerst müssen wir das Streamlit-basierte Projekt initialisieren, um uns mit der Entwicklung von Benutzeroberflächen mit Streamlit vertraut zu machen. Als Nächstes werden wir weitere Funktionen hinzufügen, beginnend mit der Erstellung einer Eingabeaufforderung, um das Claude-Modell dazu zu bringen, uns ein zufälliges Wort bereitzustellen, das häufig falsch geschrieben wird. Dann werden wir die von ElevenLabs bereitgestellte Text-zu-Stimme-Generierung integrieren, um zu demonstrieren, wie das mehrsprachige Modell die Wörter ausspricht. Schließlich werden wir die einfache App testen.

Initialisierung unseres Streamlit-Projekts

Lasst uns mit dem Programmieren beginnen! Zuerst erstellen wir ein Verzeichnis für unser Projekt und gehen hinein. Dieses Verzeichnis wird als Grundlage für unser Streamlit-Projekt dienen. Da ein Streamlit-Projekt im Wesentlichen ein Python-Projekt ist, müssen wir mehrere Schritte ausführen, um unser Python-Projekt zu initialisieren, z. B. unser virtuelles Environment zu definieren und zu aktivieren.

Sobald aktiviert, sollte die Ausgabe unseres Terminals den Namen des virtuellen Environments (env) anzeigen, wie folgt:

...

Als Nächstes ist es an der Zeit, die für dieses Projekt erforderlichen Bibliotheken zu installieren! Wir werden den pip-Befehl verwenden, um die Bibliotheken Streamlit, anthropic und elevenlabs zu installieren. Beachten Sie, dass wir auch eine versionierte Pydantic-Bibliothek installieren werden, um Pydantic-bezogene Fehler in einer der ElevenLabs-Funktionen zu verhindern.

Nachdem alle Anforderungen des Projekts eingerichtet sind, können wir nun in den Programmierbereich eintauchen! Erstellen Sie eine neue Datei in unserem Projektverzeichnis und benennen Sie sie randomwords_app.py.

Nachdem Sie die Datei erstellt haben, öffnen Sie sie in Ihrem bevorzugten Code-Editor oder integrierten Entwicklungsumgebung (IDE). Um zu beginnen, werden wir die einfache App aus den einfachsten Komponenten aufbauen: einem Titel und einem beschreibenden Text!

Um unsere Projektinitialisierung abzuschließen, lassen Sie uns einen Testlauf der App versuchen. Stellen Sie sicher, dass unser aktuelles Arbeitsverzeichnis weiterhin im Projekt liegt und dass unser virtuelles Environment aktiviert ist. Sobald alles bereit ist, verwenden Sie den Befehl streamlit run, um die App auszuführen.

Die App sollte sich automatisch in unserem Standardbrowser öffnen und vorerst den Titel und den Text anzeigen. Als Nächstes werden wir die Funktion zur Generierung zufälliger Wörter mithilfe des Claude-Modells hinzufügen.

Eine letzte Überlegung: Wir müssen unserer App die API-Schlüssel für die Dienste, die wir verwenden möchten, insbesondere das Claude-Modell von Anthropic und die Sprachsynthesefunktion von ElevenLabs, bereitstellen. Da diese Schlüssel als sensibel betrachtet werden, müssen wir sie an einem sicheren, isolierten Ort aufbewahren. Dieses Mal werden wir sie jedoch nicht in einer .env-Datei speichern. Der Grund dafür ist, dass Streamlit Umgebungsvariablen anders behandelt. Laut Dokumentation müssen wir eine geheime Konfigurationsdatei innerhalb eines .streamlit-Verzeichnisses erstellen. Wir können das Verzeichnis in unserem Projekt erstellen und dann die Datei anlegen.

Wir werden dann die TOML-Datei, die wir erstellt haben, bearbeiten, wobei zu beachten ist, dass die TOML-Datei eine andere Formatierung verwendet als eine traditionelle .env-Datei.

Hinzufügen der Funktion zur Wortgenerierung unter Verwendung des Claude-Modells

In diesem Schritt werden wir einen Button hinzufügen, um das zufällige Wort zu generieren, ein Überschriftselement, um das generierte Wort anzuzeigen, und eine Unterüberschrift, um die Bedeutung des Wortes zu präsentieren. Da ich aus einem Webentwicklungs-Hintergrund komme, glaube ich, dass UI-Elemente innerhalb von Containern angeordnet werden sollten. Also werden wir genau das tun.

Notwendige Bibliotheken importieren

Zuerst fügen wir die Importanweisungen hinzu. Wir müssen die anthropic-Bibliothek importieren, um unsere zufälligen Wörter zu generieren.

Definition der Funktion zur Wortgenerierung

In dieser Funktion erledigt das Claude-Modell von Anthropic die schwere Arbeit (Danke, Claude!). Unsere Verantwortung ist es sicherzustellen, dass Claude das exakt Format konsistent zurückgibt. Um dies zu erreichen, müssen wir Claude anweisen, das Format „streng einzuhalten“ und nach unserer ersten Aufforderung eine Beispielantwort bereitzustellen. Schließlich können wir Claude bitten, „denken Sie daran, nur gemäß dem Muster zu antworten.“ Die Funktion endet, indem sie Claudes Antwort zurückgibt.

Aktualisierung der Benutzeroberfläche

N als Nächstes werden wir die Benutzeroberfläche aktualisieren, indem wir einen Container mit mehreren darin enthaltenen Elementen hinzufügen: eine Überschrift, eine Unterüberschrift zur Anzeige des zufälligen Wortes und ein Textelement für die Bedeutung des Wortes. Darüber hinaus werden wir einen Hinweis einfügen, wie die App zu verwenden ist, und darunter eine Schaltfläche.

In Streamlit können wir Klickereignis-Handler unter Verwendung von bedingten Anweisungen deklarieren, die wahr zurückgeben, wenn die Schaltfläche gedrückt wird. In diesem Szenario rufen wir die Funktion generate_word() auf, die das generierte Wort und die Bedeutung zurückgibt und die Ergebnisse in separate Variablen zur Klarheit aufteilt. Letztendlich werden die Unterüberschrift und das Textelement aktualisiert, um das Wort und die Bedeutung widerzuspiegeln.

Endform

Überprüfen wir unseren Code noch einmal! Er sollte die Importanweisungen, die Funktion zur Generierung des zufälligen Wortes und die aktualisierte UI mit Unterüberschrift und Textelementen sowie einer Schaltfläche, die das Wort durch Aufruf der Funktion generate_word() generiert, enthalten.

Testen der Funktion zur Wortgenerierung

Lassen Sie uns die App erneut mit demselben Befehl ausführen. Alternativ können wir die App auch erneut ausführen, indem wir das Menü oben rechts klicken und "Wiederholen" auswählen, falls wir sie zuvor ausgeführt haben.

Die aktualisierte Benutzeroberfläche sollte jetzt angezeigt werden.

Jetzt probieren wir es aus, indem wir auf die Schaltfläche Generieren klicken!

Eine der großartigen Funktionen von Streamlit ist die eingebaute Ladefunktionalität und Ladesymbole. Wir sollten das Symbol in der oberen rechten Ecke sehen, zusammen mit der Option, die Operation zu "stoppen". Nett, oder?

Nach ein paar Sekunden sollte das Ergebnis in der Benutzeroberfläche angezeigt werden. Perfekt! Beachten Sie, dass die App Claudes generierten Text korrekt in das Wort und die Bedeutung aufgeteilt hat. Wenn das Ergebnis jedoch nicht dem erwarteten Format entspricht, können wir einfach erneut auf die Schaltfläche Generieren klicken.

Der nächste Schritt besteht darin, die Sprachgenerierung in unseren Zufallswortgenerator zu integrieren. Neben der Demonstration, wie man eine Audiodatei mithilfe der von ElevenLabs bereitgestellten API generiert, wird dieser Schritt auch die Fähigkeiten des mehrsprachigen Modells von ElevenLabs demonstrieren.

Hinzufügen der Funktion zur Sprachgenerierung mit der ElevenLabs API

Wie zu erwarten, besteht der erste Schritt in diesem Abschnitt darin, weitere Importanweisungen hinzuzufügen! Wir werden Funktionen von ElevenLabs einfügen, die wir für die Sprachgenerierungsfunktion verwenden werden.

Definition der Funktion zur Sprachgenerierung

Als nächstes definieren wir die Funktion, die für die Sprachgenerierung verantwortlich ist. Dank der Einfachheit und Lesbarkeit von Python sowie der benutzerfreundlichen API von ElevenLabs können wir mit nur diesem Code Sprache generieren!

Die Funktion akzeptiert das zufällige Wort, das wir zur Generierung der Sprache verwenden werden. Wir werden außerdem speziell das Modell eleven_multilingual_v1 verwenden, das perfekt für unseren Zweck geeignet ist, die Aussprache von fremden und häufig falsch geschriebenen Wörtern zu demonstrieren! Wir werden für dieses Tutorial die Stimme "Bella" verwenden, eine der vorgefertigten Stimmen von ElevenLabs.

Audio-Player hinzufügen

Als Nächstes fügen wir einen Audio-Player hinzu, um die generierte Sprache abzuspielen. Direkt unter unserem neuesten Code erstellen wir eine Variable, um die generierte Sprache zu speichern, und spielen sie mit dem Audio-Player ab, der von der st.audio-Funktion von Streamlit bereitgestellt wird. An diesem Punkt sollte unsere App wie erwartet funktionieren und den Audio-Player nur anzeigen, wenn ein zufälliges Wort verfügbar ist, um gelesen zu werden.

Neugierig, wie es funktioniert? Ich auch! Lassen Sie uns die App jetzt testen!

Testen der Funktion zur Wortbuchstabierung

Wir können die App erneut mit streamlit run ausführen oder sie einfach wiederholen, wenn wir sie bereits ausgeführt haben. Sie sollte identisch aussehen wie dort, wo wir aufgehört haben. Lassen Sie uns jetzt ausprobieren, indem wir dieses Mal auf die Schaltfläche "Generieren" klicken!

Erstaunlich! Diesmal zeigt die App auch einen Audio-Player an! Lassen Sie uns versuchen, sie abzuspielen. Mit dem mehrsprachigen Modell sollte die generierte Sprache den Akzent und die Intonation des ursprünglichen Wortes widerspiegeln. Zum Beispiel sollte "entrepreneur" mit einem französischen Akzent ausgesprochen werden.

Fazit

In diesem kurzen Tutorial haben wir die aufregenden Möglichkeiten der Sprachgenerierungstechnologie von ElevenLabs erkundet. Mit dem mehrsprachigen Modell ist die Generierung von Ansprachen, die für nicht-englischsprachige Zuhörer konzipiert sind, eine nahtlose Erfahrung. In unserem Anwendungsfall benötigten wir das mehrsprachige Modell, um uns bei der Suche nach der richtigen Aussprache und Schreibweise von nicht-englischen Wörtern, die häufig falsch geschrieben werden, zu unterstützen.