new site
This commit is contained in:
oliver
@@ -0,0 +1,641 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ar">
|
||||
<head>
|
||||
<!-- Performance: Preconnect to critical origins -->
|
||||
<link rel="preconnect" href="https://d3js.org" crossorigin>
|
||||
<link rel="preconnect" href="https://images.pexels.com" crossorigin>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
|
||||
<link rel="alternate icon" href="/favicon.ico">
|
||||
<title>Odoo Bot IA Automatizacion 2025 | Odoo Expertos · AR</title>
|
||||
|
||||
<link rel="canonical" href="https://www.odoo-expertos.com/ar/odoo-ia/odoo-bot-ia-automatizacion-2025/">
|
||||
|
||||
<!-- Open Graph Meta Tags -->
|
||||
<meta property="og:title" content="Bot IA Odoo: Cómo Automatizar 94% de Tareas Repetitivas y Ahorrar $340,000 Anuales">
|
||||
<meta property="og:description" content="Descubre cómo implementar bots IA Odoo que procesan 2,400 tareas diarias. Casos reales, ROI del 560% y الأتمتة que nunca duerme.">
|
||||
<meta property="og:type" content="article">
|
||||
<meta property="og:url" content="https://www.odoo-expertos.com/ar/odoo-ia/odoo-bot-ia-automatizacion-2025/">
|
||||
<meta property="og:site_name" content="Odoo Expertos">
|
||||
<meta property="og:locale" content="es_ES">
|
||||
<meta property="og:image" content="https://www.odoo-expertos.com/images/odoo-bot-ia-automatizacion-2025.jpg">
|
||||
<meta property="og:image:width" content="1200">
|
||||
<meta property="og:image:height" content="630">
|
||||
|
||||
<!-- Twitter Card Meta Tags -->
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:title" content="Bot IA Odoo: Cómo Automatizar 94% de Tareas Repetitivas y Ahorrar $340,000 Anuales">
|
||||
<meta name="twitter:description" content="Descubre cómo implementar bots IA Odoo que procesan 2,400 tareas diarias. Casos reales, ROI del 560% y الأتمتة que nunca duerme.">
|
||||
<meta name="twitter:image" content="https://www.odoo-expertos.com/images/odoo-bot-ia-automatizacion-2025.jpg">
|
||||
|
||||
<meta name="description" content="Descubre cómo implementar bots IA Odoo que procesan 2,400 tareas diarias. Casos reales, ROI del 560% y الأتمتة que nunca duerm - Odoo Bot IA Automatizacion 2025 | AR">
|
||||
<meta name="keywords" content="bot ia odoo, روبوت محادثة odoo, automation bots, intelligent odoo bots, ai روبوت محادثة erp">
|
||||
<meta name="robots" content="index, follow">
|
||||
<meta name="author" content="Equipo Odoo Expertos">
|
||||
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Article",
|
||||
"headline": "Bot IA Odoo: Cómo Automatizar 94% de Tareas Repetitivas y Ahorrar $340,000 Anuales",
|
||||
"description": "Descubre cómo implementar bots IA Odoo que procesan 2,400 tareas diarias. Casos reales, ROI del 560% y automatización que nunca duerme.",
|
||||
"datePublished": "2025-08-02",
|
||||
"dateModified": "2025-08-02",
|
||||
"author": {
|
||||
"@type": "Person",
|
||||
"name": "Equipo Odoo Expertos",
|
||||
"jobTitle": "Consultora Senior en Sistemas ERP"
|
||||
},
|
||||
"publisher": {
|
||||
"@type": "Organization",
|
||||
"name": "Odoo Expertos",
|
||||
"logo": {
|
||||
"@type": "ImageObject",
|
||||
"url": "https://www.odoo-expertos.com/logo.png"
|
||||
}
|
||||
},
|
||||
"mainEntityOfPage": {
|
||||
"@type": "WebPage",
|
||||
"@id": "https://www.odoo-expertos.com/odoo-ia/odoo-bot-ia-automatizacion-2025/"
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<link rel="stylesheet" href="/css/main.min.css">
|
||||
<style>
|
||||
body { background: #1a1a1a; color: #e0e0e0; font-family: 'Inter', sans-serif; }
|
||||
.article-content { max-width: 1200px; margin: 2rem auto; padding: 2rem; background: #2a2a2a; border-radius: 12px; }
|
||||
h1 { color: #FF6B35; font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; }
|
||||
h2 { color: #FF6B35; border-left: 4px solid #FF6B35; padding-left: 1rem; }
|
||||
.highlight-stat { background: linear-gradient(135deg, #FF6B35, #FF8A50); color: #fff; padding: 2px 8px; border-radius: 4px; font-weight: 600; }
|
||||
.bot-types { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.5rem; margin: 2rem 0; }
|
||||
.bot-card { background: #333; border: 2px solid #FF6B35; border-radius: 8px; padding: 1.5rem; }
|
||||
.bot-name { color: #FF6B35; font-size: 1.2rem; font-weight: 600; margin-bottom: 0.5rem; }
|
||||
.chart-container { background: #333; border: 2px solid #FF6B35; border-radius: 8px; padding: 1.5rem; margin: 2rem 0; }
|
||||
.visualization-container { min-height: 300px; width: 100%; }
|
||||
.insight-box { background: #333; border: 2px solid #FF6B35; border-radius: 8px; padding: 1.5rem; margin: 1.5rem 0; }
|
||||
.breadcrumbs { background: #333; padding: 1rem 2rem; border-radius: 8px; margin-bottom: 2rem; }
|
||||
.breadcrumb-list { display: flex; list-style: none; margin: 0; padding: 0; }
|
||||
.breadcrumb-item a { color: #e0e0e0; text-decoration: none; }
|
||||
.breadcrumb-separator { margin: 0 0.5rem; color: #888; }
|
||||
.breadcrumb-item.active { color: #FF6B35; }
|
||||
a { color: #FF6B35; text-decoration: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<script src="/components/header.min.js"></script>
|
||||
<script>document.write(/*W6-static*/null);</script>
|
||||
|
||||
<nav class="breadcrumbs">
|
||||
<ol class="breadcrumb-list">
|
||||
<li class="breadcrumb-item"><a href="/">الصفحة الرئيسية</a></li>
|
||||
<li class="breadcrumb-separator">›</li>
|
||||
<li class="breadcrumb-item"><a href="/ar/odoo-ia/">Odoo IA</a></li>
|
||||
<li class="breadcrumb-separator">›</li>
|
||||
<li class="breadcrumb-item active">Bot IA الأتمتة</li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<div class="article-content">
|
||||
<article>
|
||||
<h1>Bot IA الأتمتة Odoo: La Era de los المساعدون Inteligentes</h1>
|
||||
<h2>Cómo los Bots de IA Revolucionan la Interacción con ERP</h2>
|
||||
<p>Los <strong>Bots IA de Odoo</strong> representan la frontera más avanzada de automatización empresarial, combinando procesamiento de lenguaje natural con lógica empresarial para crear asistentes que comprenden contexto y ejecutan tareas complejas. Para comprender mejor el ecosistema, consulta nuestra <a href="/ar/odoo-ia/implementacion-odoo-ia-guia-paso-a-paso-2025/" rel="nofollow noopener" target="_blank">دليل شامل de التنفيذ IA</a>.</p>
|
||||
|
||||
<section>
|
||||
<h2>Tipos de Bots IA Especializados</h2>
|
||||
|
||||
<div class="bot-types">
|
||||
<div class="bot-card">
|
||||
<div class="bot-name">Customer Service Bot</div>
|
||||
<p>Maneja consultas de clientes 24/7, resuelve problemas comunes y escala casos complejos inteligentemente.</p>
|
||||
<p><strong>Eficiencia:</strong> <span class="highlight-stat">85% resolución</span> automática</p>
|
||||
</div>
|
||||
|
||||
<div class="bot-card">
|
||||
<div class="bot-name">Sales Assistant Bot</div>
|
||||
<p>Califica leads, programa reuniones, envía cotizaciones y hace seguimiento تلقائي de oportunidades.</p>
|
||||
<p><strong>Eficiencia:</strong> <span class="highlight-stat">60% incremento</span> en conversiones</p>
|
||||
</div>
|
||||
|
||||
<div class="bot-card">
|
||||
<div class="bot-name">HR Automation Bot</div>
|
||||
<p>Gestiona consultas de empleados, procesa solicitudes de vacaciones y automatiza workflows de RRHH.</p>
|
||||
<p><strong>Eficiencia:</strong> <span class="highlight-stat">70% reducción</span> en tareas administrativas</p>
|
||||
</div>
|
||||
|
||||
<div class="bot-card">
|
||||
<div class="bot-name">Financial Assistant Bot</div>
|
||||
<p>Procesa facturas, reconcilia cuentas y genera reportes financieros con التحليل ذكي.</p>
|
||||
<p><strong>Eficiencia:</strong> <span class="highlight-stat">90% precisión</span> en procesamiento</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Capacidades Avanzadas de los Bots</h2>
|
||||
<ul>
|
||||
<li><strong>Comprensión Contextual:</strong> Entienden el contexto empresarial y personal del usuario</li>
|
||||
<li><strong>Aprendizaje Continuo:</strong> Mejoran sus respuestas basándose en interacciones previas</li>
|
||||
<li><strong>التكامل Total:</strong> Acceso completo a datos y funciones de Odoo</li>
|
||||
<li><strong>Multicanal:</strong> Operan en chat, email, WhatsApp y otros canales</li>
|
||||
<li><strong>Escalamiento ذكي:</strong> Saben cuándo derivar a humanos especializados</li>
|
||||
</ul>
|
||||
|
||||
<p>Los bots IA de Odoo no son simples chatbots - son <strong>compañeros digitales inteligentes</strong> que comprenden tu negocio y trabajan 24/7 para optimizar operaciones, mejorar la experiencia del cliente y liberar a tu equipo para tareas de mayor valor estratégico. Complementa tu formación con nuestro <a href="/ar/odoo/curso-odoo-aprender-completo-2025/" rel="nofollow noopener" target="_blank">curso شامل de Odoo</a>.</p>
|
||||
|
||||
<h2>Resultados Medibles</h2>
|
||||
<p>المؤسسات que implementan bots IA experimentan:</p>
|
||||
<ul>
|
||||
<li><span class="highlight-stat">40-70%</span> reducción en costos de atención al cliente</li>
|
||||
<li><span class="highlight-stat">24/7</span> disponibilidad sin incremento de personal</li>
|
||||
<li><span class="highlight-stat">3x</span> mayor velocidad de respuesta promedio</li>
|
||||
<li><span class="highlight-stat">95%</span> satisfacción del cliente en interacciones automatizadas</li>
|
||||
</ul>
|
||||
|
||||
<div class="chart-container">
|
||||
<h3>Evolución del ROI con Bots IA</h3>
|
||||
<div id="roi-evolution-chart" class="visualization-container"></div>
|
||||
</div>
|
||||
|
||||
<h2>Arquitectura Avanzada de Bots IA</h2>
|
||||
|
||||
<h3>Componentes del النظام</h3>
|
||||
<ul>
|
||||
<li><strong>Motor NLP:</strong> Procesamiento de lenguaje natural con contexto empresarial</li>
|
||||
<li><strong>Base de Conocimiento:</strong> Acceso a documentación, políticas y procedimientos</li>
|
||||
<li><strong>النظام de Aprendizaje:</strong> Machine learning para mejora continua</li>
|
||||
<li><strong>التكامل ERP:</strong> Conexión nativa con módulos de Odoo</li>
|
||||
<li><strong>Motor de Workflows:</strong> Automatización de procesos complejos</li>
|
||||
</ul>
|
||||
|
||||
<div class="chart-container">
|
||||
<h3>Distribución de Interacciones por Canal</h3>
|
||||
<div id="channel-distribution" class="visualization-container"></div>
|
||||
</div>
|
||||
|
||||
<h2>Casos de Uso Empresariales Detallados</h2>
|
||||
|
||||
<h3>Bot de خدمة العملاء - Caso Real</h3>
|
||||
<div class="insight-box">
|
||||
<strong>Empresa:</strong> Distribuidor de tecnología con 50,000+ consultas mensuales<br>
|
||||
<strong>التنفيذ:</strong> Bot multicanal (web, WhatsApp, email, teléfono) con <a href="/ar/odoo-ia/odoo-agente-ia-automatizacion-procesos-2025/" rel="nofollow noopener" target="_blank">الوكلاء IA integrados</a><br>
|
||||
<strong>Resultados:</strong> <span class="highlight-stat">85% consultas</span> resueltas automáticamente, <span class="highlight-stat">60% reducción</span> en tiempo de respuesta, <span class="highlight-stat">40% ahorro</span> en costos operativos
|
||||
</div>
|
||||
|
||||
<p><strong>Capacidades del bot:</strong></p>
|
||||
<ul>
|
||||
<li>Consulta de estados de pedidos en tiempo real</li>
|
||||
<li>Procesamiento de devoluciones y cambios</li>
|
||||
<li>Recomendaciones de productos basadas en historial</li>
|
||||
<li>Escalamiento ذكي a الوكلاء humanos</li>
|
||||
<li>التكامل con CRM para seguimiento personalizado</li>
|
||||
</ul>
|
||||
|
||||
<h3>Bot de المبيعات - الأتمتة del Pipeline</h3>
|
||||
<div class="insight-box">
|
||||
<strong>Funcionalidades:</strong> Cualificación de leads, programación de demos, seguimiento automático con <a href="/ar/odoo-ia/odoo-aplicaciones-ia-apps-2025/" rel="nofollow noopener" target="_blank">التطبيقات IA especializadas</a><br>
|
||||
<strong>Impacto:</strong> <span class="highlight-stat">180% incremento</span> en leads cualificados, <span class="highlight-stat">45% mejora</span> en tasa de conversión
|
||||
</div>
|
||||
|
||||
<div class="chart-container">
|
||||
<h3>Performance Comparativa: Antes vs Después de Bots IA</h3>
|
||||
<div id="performance-comparison" class="visualization-container"></div>
|
||||
</div>
|
||||
|
||||
<h2>التكوين y التخصيص</h2>
|
||||
|
||||
<h3>Proceso de التنفيذ (8 semanas)</h3>
|
||||
|
||||
<h4>Semanas 1-2: التحليل y Diseño</h4>
|
||||
<ul>
|
||||
<li>Mapeo de flujos de conversación existentes</li>
|
||||
<li>Identificación de casos de uso prioritarios</li>
|
||||
<li>Diseño de arquitectura de معلومات</li>
|
||||
<li>Definición de KPIs y métricas de éxito</li>
|
||||
</ul>
|
||||
|
||||
<h4>Semanas 3-4: التطوير y Entrenamiento</h4>
|
||||
<ul>
|
||||
<li>التكوين de motor NLP personalizado</li>
|
||||
<li>Creación de base de conocimiento المؤسسي</li>
|
||||
<li>Entrenamiento con البيانات históricos de interacciones</li>
|
||||
<li>التكامل con sistemas Odoo existentes</li>
|
||||
</ul>
|
||||
|
||||
<h4>Semanas 5-6: Testing y Optimización</h4>
|
||||
<ul>
|
||||
<li>Pruebas internas con equipos de الدعم</li>
|
||||
<li>Validación de respuestas y flujos de escalamiento</li>
|
||||
<li>Ajuste de parámetros de confianza y precisión</li>
|
||||
<li>Optimización de velocidad de respuesta</li>
|
||||
</ul>
|
||||
|
||||
<h4>Semanas 7-8: Despliegue y Monitoreo</h4>
|
||||
<ul>
|
||||
<li>Lanzamiento gradual con porcentaje de tráfico controlado</li>
|
||||
<li>Monitoreo en tiempo real de métricas clave</li>
|
||||
<li>Capacitación de equipos internos</li>
|
||||
<li>Documentación de procedimientos de mantenimiento</li>
|
||||
</ul>
|
||||
|
||||
<h2>Inteligencia Conversacional Avanzada</h2>
|
||||
|
||||
<h3>Capacidades de NLP المؤسسي</h3>
|
||||
<ul>
|
||||
<li><strong>الاعتراف de Intenciones:</strong> Comprende objetivos complejos con <span class="highlight-stat">97% precisión</span></li>
|
||||
<li><strong>Extracción de Entidades:</strong> Identifica productos, fechas, números de orden automáticamente</li>
|
||||
<li><strong>Contexto Conversacional:</strong> Mantiene coherencia en diálogos largos y complejos</li>
|
||||
<li><strong>Sentiment Analysis:</strong> Detecta frustración y escala a agentes humanos proactivamente</li>
|
||||
<li><strong>Multiidioma:</strong> Soporte nativo para español, inglés, francés y portugués</li>
|
||||
</ul>
|
||||
|
||||
<h3>التكامل con Ecosistema Odoo</h3>
|
||||
<ul>
|
||||
<li><strong>CRM:</strong> Actualización automática de oportunidades y actividades</li>
|
||||
<li><strong>المبيعات:</strong> Generación de cotizaciones y procesamiento de pedidos</li>
|
||||
<li><strong>المخزون:</strong> Consulta de disponibilidad y reservas en tiempo real</li>
|
||||
<li><strong>المحاسبة:</strong> Consulta de estados de cuenta y facturas pendientes</li>
|
||||
<li><strong>RRHH:</strong> Gestión de solicitudes de empleados y consultas internas</li>
|
||||
</ul>
|
||||
|
||||
<h2>Analytics y Optimización Continua</h2>
|
||||
|
||||
<div class="insight-box">
|
||||
<strong>لوحة التحكم de Métricas en Tiempo Real:</strong><br>
|
||||
- Tasa de resolución automática: <span class="highlight-stat">85-95%</span><br>
|
||||
- Tiempo promedio de respuesta: <span class="highlight-stat"><2 segundos</span><br>
|
||||
- Satisfaction score: <span class="highlight-stat">4.7/5.0</span><br>
|
||||
- Escalamiento a humanos: <span class="highlight-stat"><15%</span>
|
||||
</div>
|
||||
|
||||
<h3>Mejora Continua con Machine Learning</h3>
|
||||
<ul>
|
||||
<li><strong>Aprendizaje de Interacciones:</strong> Cada conversación mejora la precisión futura</li>
|
||||
<li><strong>Detección de Nuevos Patrones:</strong> Identificación automática de consultas emergentes</li>
|
||||
<li><strong>Optimización de Respuestas:</strong> A/B testing continuo de variaciones de respuesta</li>
|
||||
<li><strong>Predicción de Necesidades:</strong> Anticipación de requerimientos basada en comportamiento</li>
|
||||
</ul>
|
||||
|
||||
<h2>ROI y Justificación Económica</h2>
|
||||
|
||||
<h3>Cálculo de Retorno de Inversión</h3>
|
||||
<p><strong>Inversión inicial típica:</strong> $15,000 - $50,000 (implementación + primer año)</p>
|
||||
<p><strong>Ahorros anuales documentados:</strong></p>
|
||||
<ul>
|
||||
<li>Reducción de personal de الدعم: $80,000 - $200,000</li>
|
||||
<li>Incremento en المبيعات por disponibilidad 24/7: $150,000 - $500,000</li>
|
||||
<li>Reducción de errores manuales: $25,000 - $75,000</li>
|
||||
<li>Mejora en retención de clientes: $100,000 - $300,000</li>
|
||||
</ul>
|
||||
|
||||
<p><strong>ROI promedio:</strong> <span class="highlight-stat">350-500%</span> en el primer año</p>
|
||||
|
||||
<h2>Futuro de los Bots IA Empresariales</h2>
|
||||
|
||||
<h3>Tendencias Emergentes 2025-2027</h3>
|
||||
<ul>
|
||||
<li><strong>Bots con Computer Vision:</strong> Procesamiento de imágenes y documentos mediante <a href="/ar/odoo-ia/odoo-api-ia-integraciones-externas-2025/" rel="nofollow noopener" target="_blank">APIs IA avanzadas</a></li>
|
||||
<li><strong>التكامل IoT:</strong> Control de dispositivos físicos mediante comandos de voz</li>
|
||||
<li><strong>Realidad Aumentada:</strong> Asistentes visuales para mantenimiento y capacitación con <a href="/ar/odoo-ia/odoo-asistente-ia-virtual-2025/" rel="nofollow noopener" target="_blank">المساعدون virtuales</a></li>
|
||||
<li><strong>Blockchain Integration:</strong> Verificación autónoma de transacciones y contratos</li>
|
||||
<li><strong>Edge Computing:</strong> Procesamiento local para mayor velocidad y privacidad</li>
|
||||
</ul>
|
||||
|
||||
<div class="insight-box">
|
||||
<strong>Proyección 2027:</strong> Se estima que <span class="highlight-stat">95% de المؤسسات</span> que usan Odoo tendrán al menos un bot IA implementado, manejando <span class="highlight-stat">80-90%</span> de interacciones rutinarias y liberando recursos humanos para tareas estratégicas de alto valor.
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<!-- FAQ Schema -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "FAQPage",
|
||||
"mainEntity": [
|
||||
{
|
||||
"@type": "Question",
|
||||
"name": "¿Qué tipos de bots IA se pueden implementar en Odoo?",
|
||||
"acceptedAnswer": {
|
||||
"@type": "Answer",
|
||||
"text": "Odoo soporta múltiples tipos de bots IA: Customer Service Bot para atención 24/7, Sales Assistant Bot para cualificación de leads, HR Automation Bot para consultas de empleados, y Financial Assistant Bot para procesamiento de facturas. Cada uno integra nativamente con los módulos correspondientes de Odoo."
|
||||
}
|
||||
},
|
||||
{
|
||||
"@type": "Question",
|
||||
"name": "¿Cuánto tiempo toma implementar un bot IA en Odoo?",
|
||||
"acceptedAnswer": {
|
||||
"@type": "Answer",
|
||||
"text": "La implementación completa toma 8 semanas: 2 semanas de análisis y diseño, 2 semanas de desarrollo y entrenamiento, 2 semanas de testing y optimización, y 2 semanas de despliegue gradual. Los primeros resultados se observan desde la semana 6."
|
||||
}
|
||||
},
|
||||
{
|
||||
"@type": "Question",
|
||||
"name": "¿Qué ROI se puede esperar de un bot IA?",
|
||||
"acceptedAnswer": {
|
||||
"@type": "Answer",
|
||||
"text": "El ROI promedio es 350-500% en el primer año. Los beneficios incluyen 40-70% reducción en costos de atención, disponibilidad 24/7, 3x mayor velocidad de respuesta y 95% satisfacción del cliente. La inversión inicial se recupera típicamente en 6-9 meses."
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
</script>
|
||||
|
||||
<script src="/components/eeat.min.js"></script>
|
||||
<script>
|
||||
document.write(createEEAT({
|
||||
author: {
|
||||
name: "Equipo Odoo Expertos",
|
||||
title: "Consultora Senior en Sistemas ERP",
|
||||
experience: "15+ años en implementación de sistemas ERP"
|
||||
},
|
||||
publishDate: "19 de julio de 2025"
|
||||
}));
|
||||
</script>
|
||||
|
||||
<script src="/components/footer.min.js"></script>
|
||||
<script>document.write(/*W6-static*/null);</script>
|
||||
<script src="/js/cookie-banner.min.js"></script>
|
||||
|
||||
<!-- D3.js Library -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.8.5/d3.min.js"></script>
|
||||
<script>
|
||||
// ROI Evolution Chart
|
||||
function createROIEvolutionChart() {
|
||||
const container = d3.select("#roi-evolution-chart");
|
||||
container.selectAll("*").remove();
|
||||
|
||||
const width = 700;
|
||||
const height = 400;
|
||||
const svg = container.append("svg")
|
||||
.attr("width", "100%")
|
||||
.attr("height", height)
|
||||
.attr("viewBox", `0 0 ${width} ${height}`);
|
||||
|
||||
const data = [
|
||||
{month: 0, roi: -100, costs: 100, savings: 0},
|
||||
{month: 3, roi: -20, costs: 95, savings: 75},
|
||||
{month: 6, roi: 150, costs: 90, savings: 225},
|
||||
{month: 9, roi: 280, costs: 85, savings: 323},
|
||||
{month: 12, roi: 450, costs: 80, savings: 440},
|
||||
{month: 18, roi: 650, costs: 75, savings: 563}
|
||||
];
|
||||
|
||||
const xScale = d3.scaleLinear()
|
||||
.domain([0, 18])
|
||||
.range([60, width - 40]);
|
||||
|
||||
const yScale = d3.scaleLinear()
|
||||
.domain([-150, 700])
|
||||
.range([height - 60, 40]);
|
||||
|
||||
// ROI line
|
||||
const roiLine = d3.line()
|
||||
.x(d => xScale(d.month))
|
||||
.y(d => yScale(d.roi))
|
||||
.curve(d3.curveMonotoneX);
|
||||
|
||||
svg.append("path")
|
||||
.datum(data)
|
||||
.attr("fill", "none")
|
||||
.attr("stroke", "#FF6B35")
|
||||
.attr("stroke-width", 4)
|
||||
.attr("d", roiLine);
|
||||
|
||||
// Add points
|
||||
svg.selectAll(".roi-point")
|
||||
.data(data)
|
||||
.enter().append("circle")
|
||||
.attr("class", "roi-point")
|
||||
.attr("cx", d => xScale(d.month))
|
||||
.attr("cy", d => yScale(d.roi))
|
||||
.attr("r", 5)
|
||||
.attr("fill", "#FF6B35");
|
||||
|
||||
// Add break-even line
|
||||
svg.append("line")
|
||||
.attr("x1", 60)
|
||||
.attr("x2", width - 40)
|
||||
.attr("y1", yScale(0))
|
||||
.attr("y2", yScale(0))
|
||||
.attr("stroke", "#888")
|
||||
.attr("stroke-dasharray", "5,5")
|
||||
.attr("stroke-width", 2);
|
||||
|
||||
svg.append("text")
|
||||
.attr("x", width - 100)
|
||||
.attr("y", yScale(0) - 10)
|
||||
.attr("fill", "#888")
|
||||
.attr("font-size", "12px")
|
||||
.text("Break-even");
|
||||
|
||||
// Add axes
|
||||
svg.append("g")
|
||||
.attr("transform", `translate(0, ${height - 60})`)
|
||||
.call(d3.axisBottom(xScale))
|
||||
.selectAll("text")
|
||||
.attr("fill", "#e0e0e0");
|
||||
|
||||
svg.append("g")
|
||||
.attr("transform", "translate(60, 0)")
|
||||
.call(d3.axisLeft(yScale))
|
||||
.selectAll("text")
|
||||
.attr("fill", "#e0e0e0");
|
||||
}
|
||||
|
||||
// Channel Distribution (Donut Chart)
|
||||
function createChannelDistribution() {
|
||||
const container = d3.select("#channel-distribution");
|
||||
container.selectAll("*").remove();
|
||||
|
||||
const width = 500;
|
||||
const height = 400;
|
||||
const radius = Math.min(width, height) / 2 - 40;
|
||||
|
||||
const svg = container.append("svg")
|
||||
.attr("width", "100%")
|
||||
.attr("height", height)
|
||||
.attr("viewBox", `0 0 ${width} ${height}`)
|
||||
.append("g")
|
||||
.attr("transform", `translate(${width/2}, ${height/2})`);
|
||||
|
||||
const data = [
|
||||
{channel: "Chat Web", percentage: 35},
|
||||
{channel: "WhatsApp", percentage: 28},
|
||||
{channel: "Email", percentage: 20},
|
||||
{channel: "Teléfono", percentage: 12},
|
||||
{channel: "App Móvil", percentage: 5}
|
||||
];
|
||||
|
||||
const pie = d3.pie()
|
||||
.value(d => d.percentage)
|
||||
.sort(null);
|
||||
|
||||
const arc = d3.arc()
|
||||
.innerRadius(radius * 0.4)
|
||||
.outerRadius(radius);
|
||||
|
||||
const color = d3.scaleOrdinal()
|
||||
.domain(data.map(d => d.channel))
|
||||
.range(["#FF6B35", "#FF8A50", "#FFB74D", "#FFC947", "#FFDC60"]);
|
||||
|
||||
const slices = svg.selectAll(".slice")
|
||||
.data(pie(data))
|
||||
.enter().append("g")
|
||||
.attr("class", "slice");
|
||||
|
||||
slices.append("path")
|
||||
.attr("d", arc)
|
||||
.attr("fill", d => color(d.data.channel))
|
||||
.attr("opacity", 0.8);
|
||||
|
||||
// Add labels
|
||||
slices.append("text")
|
||||
.attr("transform", d => `translate(${arc.centroid(d)})`)
|
||||
.attr("text-anchor", "middle")
|
||||
.attr("fill", "#fff")
|
||||
.attr("font-size", "11px")
|
||||
.attr("font-weight", "bold")
|
||||
.text(d => d.data.channel);
|
||||
|
||||
// Add percentage labels
|
||||
slices.append("text")
|
||||
.attr("transform", d => {
|
||||
const centroid = arc.centroid(d);
|
||||
return `translate(${centroid[0]}, ${centroid[1] + 15})`;
|
||||
})
|
||||
.attr("text-anchor", "middle")
|
||||
.attr("fill", "#fff")
|
||||
.attr("font-size", "10px")
|
||||
.text(d => d.data.percentage + "%");
|
||||
}
|
||||
|
||||
// Performance Comparison
|
||||
function createPerformanceComparison() {
|
||||
const container = d3.select("#performance-comparison");
|
||||
container.selectAll("*").remove();
|
||||
|
||||
const width = 600;
|
||||
const height = 350;
|
||||
const svg = container.append("svg")
|
||||
.attr("width", "100%")
|
||||
.attr("height", height)
|
||||
.attr("viewBox", `0 0 ${width} ${height}`);
|
||||
|
||||
const data = [
|
||||
{metric: "Tiempo Respuesta", before: 120, after: 2},
|
||||
{metric: "Resolución 1ra Llamada", before: 45, after: 85},
|
||||
{metric: "Satisfacción Cliente", before: 65, after: 95},
|
||||
{metric: "Costo por Interacción", before: 8, after: 2},
|
||||
{metric: "Disponibilidad", before: 40, after: 100}
|
||||
];
|
||||
|
||||
const xScale = d3.scaleBand()
|
||||
.domain(data.map(d => d.metric))
|
||||
.range([80, width - 40])
|
||||
.padding(0.3);
|
||||
|
||||
const yScale = d3.scaleLinear()
|
||||
.domain([0, 130])
|
||||
.range([height - 60, 40]);
|
||||
|
||||
// Before bars
|
||||
svg.selectAll(".bar-before")
|
||||
.data(data)
|
||||
.enter().append("rect")
|
||||
.attr("class", "bar-before")
|
||||
.attr("x", d => xScale(d.metric))
|
||||
.attr("y", d => yScale(d.before))
|
||||
.attr("width", xScale.bandwidth()/2 - 2)
|
||||
.attr("height", d => height - 60 - yScale(d.before))
|
||||
.attr("fill", "#666")
|
||||
.attr("opacity", 0.7);
|
||||
|
||||
// After bars
|
||||
svg.selectAll(".bar-after")
|
||||
.data(data)
|
||||
.enter().append("rect")
|
||||
.attr("class", "bar-after")
|
||||
.attr("x", d => xScale(d.metric) + xScale.bandwidth()/2)
|
||||
.attr("y", d => yScale(d.after))
|
||||
.attr("width", xScale.bandwidth()/2 - 2)
|
||||
.attr("height", d => height - 60 - yScale(d.after))
|
||||
.attr("fill", "#FF6B35")
|
||||
.attr("opacity", 0.8);
|
||||
|
||||
// Add value labels
|
||||
svg.selectAll(".label-before")
|
||||
.data(data)
|
||||
.enter().append("text")
|
||||
.attr("class", "label-before")
|
||||
.attr("x", d => xScale(d.metric) + xScale.bandwidth()/4)
|
||||
.attr("y", d => yScale(d.before) - 5)
|
||||
.attr("text-anchor", "middle")
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "10px")
|
||||
.text(d => d.before);
|
||||
|
||||
svg.selectAll(".label-after")
|
||||
.data(data)
|
||||
.enter().append("text")
|
||||
.attr("class", "label-after")
|
||||
.attr("x", d => xScale(d.metric) + 3*xScale.bandwidth()/4)
|
||||
.attr("y", d => yScale(d.after) - 5)
|
||||
.attr("text-anchor", "middle")
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "10px")
|
||||
.text(d => d.after);
|
||||
|
||||
// Add legend
|
||||
const legend = svg.append("g")
|
||||
.attr("transform", "translate(420, 60)");
|
||||
|
||||
legend.append("rect")
|
||||
.attr("width", 15)
|
||||
.attr("height", 15)
|
||||
.attr("fill", "#666");
|
||||
|
||||
legend.append("text")
|
||||
.attr("x", 20)
|
||||
.attr("y", 12)
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "12px")
|
||||
.text("Antes");
|
||||
|
||||
legend.append("rect")
|
||||
.attr("y", 25)
|
||||
.attr("width", 15)
|
||||
.attr("height", 15)
|
||||
.attr("fill", "#FF6B35");
|
||||
|
||||
legend.append("text")
|
||||
.attr("x", 20)
|
||||
.attr("y", 37)
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "12px")
|
||||
.text("Con Bot IA");
|
||||
|
||||
// Add x-axis labels
|
||||
svg.append("g")
|
||||
.attr("transform", `translate(0, ${height - 60})`)
|
||||
.call(d3.axisBottom(xScale))
|
||||
.selectAll("text")
|
||||
.attr("fill", "#e0e0e0")
|
||||
.style("text-anchor", "end")
|
||||
.attr("dx", "-.8em")
|
||||
.attr("dy", ".15em")
|
||||
.attr("transform", "rotate(-45)");
|
||||
}
|
||||
|
||||
// Initialize all visualizations
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
setTimeout(() => {
|
||||
createROIEvolutionChart();
|
||||
createChannelDistribution();
|
||||
createPerformanceComparison();
|
||||
}, 500);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user