Tutorial de ElevenLabs: Creando una Aplicación Simple de Ortografía de Palabras Usando Síntesis de Voz

Introducción

Hoy en día es uno de los momentos más emocionantes para el desarrollo de software, con la aparición de varias herramientas de "IA generativa" en el mercado. Solo nómbralo: ¿generación de cartas de presentación? ¡Comprobado! ¿Generación de correos electrónicos? ¡Comprobado! ¿Generación automática de comentarios de código? ¡Comprobado! Incluso fuera de la codificación y el desarrollo de software, las posibilidades de casos de uso son enormes. Ahora podemos generar imágenes con indicaciones de texto utilizando varios modelos de generación de imágenes. Esta innovación nos permite incorporar activos generados en nuestros diversos productos. La siguiente pregunta es, ¿qué hay de las voces? La tendencia de las experiencias de usuario en los últimos años ha enfatizado el "comando de voz" como una tendencia emergente. Es natural que el software que construimos incorpore voces como una de las funciones. En este tutorial, mostraremos la función "Síntesis de Voz" ofrecida por ElevenLabs en una aplicación simple que genera palabras aleatorias y las hace deletrear. Para construir la interfaz de usuario de esta aplicación basada en Python, utilizaremos Streamlit, una nueva biblioteca de interfaz de usuario para compartir proyectos de ciencia de datos.

Introducción a ElevenLabs

ElevenLabs es una empresa de investigación en tecnología de voz que ofrece una solución de síntesis de voz. Con una API fácil de usar, permite a los desarrolladores generar habla de alta calidad utilizando IA. Esto es posible gracias a un modelo de IA que ha sido entrenado con una gran cantidad de audiolibros y pódcast. El entrenamiento permite a la IA ofrecer resultados predecibles y de alta calidad en la generación de voz. ElevenLabs presenta dos capacidades principales: VoiceLab, donde los usuarios pueden clonar voces a partir de audio grabado y/o voces predefinidas existentes, y diseñar voces basadas en género, edades, etnias y razas. Una vez que los usuarios tienen las voces con las que trabajar, pueden proceder a la Síntesis de Voz, que les permite generar discursos utilizando sus voces diseñadas o voces predefinidas.

Introducción al Modelo Claude de Anthropic

Claude es el último modelo de IA desarrollado por Anthropic, una organización de investigación en IA centrada en mejorar la interoperabilidad, robustez y seguridad de los sistemas de inteligencia artificial. El modelo Claude está diseñado para generar respuestas similares a las humanas, lo que lo convierte en una herramienta poderosa para diversas aplicaciones, incluida la creación de contenido, legal y atención al cliente. A diferencia de otros modelos de IA, Claude enfatiza la seguridad, lo que le permite rechazar salidas que considera dañinas o no veraces para los usuarios.

Introducción a Streamlit

Streamlit es una biblioteca de Python de código abierto que simplifica la creación y el intercambio de aplicaciones web visualmente atractivas y personalizadas para desarrolladores y científicos de datos. Streamlit permite a los usuarios construir y desplegar aplicaciones de ciencia de datos completamente funcionales en minutos a través de su API sencilla e intuitiva, convirtiendo guiones de datos en componentes de UI.

Requisitos Previos

• Conocimientos básicos de Python y desarrollo de interfaces de usuario utilizando Streamlit
• Acceso a la API de Anthropic
• Acceso a la API de ElevenLabs

Esquema

1. Inicializando nuestro Proyecto de Streamlit
2. Agregando la Función de Generación de Palabras usando el Modelo Claude
3. Agregando la Función de Generación de Voz usando la API de ElevenLabs
4. Probando la Aplicación Generadora de Palabras

Discusión

En este tutorial, navegaremos por cuatro pasos esenciales. Primero, necesitamos inicializar el proyecto basado en Streamlit para familiarizarnos con el desarrollo de interfaces de usuario utilizando Streamlit. A continuación, añadiremos más funciones, comenzando con la ingeniería de un aviso para que el modelo de Claude nos proporcione una palabra aleatoria que comúnmente se escribe mal. Luego, incorporaremos la generación de texto a voz proporcionada por ElevenLabs para demostrar cómo el modelo multilingüe pronuncia las palabras. Por último, probaremos la aplicación simple.

