GM
Giancarlo Mena

Default Component - Copy this React, Tailwind Component to your project

Crea un componente de "Asistente de voz" que permita a los usuarios interactuar con sus finanzas mediante comandos de voz, manteniendo una experiencia visual coherente con el resto de la aplicación: **Interfaz Visual:** Muestra un botón prominente y grande con un ícono de micrófono. El botón debe resaltar visualmente al pasar el cursor o al ser pulsado (por ejemplo, con animaciones o cambios de color). La interfaz debe ser moderna y minimalista, utilizando colores vivos y elementos gráficos consistentes con el diseño general. **Funcionalidad del Asistente:** Al mantener pulsado el botón, el usuario inicia la grabación de voz. La grabación se transcribe en tiempo real utilizando una API de inteligencia artificial (por ejemplo, OpenAI, Anthropic, etc.). El sistema analiza el texto transcrito para identificar comandos y consultas relacionados con transacciones financieras. El asistente se conecta a la base de datos de transacciones para extraer y procesar la información requerida (por ejemplo, consultas sobre gastos, ingresos, últimas transacciones, etc.). Proporciona respuestas claras y visuales, utilizando tarjetas informativas o gráficos cuando sea necesario. **Requerimientos de UX/UI:** Asegura una respuesta visual inmediata al iniciar y finalizar la grabación (feedback de estado). El diseño debe ser responsivo y accesible, adaptándose a dispositivos móviles y de escritorio. Integra animaciones sutiles para mejorar la interacción sin distraer al usuario. Mantén la coherencia en tipografía, espaciado y estilo visual con el resto de la aplicación.

Prompt
Component Preview

About

DefaultComponent - Voice assistant with a prominent mic button, real-time transcription, visual feedback, responsive design, built with. Start coding now!

Share

Last updated 1 month ago