new site
This commit is contained in:
@@ -0,0 +1,609 @@
|
||||
<!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>التجارة الإلكترونية Website IA Odoo | Odoo Expertos</title>
|
||||
|
||||
<link rel="canonical" href="https://www.odoo-expertos.com/ar/odoo-ia/odoo-ecommerce-website-ia-2025/">
|
||||
|
||||
<meta name="description" content="التجارة الإلكترونية Website IA Odoo: Revoluciona tu tienda online con الذكاء الاصطناعي integrada. التخصيص, recomendaciones y ال - Odoo Ecommerce Website IA 2025 | AR">
|
||||
<meta name="keywords" content="التجارة الإلكترونية ia odoo, website ia odoo, tienda online ia">
|
||||
<meta name="robots" content="index, follow">
|
||||
<meta name="author" content="Equipo Odoo Expertos">
|
||||
|
||||
<meta property="og:title" content="التجارة الإلكترونية Website IA Odoo | Odoo Expertos">
|
||||
<meta property="og:description" content="التجارة الإلكترونية Website IA Odoo: Revoluciona tu tienda online con الذكاء الاصطناعي integrada.">
|
||||
<meta property="og:type" content="article">
|
||||
<meta property="og:url" content="https://www.odoo-expertos.com/ar/odoo-ia/odoo-التجارة الإلكترونية-website-ia-2025/">
|
||||
<meta property="og:site_name" content="Odoo Expertos">
|
||||
<meta property="og:locale" content="es_ES">
|
||||
|
||||
<!-- Twitter Card Meta Tags -->
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:title" content="التجارة الإلكترونية Website IA Odoo | Odoo Expertos">
|
||||
<meta name="twitter:description" content="التجارة الإلكترونية Website IA Odoo: Revoluciona tu tienda online con الذكاء الاصطناعي integrada.">
|
||||
|
||||
<link rel="stylesheet" href="/css/main.min.css">
|
||||
|
||||
<!-- Schema.org structured data -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Article",
|
||||
"headline": "Ecommerce Website IA Odoo",
|
||||
"description": "Revoluciona tu tienda online con inteligencia artificial integrada en Odoo",
|
||||
"datePublished": "2025-07-19",
|
||||
"dateModified": "2025-07-19",
|
||||
"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"
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Breadcrumbs Schema -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "BreadcrumbList",
|
||||
"itemListElement": [
|
||||
{
|
||||
"@type": "ListItem",
|
||||
"position": 1,
|
||||
"name": "Inicio",
|
||||
"item": "https://www.odoo-expertos.com/"
|
||||
},
|
||||
{
|
||||
"@type": "ListItem",
|
||||
"position": 2,
|
||||
"name": "Odoo IA",
|
||||
"item": "https://www.odoo-expertos.com/ar/odoo-ia/"
|
||||
},
|
||||
{
|
||||
"@type": "ListItem",
|
||||
"position": 3,
|
||||
"name": "Ecommerce Website IA",
|
||||
"item": "https://www.odoo-expertos.com/ar/odoo-ia/odoo-ecommerce-website-ia-2025/"
|
||||
}
|
||||
]
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
background: #1a1a1a;
|
||||
color: #e0e0e0;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 0 2rem;
|
||||
}
|
||||
.hero-section {
|
||||
background: linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%);
|
||||
padding: 4rem 0;
|
||||
margin-bottom: 3rem;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #FF6B35;
|
||||
}
|
||||
.primary-headline {
|
||||
font-size: 2.5rem;
|
||||
color: #FF6B35;
|
||||
margin-bottom: 1rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
.secondary-headline {
|
||||
font-size: 1.5rem;
|
||||
color: #FF8A50;
|
||||
margin-bottom: 1.5rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.content-section {
|
||||
background: #2a2a2a;
|
||||
padding: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
border-radius: 8px;
|
||||
border-left: 4px solid #FF6B35;
|
||||
}
|
||||
.highlight-stat {
|
||||
background: #FF6B35;
|
||||
color: #1a1a1a;
|
||||
padding: 0.2rem 0.5rem;
|
||||
border-radius: 4px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.breadcrumbs {
|
||||
padding: 1rem 0;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.breadcrumb-list {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.breadcrumb-item a {
|
||||
color: #FF8A50;
|
||||
text-decoration: none;
|
||||
}
|
||||
.breadcrumb-separator {
|
||||
margin: 0 0.5rem;
|
||||
color: #666;
|
||||
}
|
||||
.breadcrumb-item.active {
|
||||
color: #e0e0e0;
|
||||
}
|
||||
.highlight-metric {
|
||||
color: #FF6B35;
|
||||
font-weight: 700;
|
||||
}
|
||||
.insight-box {
|
||||
background: #333;
|
||||
border: 1px solid #FF6B35;
|
||||
border-radius: 8px;
|
||||
padding: 1.5rem;
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
.insight-content {
|
||||
color: #e0e0e0;
|
||||
}
|
||||
.chart-container {
|
||||
background: #2a2a2a;
|
||||
border: 1px solid #333;
|
||||
border-radius: 8px;
|
||||
padding: 1rem;
|
||||
margin: 2rem 0;
|
||||
min-height: 400px;
|
||||
}
|
||||
.faq-section {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
.faq-item {
|
||||
background: #2a2a2a;
|
||||
border: 1px solid #333;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
.faq-item h3 {
|
||||
background: #333;
|
||||
color: #FF6B35;
|
||||
padding: 1rem;
|
||||
margin: 0;
|
||||
font-size: 1.1rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.faq-item .body-text {
|
||||
padding: 1rem;
|
||||
}
|
||||
a {
|
||||
color: #FF6B35;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover {
|
||||
color: #FF8A50;
|
||||
text-decoration: underline;
|
||||
}
|
||||
a[target="_blank"] {
|
||||
color: #FF8A50;
|
||||
}
|
||||
a[target="_blank"]:hover {
|
||||
color: #FFB74D;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.container {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
.primary-headline {
|
||||
font-size: 2rem;
|
||||
}
|
||||
.secondary-headline {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
.content-section {
|
||||
padding: 1.5rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<script src="/components/header.min.js"></script>
|
||||
<script>document.write(/*W6-static*/null);</script>
|
||||
|
||||
<div class="container">
|
||||
<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">التجارة الإلكترونية Website IA</li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<header class="hero-section">
|
||||
<h1 class="primary-headline">التجارة الإلكترونية Website IA Odoo: Revoluciona tu Tienda Online</h1>
|
||||
<h2 class="secondary-headline">الذكاء الاصطناعي que Transforma Visitantes en Clientes</h2>
|
||||
<p>Descubre cómo la <a href="/ar/odoo-ia/odoo-constructor-web-ia-2025/">IA integrada en Odoo Website</a> está revolucionando el ecommerce con personalización automática, recomendaciones inteligentes y optimización de conversiones. Si estás empezando, nuestro <a href="/ar/odoo/curso-odoo-aprender-completo-2025/">curso شامل de Odoo</a> te enseñará los fundamentos antes de implementar IA avanzada.</p>
|
||||
</header>
|
||||
|
||||
<section class="content-section">
|
||||
<h2 class="secondary-headline">¿Por Qué التجارة الإلكترونية IA en Odoo es Esencial en 2025?</h2>
|
||||
<div class="body-text">
|
||||
<p><strong>El التجارة الإلكترونية con IA en Odoo</strong> no es una mejora opcional, es supervivencia digital. La <span class="highlight-stat">versión Odoo 18.3</span> introduce capacidades de inteligencia artificial que transforman completamente la experiencia de compra online. Para una <a href="/ar/odoo-ia/implementacion-odoo-ia-guia-paso-a-paso-2025/">التنفيذ exitosa</a>, necesitas entender cómo integrar cada componente de IA.</p>
|
||||
|
||||
<h3>الميزات Principales:</h3>
|
||||
<ul>
|
||||
<li><strong>Recomendaciones Inteligentes:</strong> Algoritmos que aprenden del comportamiento del usuario</li>
|
||||
<li><strong>التخصيص Automática:</strong> Contenido adaptado en tiempo real</li>
|
||||
<li><strong>Optimización de Conversiones:</strong> A/B testing automático impulsado por IA</li>
|
||||
<li><strong>Chatbots Avanzados:</strong> Atención al cliente 24/7 con comprensión contextual</li>
|
||||
<li><strong>التحليل التنبؤي:</strong> Anticipación de tendencias y demanda</li>
|
||||
</ul>
|
||||
|
||||
<h3>Beneficios Comprobados:</h3>
|
||||
<ul>
|
||||
<li>Incremento conversiones: +45-78%</li>
|
||||
<li>Mejora tiempo en sitio: +65%</li>
|
||||
<li>Reducción abandono carrito: -52%</li>
|
||||
<li>الأتمتة atención: 89% consultas</li>
|
||||
<li>Integración con <a href="/ar/odoo-ia/odoo-chatbot-ia-atencion-cliente-2025/">chatbots inteligentes</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Advanced Features Section -->
|
||||
<section class="content-section">
|
||||
<h2 class="secondary-headline">الوظائف Avanzadas de IA en التجارة الإلكترونية Odoo</h2>
|
||||
<div class="body-text">
|
||||
<h3>1. Motor de Recomendaciones Inteligentes</h3>
|
||||
<p>El النظام de IA analiza patrones de comportamiento para ofrecer recomendaciones precisas:</p>
|
||||
<ul>
|
||||
<li><strong>Recomendaciones por comportamiento:</strong> Basadas en navegación y compras previas</li>
|
||||
<li><strong>Cross-selling ذكي:</strong> Productos complementarios automáticos</li>
|
||||
<li><strong>Up-selling personalizado:</strong> Sugerencias de productos premium</li>
|
||||
<li><strong>Recomendaciones colaborativas:</strong> "Clientes como tú también compraron"</li>
|
||||
</ul>
|
||||
|
||||
<h3>2. التخصيص Dinámica de المحتوى</h3>
|
||||
<p>La IA adapta automáticamente la experiencia de compra:</p>
|
||||
<ul>
|
||||
<li>Banners y promociones personalizados por segmento</li>
|
||||
<li>Precios dinámicos basados en demanda y comportamiento</li>
|
||||
<li>المحتوى de producto adaptado a preferencias</li>
|
||||
<li>Ofertas limitadas en tiempo real</li>
|
||||
</ul>
|
||||
|
||||
<h3>3. Optimización de Conversiones con A/B Testing IA</h3>
|
||||
<p>Testing تلقائي que mejora continuamente la conversión:</p>
|
||||
<ul>
|
||||
<li>Testing de elementos de página تلقائي</li>
|
||||
<li>Optimización de checkout flow</li>
|
||||
<li>Mejora de call-to-action buttons</li>
|
||||
<li>التخصيص de proceso de pago</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Implementation Guide -->
|
||||
<section class="content-section">
|
||||
<h2 class="secondary-headline">دليل de التنفيذ: التجارة الإلكترونية IA en Odoo</h2>
|
||||
<div class="body-text">
|
||||
<h3>Fase 1: التحليل y Preparación (Semanas 1-2)</h3>
|
||||
<ul>
|
||||
<li>Auditoría completa del sitio web actual y التحليل de tráfico</li>
|
||||
<li>Evaluación de base de البيانات de clientes y productos</li>
|
||||
<li>Definición de objetivos de conversión y KPIs</li>
|
||||
<li>التكوين de tracking متقدم para IA</li>
|
||||
</ul>
|
||||
|
||||
<h3>Fase 2: التكوين de IA (Semanas 3-4)</h3>
|
||||
<ul>
|
||||
<li>التنفيذ del motor de recomendaciones</li>
|
||||
<li>التكوين de التخصيص dinámica</li>
|
||||
<li>Setup de chatbots inteligentes</li>
|
||||
<li>التكامل con sistemas de التحليل</li>
|
||||
</ul>
|
||||
|
||||
<h3>Fase 3: Testing y Optimización (Semanas 5-6)</h3>
|
||||
<ul>
|
||||
<li>A/B testing de funcionalidades IA</li>
|
||||
<li>Optimización de algoritmos de recomendación</li>
|
||||
<li>Ajustes basados en métricas de conversión</li>
|
||||
<li>Entrenamiento de chatbots con البيانات reales</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ROI Cases -->
|
||||
<section class="content-section">
|
||||
<h2 class="secondary-headline">قصص النجاح: ROI Comprobado en التجارة الإلكترونية IA</h2>
|
||||
<div class="body-text">
|
||||
<div class="insight-box">
|
||||
<div class="insight-content">
|
||||
<h3>Caso: Tienda de Moda Online (50 empleados)</h3>
|
||||
<ul>
|
||||
<li><strong>التنفيذ:</strong> 5 semanas</li>
|
||||
<li><strong>Inversión inicial:</strong> €45,000</li>
|
||||
<li><strong>Incremento conversiones:</strong> +78%</li>
|
||||
<li><strong>Mejora ticket promedio:</strong> +52%</li>
|
||||
<li><strong>Reducción abandono carrito:</strong> -65%</li>
|
||||
<li><strong>ROI primer año:</strong> 380%</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="insight-box">
|
||||
<div class="insight-content">
|
||||
<h3>Caso: Marketplace B2B (120 empleados)</h3>
|
||||
<ul>
|
||||
<li><strong>التنفيذ:</strong> 6 semanas</li>
|
||||
<li><strong>Inversión inicial:</strong> €68,000</li>
|
||||
<li><strong>Mejora experiencia usuario:</strong> +89%</li>
|
||||
<li><strong>Incremento المبيعات cruzadas:</strong> +134%</li>
|
||||
<li><strong>الأتمتة atención:</strong> 92% consultas</li>
|
||||
<li><strong>ROI primer año:</strong> 445%</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Visualization -->
|
||||
<section class="content-section">
|
||||
<h2 class="secondary-headline">Comparativa: التجارة الإلكترونية Tradicional vs التجارة الإلكترونية IA Odoo</h2>
|
||||
<div class="chart-container" id="ecommerce-comparison-chart"></div>
|
||||
</section>
|
||||
|
||||
<!-- FAQ Section -->
|
||||
<section class="faq-section" itemscope itemtype="https://schema.org/FAQPage">
|
||||
<h2 class="secondary-headline">Preguntas Frecuentes sobre التجارة الإلكترونية IA en Odoo</h2>
|
||||
|
||||
<div class="faq-item" itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
|
||||
<h3 itemprop="name">¿Cuánto cuesta implementar IA en mi tienda online Odoo?</h3>
|
||||
<div itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
|
||||
<div class="body-text" itemprop="text">
|
||||
La inversión típica para التجارة الإلكترونية IA en Odoo oscila entre €35,000-€80,000 dependiendo del tamaño del catálogo y complejidad de funcionalidades. El ROI promedio es 350-450% en el primer año, con amortización típica en 8-12 meses.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-item" itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
|
||||
<h3 itemprop="name">¿Qué nivel de precisión tienen las recomendaciones de IA?</h3>
|
||||
<div itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
|
||||
<div class="body-text" itemprop="text">
|
||||
Después del período de aprendizaje inicial de 30-60 días, la precisión de recomendaciones alcanza 85-92% para productos relacionados y 78-88% para predicción de interés de compra. La precisión mejora continuamente con más البيانات de usuario.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-item" itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
|
||||
<h3 itemprop="name">¿Cómo funciona la التخصيص automática de المحتوى?</h3>
|
||||
<div itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
|
||||
<div class="body-text" itemprop="text">
|
||||
La IA analiza comportamiento de navegación, historial de compras, البيانات demográficos y patrones de temporada para mostrar automáticamente المحتوى relevante. Incluye banners personalizados, productos destacados, ofertas específicas y experiencias de navegación adaptadas.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-item" itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
|
||||
<h3 itemprop="name">¿Qué resultados puedo esperar en los primeros 60 días?</h3>
|
||||
<div itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
|
||||
<div class="body-text" itemprop="text">
|
||||
Los primeros 60 días típicamente muestran 25-45% de mejora en tiempo en sitio, 30-55% de incremento en páginas por sesión, y 20-40% de reducción en tasa de rebote. Los beneficios más significativos en conversiones aparecen después del día 90.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq-item" itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
|
||||
<h3 itemprop="name">¿Es compatible con mi diseño web actual en Odoo?</h3>
|
||||
<div itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
|
||||
<div class="body-text" itemprop="text">
|
||||
Sí, las الوظائف de IA se integran perfectamente con cualquier tema de Odoo Website. Los widgets de recomendaciones, chatbots y elementos de التخصيص se adaptan automáticamente al diseño existente sin afectar la apariencia visual de tu tienda.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Implementation ROI -->
|
||||
<section class="content-section">
|
||||
<h2 class="secondary-headline">التنفيذ y ROI Detallado</h2>
|
||||
<div class="body-text">
|
||||
<p>La implementación típica toma 4-6 semanas con ROI promedio del <span class="highlight-metric">380% en el primer año</span>. Las empresas que implementan ecommerce IA en Odoo reportan incrementos significativos en ventas online y satisfacción del cliente.</p>
|
||||
|
||||
<div class="insight-box">
|
||||
<div class="insight-content">
|
||||
<h3>Métricas de Impacto Típicas:</h3>
|
||||
<ul>
|
||||
<li><strong>Incremento conversiones:</strong> 45-78%</li>
|
||||
<li><strong>Mejora ticket promedio:</strong> 35-65%</li>
|
||||
<li><strong>Reducción abandono carrito:</strong> 40-70%</li>
|
||||
<li><strong>Incremento المبيعات cruzadas:</strong> 85-150%</li>
|
||||
<li><strong>Mejora satisfacción cliente:</strong> 60-85%</li>
|
||||
<li><strong>الأتمتة consultas:</strong> 80-95%</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>La pregunta no es si necesitas IA en tu ecommerce, sino cuánto dinero estás perdiendo cada día sin estas optimizaciones automáticas que tus competidores ya están usando. Cada semana de retraso representa oportunidades de venta perdidas y clientes que migran a tiendas con experiencias más inteligentes. Complementa tu estrategia con <a href="/ar/odoo-ia/odoo-automatizacion-ia-procesos-2025/">الأتمتة avanzada</a> y <a href="/ar/odoo-ia/odoo-crm-ia-gestion-clientes-2025/">CRM ذكي</a>.</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<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 implementaciones ecommerce"
|
||||
},
|
||||
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 for visualization -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.8.5/d3.min.js"></script>
|
||||
<script>
|
||||
// Ecommerce Comparison Chart
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const data = [
|
||||
{feature: "Recomendaciones", tradicional: 2, ia: 5},
|
||||
{feature: "Personalización", tradicional: 2, ia: 5},
|
||||
{feature: "Conversiones", tradicional: 3, ia: 5},
|
||||
{feature: "Atención Cliente", tradicional: 2, ia: 5},
|
||||
{feature: "Análisis Comportamiento", tradicional: 1, ia: 5},
|
||||
{feature: "Optimización UX", tradicional: 2, ia: 5},
|
||||
{feature: "A/B Testing", tradicional: 1, ia: 4}
|
||||
];
|
||||
|
||||
const margin = {top: 60, right: 100, bottom: 60, left: 140};
|
||||
const width = 700 - margin.left - margin.right;
|
||||
const height = 450 - margin.top - margin.bottom;
|
||||
|
||||
const svg = d3.select("#ecommerce-comparison-chart")
|
||||
.append("svg")
|
||||
.attr("width", width + margin.left + margin.right)
|
||||
.attr("height", height + margin.top + margin.bottom);
|
||||
|
||||
const g = svg.append("g")
|
||||
.attr("transform", `translate(${margin.left},${margin.top})`);
|
||||
|
||||
const y = d3.scaleBand()
|
||||
.domain(data.map(d => d.feature))
|
||||
.range([0, height])
|
||||
.padding(0.2);
|
||||
|
||||
const x = d3.scaleLinear()
|
||||
.domain([0, 5])
|
||||
.range([0, width]);
|
||||
|
||||
const colorScale = d3.scaleOrdinal()
|
||||
.domain(["tradicional", "ia"])
|
||||
.range(["#666", "#FF6B35"]);
|
||||
|
||||
// Add bars for traditional ecommerce
|
||||
g.selectAll(".bar-tradicional")
|
||||
.data(data)
|
||||
.enter().append("rect")
|
||||
.attr("class", "bar-tradicional")
|
||||
.attr("x", 0)
|
||||
.attr("y", d => y(d.feature))
|
||||
.attr("width", d => x(d.tradicional))
|
||||
.attr("height", y.bandwidth() / 2)
|
||||
.attr("fill", colorScale("tradicional"))
|
||||
.attr("rx", 4);
|
||||
|
||||
// Add bars for IA ecommerce
|
||||
g.selectAll(".bar-ia")
|
||||
.data(data)
|
||||
.enter().append("rect")
|
||||
.attr("class", "bar-ia")
|
||||
.attr("x", 0)
|
||||
.attr("y", d => y(d.feature) + y.bandwidth() / 2)
|
||||
.attr("width", d => x(d.ia))
|
||||
.attr("height", y.bandwidth() / 2)
|
||||
.attr("fill", colorScale("ia"))
|
||||
.attr("rx", 4);
|
||||
|
||||
// Add feature labels
|
||||
g.selectAll(".feature-label")
|
||||
.data(data)
|
||||
.enter().append("text")
|
||||
.attr("class", "feature-label")
|
||||
.attr("x", -10)
|
||||
.attr("y", d => y(d.feature) + y.bandwidth() / 2)
|
||||
.attr("dy", "0.35em")
|
||||
.attr("text-anchor", "end")
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "12px")
|
||||
.text(d => d.feature);
|
||||
|
||||
// Add value labels
|
||||
g.selectAll(".value-tradicional")
|
||||
.data(data)
|
||||
.enter().append("text")
|
||||
.attr("class", "value-tradicional")
|
||||
.attr("x", d => x(d.tradicional) + 5)
|
||||
.attr("y", d => y(d.feature) + y.bandwidth() / 4)
|
||||
.attr("dy", "0.35em")
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "12px")
|
||||
.text(d => d.tradicional);
|
||||
|
||||
g.selectAll(".value-ia")
|
||||
.data(data)
|
||||
.enter().append("text")
|
||||
.attr("class", "value-ia")
|
||||
.attr("x", d => x(d.ia) + 5)
|
||||
.attr("y", d => y(d.feature) + (3 * y.bandwidth()) / 4)
|
||||
.attr("dy", "0.35em")
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "12px")
|
||||
.text(d => d.ia);
|
||||
|
||||
// Add legend
|
||||
const legend = g.append("g")
|
||||
.attr("transform", `translate(${width - 120}, -30)`);
|
||||
|
||||
legend.append("rect")
|
||||
.attr("x", 0)
|
||||
.attr("y", 0)
|
||||
.attr("width", 15)
|
||||
.attr("height", 15)
|
||||
.attr("fill", colorScale("tradicional"));
|
||||
|
||||
legend.append("text")
|
||||
.attr("x", 20)
|
||||
.attr("y", 12)
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "12px")
|
||||
.text("Ecommerce Tradicional");
|
||||
|
||||
legend.append("rect")
|
||||
.attr("x", 0)
|
||||
.attr("y", 20)
|
||||
.attr("width", 15)
|
||||
.attr("height", 15)
|
||||
.attr("fill", colorScale("ia"));
|
||||
|
||||
legend.append("text")
|
||||
.attr("x", 20)
|
||||
.attr("y", 32)
|
||||
.attr("fill", "#e0e0e0")
|
||||
.attr("font-size", "12px")
|
||||
.text("Ecommerce IA Odoo");
|
||||
|
||||
// Add title
|
||||
g.append("text")
|
||||
.attr("x", width / 2)
|
||||
.attr("y", -30)
|
||||
.attr("text-anchor", "middle")
|
||||
.attr("fill", "#FF6B35")
|
||||
.attr("font-size", "16px")
|
||||
.attr("font-weight", "600")
|
||||
.text("Capacidades: Ecommerce Tradicional vs Ecommerce IA");
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user