Inicializando nuestro Proyecto de Streamlit

¡Entramos en acción con la codificación! Primero, crea un directorio para nuestro proyecto y entra en él. Este directorio servirá como la base de nuestro proyecto de Streamlit. Dado que un proyecto de Streamlit comprende esencialmente un proyecto de Python, necesitamos realizar varios pasos para inicializar nuestro proyecto de Python, como definir y activar nuestro entorno virtual.

Una vez activado, la salida de nuestra terminal debería mostrar el nombre del entorno virtual (env), así:

...

A continuación, ¡es hora de instalar las bibliotecas necesarias para este proyecto! Usaremos el comando pip para instalar las bibliotecas Streamlit, anthropic y elevenlabs. Ten en cuenta que también instalaremos una biblioteca Pydantic con versión bloqueada para prevenir errores relacionados con Pydantic en una de las funciones de ElevenLabs.

Con todos los requisitos del proyecto configurados, ahora podemos sumergirnos en la parte de codificación. Crea un nuevo archivo dentro de nuestro directorio de proyecto y nómbralo randomwords_app.py.

Después de crear el archivo, ábrelo en tu editor de código o entorno de desarrollo integrado (IDE) preferido. Para comenzar, construiremos la aplicación simple a partir de los componentes más simples: ¡un título y un texto de subtítulo!

Para concluir nuestra inicialización del proyecto, intentemos ejecutar la aplicación. Asegúrate de que nuestro directorio de trabajo actual esté aún dentro del proyecto y que nuestro entorno virtual esté activado. Una vez que todo esté listo, usa el comando streamlit run para ejecutar la aplicación.

La aplicación debería abrirse automáticamente en nuestro navegador predeterminado, mostrando el título y el texto por ahora. A continuación, añadiremos la función de generación de palabras aleatorias utilizando el modelo Claude de Anthropic.

Una última consideración: necesitamos proporcionar a nuestra aplicación las claves API para los servicios que pretendemos usar, específicamente el modelo Claude de Anthropic y la función de Síntesis de Voz de ElevenLabs. Dado que estas claves se consideran sensibles, debemos mantenerlas en un lugar seguro y aislado. Sin embargo, esta vez no las almacenaremos en un archivo .env. Esto se debe a que Streamlit maneja las variables de entorno de manera diferente. Según la documentación, necesitamos crear un archivo de configuración secreto dentro de un directorio .streamlit. Podemos crear el directorio en nuestro proyecto y luego crear el archivo.

Luego editaremos el archivo TOML que creamos, notando que el archivo TOML utiliza un formato diferente al de un archivo .env tradicional.

Agregando la Función de Generación de Palabras usando el Modelo Claude

En este paso, agregaremos un botón para generar la palabra aleatoria, un elemento de encabezado para mostrar la palabra generada, y un subtítulo para presentar el significado de la palabra. Sin embargo, viniendo de un background de desarrollo web, creo que los elementos de la interfaz de usuario deberían organizarse dentro de contenedores. Así que, haremos precisamente eso.

Importar Bibliotecas Necesarias

Primero, agreguemos las declaraciones de importación. Necesitamos importar la biblioteca anthropic para generar nuestras palabras aleatorias.

Definición de la Función de Generación de Palabras

En esta función, el modelo Claude de Anthropic realiza el trabajo pesado (¡Gracias, Claude!). Nuestra responsabilidad es asegurarnos de que Claude devuelva el formato exacto de manera consistente. Para lograr esto, necesitamos indicarle a Claude que "siga estrictamente el formato" y proporcionar un ejemplo de respuesta después de nuestro aviso inicial. Finalmente, podemos pedirle a Claude que "recuerde responder solo siguiendo el patrón." La función concluye devolviendo la respuesta de Claude.

Actualización de la Interfaz de Usuario

A continuación, editaremos la interfaz de usuario añadiendo un contenedor con varios elementos dentro de él: un encabezado, un subtítulo para mostrar la palabra aleatoria, y un elemento de texto para el significado de la palabra. Además, incluiremos una pista sobre cómo usar la aplicación y un botón debajo de ella.

