Full-Stack y UI/UX · IA y agentes · Marketing con IA y analítica
ImprovTalk: coach de IA en React Native para carisma y rapport
Por David Gadyan · Publicado el · Actualizado el
ImprovTalk es una app móvil voice-first para desarrollar carisma, comunicación y rapport. Eliges una escena real, mantienes pulsado un botón y hablas en voz alta con un personaje de IA en directo; al terminar recibes un Charisma Score con feedback línea a línea sobre lo que dijiste y cómo sonaste. La diseñé y construí de principio a fin: sistema de diseño y UX, front end en React Native, back end en FastAPI, voz en tiempo real, el paywall de tres planes y los anuncios en vídeo con IA generativa que la promocionan.
El problema
El carisma es un conjunto de conductas entrenables, escuchar y construir sobre lo que dijo la otra persona, y las conversaciones reales no tienen guion. La única práctica honesta es en voz alta, sin ensayar y con feedback, y para eso existe ImprovTalk. Antes había que resolver dos problemas de producto. Practice, Simulate, Learn, History y Custom Practice se habían acumulado como funciones separadas, cuando lo que la gente quiere es un solo camino: configurar, hablar, recibir una puntuación, revisar y ver el progreso. Y el lenguaje visual se había desviado: un tema azul marino, seis colores de sistema de iOS en las fichas de inicio, rojos escritos a mano y un degradado de marca en cada botón, sin nada que decidiera entre ellos.
Qué construí
- Escenas y personajes en directo. Eliges una escena real, una cafetería, un bar, la playa, un gimnasio, un festival, el campus o la calle, mantienes pulsado un botón y hablas. El personaje de IA responde en voz alta y en tiempo real sobre OpenAI real-time voice y WebRTC; no se escribe nada.
- Charisma Score con feedback línea a línea. Al terminar la conversación ves qué funcionó, qué mejorar y cómo sonaste: ritmo, pausas, entonación y muletillas, medidos desde tu propia voz y no estimados. La puntuación pondera fluidez, confianza e improvisación.
- Simulate. Escenarios de varias rondas contra distintas mezclas de personalidad, con un veredicto tras cada intento.
- Learn y Custom Practice. 104 técnicas y 27 catálogos de temas de conversación; Custom Practice crea un personaje a partir de una descripción o de un perfil público de Instagram.
- Real Talk. Sube una grabación o describe una conversación que tuviste y recibe una nota de 0 a 100, la transcripción y consejos sobre cómo abrir y qué hacer después.
- Planes e idiomas. Free, Pro y Max sobre Apple In-App Purchase y Stripe, en inglés, español y ruso.
La app en uso
Cuatro grabaciones de pantalla sin sonido, una por pantalla, con lo que estás viendo y por qué está construido así. Pulsa play en cualquier teléfono; no se descarga nada hasta que lo hagas.
1. Intro e inicio
La pantalla de arranque es el logotipo sobre una cafetería de noche y la frase «Practice. Win. Repeat.», y después Home. Arriba hay tres números, racha, Charisma Score y tasa de cierre, y debajo un aviso que pide iniciar sesión para practicar en directo y guardar el progreso. Luego las seis entradas: Simulate, Practice, Learn, Real Talk, Stats e History, Practice y Real Talk con una insignia de candado, y una barra de pestañas que repite las cuatro superficies que más se usan.
Por qué es así. Es la solución de «un solo recorrido» al problema de arriba: cada función arranca desde la misma pantalla y devuelve sus resultados a los mismos tres números, en lugar de vivir como una pestaña aparte con su propio aspecto.
2. Simulate y Practice: configurar una sesión
Primero Simulate, donde una IA ejecuta toda la aproximación y tú lees la transcripción puntuada y los veredictos del panel del coach, con la lista de escenas para elegir: Free Improv, Bar, Beach, Swimming Pool, Festival, Park, Campus, Gym, Zoo, Aquarium, Trail, Airport, Street, Date. Practice usa las mismas escenas para tus propias sesiones. Al abrir Bar aparecen sus situaciones como botones redondos: adivinar la bebida, un veredicto sincero sobre la bebida de la casa, preguntar qué está bebiendo, salir con su amiga. Eliges una y la pantalla de configuración te dice con quién hablas y cuál es la situación, y después una fila por ajuste: idioma, disposición, ánimo, país, región, guardia, amigos celosos y la mezcla de personalidad, rojo, azul, amarillo y verde al 25 % cada uno, que siempre suma 100. Un solo botón la cierra: Start talking.
Por qué es así. Cada ajuste es una sola línea con su valor a la derecha, de modo que una configuración completa se lee de arriba abajo en una pantalla y termina en un único botón. Ese botón es donde empieza el camino de la sesión: configuración, llamada de voz en directo, puntuación, historial.
3. Learn: Coach, Knowledge y Tricks
Learn se abre como tres grupos plegados con su recuento: Coach (3), Knowledge (18) y Tricks (14). Coach contiene Conversation Coach, Charisma Training y Daily Routine. Knowledge son los catálogos de temas de conversación: Relationship Terms, City Attractions, World Attractions, Tattoos, Amulets, Palm Reading, Coffee Reading, Gestures, Horoscope, Paintings, Sculptures, Movies y más; una insignia MAX marca los elementos que vienen con el plan Max. El clip termina abriendo City Attractions.
Por qué es así. Las técnicas y los catálogos de la lista de arriba son de lo que se nutre una sesión, así que están a un toque de Home bajo un único encabezado, agrupados y contados, en vez de repartidos como funciones sueltas.
4. World Attractions y Stats
World Attractions empieza en un mapa del mundo con un buscador de país y ciudad, hace zoom en España, muestra sus ciudades como marcadores y abre Barcelona: una fila de ciudades y una lista «Top 10 · Autumn», Plaça de Catalunya, castillo de Montjuïc, Parc del Mirador del Poble-sec, parque de la Ciutadella, Park Güell, Rambla de Mar, cada uno con su tipo, la probabilidad de conocer a alguien y lo concurrido que está. El castillo de Montjuïc tiene después su propia página: fotos, una descripción de una línea, probabilidad de conocer a alguien, afluencia, por qué va la gente, a quién encontrarás y la mejor hora, y «tres maneras de empezar», tres frases de apertura etiquetadas según con quién hablas, un viajero, alguien local o cualquiera, como preguntar adónde se teletransportaría la persona de entre todo lo que se ve desde ahí arriba. El clip termina en Stats: pestañas Practice, Real y Analyze, un rango de tiempo, la clasificación, un consejo de redacción, sesiones, media y mejor, la tendencia frente al periodo anterior, las tasas de «conseguir el número» y «algún contacto», y la gráfica de tendencia de la puntuación por día, semana o mes.
Por qué es así. El catálogo no se queda en los datos: cada lugar termina con algo que decir allí, que es el sentido de la app. Stats es el paso de «revisar y ver el progreso» del recorrido, donde los números que resume Home tienen su historial.
Un sistema de diseño que el build hace cumplir
- Un solo recorrido. Cuatro superficies, Home, Practice, Learn e History, y un único camino de sesión: configuración, llamada de voz en directo, puntuación, historial.
- Una paleta de la que no se puede salir. Los cinco colores de marca más los cuatro que necesita una app, un acento y cuatro colores de datos, Satoshi y un subconjunto de Material Symbols de 30 KB para que la app dibuje exactamente los glifos con los que se dibujaron las maquetas. Una comprobación en CI hace fallar el build ante cualquier color literal fuera del archivo de tokens.
- Tres versiones, una decisión. Violeta plano; violeta con el degradado conservado en dos sitios; violeta más un color de señal. Las mismas pantallas cada vez, de modo que la elección fue entre sistemas y no entre estéticas. El degradado vive ahora solo en Hold-to-speak y en la intro, lo que lo convierte en la firma y no en un estilo de botón.
- Un solo elemento flexible. En la pantalla en directo solo el retrato se estira y todo lo que queda debajo tiene altura fija, así que los controles nunca salen de la pantalla en ningún teléfono.
- Movimiento como feedback. Respuesta al pulsar con hápticos, un disco que respira al mantener pulsado, una puntuación que cuenta y entradas escalonadas, todo desactivado con Reducir movimiento.
Cómo se entregó
React Native con Expo sobre la New Architecture para iOS y Android; FastAPI con Postgres y Redis detrás; OpenAI real-time voice sobre WebRTC para el personaje en directo; un lector de perfiles basado en Playwright para Custom Practice; Apple In-App Purchase y Stripe para los planes; Prometheus y Grafana para la monitorización. Las grabaciones de voz se usan solo para puntuar las sesiones, y la app no accede a contactos, fotos ni ubicación y no muestra anuncios.
Marketing: anuncios en vídeo con IA generativa
La misma caja de herramientas promociona la app. Un pipeline sobre la API de Higgsfield, con Claude dirigiendo los prompts y la dirección creativa para cada segmento de cliente y cada plataforma, produce variantes adaptadas a Instagram, Meta, TikTok y YouTube a partir de un solo brief. El mismo brief se pasó por Seedance y por Kling 2.6 Pro para que la diferencia sea visible antes de que una campaña se comprometa con un modelo; ambos resultados están abajo y el código del pipeline está en GitHub.
Seedance:
Kling 2.6 Pro:
Resultado
Una interfaz coherente y basada en tokens para iOS y Android con tema claro y oscuro, un paywall de tres planes y una pantalla de sesión que cabe en cualquier teléfono. La app está en TestFlight con el lanzamiento en App Store en curso, y sus anuncios se generan en lugar de producirse a mano.
Proyectos relacionados
HubAIOps: auditoría de preparación para IA en HubSpot con Claude
IA y agentes · ERP y SaaS con IA · Full-Stack y UI/UX
Receptra: SaaS de recepcionista de voz con IA para pymes
IA y agentes · ERP y SaaS con IA · Full-Stack y UI/UX
AI Trading Assistant: un copiloto fiel a tu propia estrategia
IA y agentes · Finanzas y quant · Full-Stack y UI/UX