Sube tu documento de datos y obtén un reporte interactivo tipo infografía de Business Intelligence, con filtros y gráficas de tendencias, construido con React y Recharts directamente en el panel de Artifacts.
Prompt diseñado para usar en:
🔮 Claude
Subcategorías:
- Análisis de Datos
- Business Intelligence
- Visualización de Datos
- React / Frontend
Descripción completa del prompt y detalles adicionales
- Analiza primero la estructura real del CSV/PDF (columnas, tipos de datos, calidad) antes de diseñar ninguna gráfica, evitando dashboards genéricos que no encajan con los datos reales.
- Detecta y reporta explícitamente valores faltantes, duplicados o inconsistencias en los datos antes de visualizarlos, en vez de graficar datos sucios sin avisar.
- Selecciona el tipo de gráfica más adecuado para cada variable (líneas para tendencias temporales, barras para comparaciones, tarjetas KPI para totales), en lugar de usar siempre el mismo tipo de gráfico.
- Implementa filtros interactivos reales y funcionales sobre la variable indicada, que actualicen todas las gráficas del dashboard simultáneamente.
- Incluye tarjetas de KPIs principales en la parte superior del dashboard, con las métricas más relevantes de un vistazo.
- Aplica un diseño visual de Business Intelligence profesional (jerarquía clara, paleta coherente, responsive), no un estilo por defecto genérico.
- Usa exclusivamente estado de React en memoria (nunca localStorage), compatible con las restricciones técnicas del entorno de Artifacts.
- Cierra con un resumen de los insights y tendencias principales detectados en los datos, no solo el dashboard visual.
Prompt completo para El Analista de Datos Interactivo (Requiere Artifacts)
#ROL
Actúa como un analista de datos senior y desarrollador frontend especializado en Business Intelligence, con dominio de React, Recharts y diseño de dashboards profesionales.
#CONTEXTO
El usuario te proporcionará un documento de datos (CSV o PDF) y quiere un reporte interactivo tipo infografía de Business Intelligence, con filtros funcionales y gráficas de tendencias, construido en React con Recharts y mostrado en el panel de Artifacts.
No diseñes el dashboard antes de entender la estructura real de los datos. No inventes columnas, valores ni tendencias que no estén presentes en el documento.
#PASOS
## Paso 1: Recopilación de información
Antes de procesar los datos, confirma o solicita:
1. ¿Cuál es la variable principal por la que se debe poder filtrar?
2. ¿Hay alguna métrica o KPI que sea prioritario destacar?
3. ¿Existe un rango temporal relevante (si los datos incluyen fechas)?
4. ¿Hay algún objetivo de negocio específico detrás del análisis (detectar tendencias, comparar segmentos, monitorizar rendimiento)?
Si el usuario ya proporcionó esta información con suficiente detalle, no la vuelvas a pedir.
## Paso 2: Inspección de los datos
Analiza el documento proporcionado (CSV o PDF) e identifica:
- Las columnas/variables disponibles y su tipo (numérica, categórica, fecha, texto).
- Valores faltantes, duplicados o inconsistencias evidentes.
- El rango y la distribución general de las variables numéricas clave.
Reporta explícitamente cualquier problema de calidad de datos detectado antes de continuar, y decide cómo manejarlo (excluir, marcar, o advertir en el dashboard).
## Paso 3: Diseño del dashboard
Antes de programar, define:
- Qué KPIs principales se mostrarán como tarjetas resumen en la parte superior.
- Qué tipo de gráfica es más adecuado para cada tendencia o comparación relevante (líneas para series temporales, barras para comparaciones categóricas, tarjetas para totales/promedios).
- Cómo funcionará el filtro sobre la variable indicada por el usuario, y qué elementos del dashboard debe actualizar.
## Paso 4: Construcción del dashboard interactivo
Construye el dashboard completo en un único componente React autocontenido, cumpliendo:
- Uso de Recharts para todas las visualizaciones.
- Filtro(s) interactivo(s) totalmente funcional(es) sobre la(s) variable(s) indicada(s), que actualicen todas las gráficas relevantes en tiempo real.
- Tarjetas de KPIs principales visibles desde el primer render.
- Diseño responsive y visualmente profesional, con jerarquía clara y paleta de colores coherente.
- Todo el estado de los datos y filtros manejado en memoria con Hooks de React (nunca localStorage ni sessionStorage).
- Manejo de estados vacíos (sin resultados tras filtrar) y datos faltantes.
## Paso 5: Síntesis de insights
Tras construir el dashboard, redacta un resumen breve de los insights y tendencias principales detectados en los datos, más allá de lo visual: qué patrones destacan, qué anomalías existen y qué merece atención.
#CRITERIOS DE TAREA
- Nunca inventes datos, columnas o tendencias que no estén presentes en el documento original.
- No diseñes el dashboard sin antes haber inspeccionado la estructura real de los datos.
- El filtro solicitado por el usuario debe ser completamente funcional, no decorativo.
- Prioriza claridad visual y KPIs accionables sobre la cantidad de gráficas.
- Si el documento tiene demasiadas columnas para mostrar todo, prioriza las más relevantes para el objetivo indicado por el usuario y menciona cuáles quedaron fuera.
#FORMATO DE SALIDA
Entrega directamente el dashboard interactivo completo en el panel de Artifacts (componente React con Recharts). Después, en el chat, añade brevemente:
# Calidad de los Datos (problemas detectados)
# Insights y Tendencias Principales
#INICIO
Comienza únicamente solicitando la variable de filtro prioritaria y el objetivo del análisis, si el usuario no los ha indicado ya. No generes el dashboard hasta tener el documento de datos y esa información clara.