En Streamlit, podemos declarar manejadores de eventos de clic utilizando declaraciones condicionales que devuelven verdadero cuando se hace clic en el botón. En este escenario, invocamos la función generate_word() que devuelve la palabra generada y el significado, dividiendo los resultados en variables separadas para mayor claridad. En última instancia, el subtítulo y el elemento de texto se actualizarán para reflejar la palabra y el significado.

Forma Final

¡Verifiquemos nuestro código! Debería contener las declaraciones de importación, la función para generar la palabra aleatoria y la interfaz de usuario actualizada con subtítulo y elementos de texto, así como un botón que genera la palabra al invocar la función generate_word().

Probando la Función de Generación de Palabras

Ejecutemos la aplicación nuevamente con el mismo comando. Alternativamente, podemos volver a ejecutar la aplicación haciendo clic en el menú de la parte superior derecha y seleccionando "Reejecutar" si la estuvimos ejecutando previamente.

La interfaz de usuario actualizada debería aparecer ahora.

¡Ahora, intentemos hacer clic en el botón Generar!

Una de las grandes características de Streamlit es su funcionalidad de carga integrada e indicadores de carga. Deberíamos ver el indicador en la esquina superior derecha, junto con la opción de "detener" la operación. ¿Genial, verdad?

Después de unos segundos, el resultado debería mostrarse en la UI. ¡Perfecto! Observa que la aplicación divide correctamente el texto generado por Claude en la palabra y el significado. Sin embargo, si el resultado no se adhiere al formato esperado, siempre podemos hacer clic nuevamente en el botón Generar.

El siguiente paso es incorporar la generación de voz en nuestro generador de palabras aleatorias. Además de demostrar cómo generar un archivo de audio utilizando la API proporcionada por ElevenLabs, este paso también mostrará las capacidades del modelo multilingüe de ElevenLabs.

Agregando la Función de Generación de Voz usando la API de ElevenLabs

Como era de esperar, el primer paso en esta sección es añadir más declaraciones de importación. Incluirá funciones de ElevenLabs que utilizaremos para la función de generación de voz.

Definiendo la Función de Generación de Voz

A continuación, definiremos la función responsable de la generación de voz. Gracias a la simplicidad y legibilidad de Python, junto con la API fácil de usar de ElevenLabs, ¡podemos generar voz con solo este código!

La función acepta la palabra aleatoria que utilizaremos para generar la voz. También utilizaremos específicamente el modelo eleven_multilingual_v1, que es perfecto para nuestro propósito de demostrar la pronunciación de palabras extranjeras y comúnmente mal escritas. Utilizaremos la voz "Bella" para este tutorial, una de las voces predefinidas proporcionadas por ElevenLabs.

Agregando un Reproductor de Audio

A continuación, añadiremos un reproductor de audio para reproducir la voz generada. Justo debajo de nuestro código más reciente, crearemos una variable para almacenar la voz generada y la ejecutaremos usando el reproductor de audio proporcionado por la función st.audio de Streamlit. En este punto, nuestra aplicación debe funcionar como se esperaba, mostrando solo el reproductor de audio cuando hay una palabra aleatoria disponible para leer.

¿Tienes curiosidad por saber cómo funciona? ¡Yo también! ¡Probemos la aplicación ahora!

Probando la Función de Deletreo de Palabras

Podemos ejecutar la aplicación nuevamente usando streamlit run o simplemente volver a ejecutarla si ya la tenemos funcionando. Debería verse idéntica a donde la dejamos. ¡Ahora intentemos hacer clic en el botón "Generar" esta vez!

¡Increíble! Esta vez, la aplicación también muestra un reproductor de audio. ¡Intentemos reproducirlo! Usando el modelo multilingüe, la voz generada debería reflejar el acento y la entonación relevantes al idioma original de la palabra. Por ejemplo, "entrepreneur" debería pronunciarse con un acento francés.

Conclusión

En este breve tutorial, hemos explorado las emocionantes capacidades de la tecnología de generación de voz ofrecida por ElevenLabs. Con el modelo multilingüe, generar discursos diseñados para oyentes que no hablan inglés es una experiencia fluida. En nuestro caso, necesitábamos el modelo multilingüe para ayudarnos a encontrar la manera correcta de pronunciar y escribir palabras que no son en inglés y que comúnmente se escriben mal.