{"id":6,"date":"2022-08-29T10:45:48","date_gmt":"2022-08-29T10:45:48","guid":{"rendered":"https:\/\/buscomunicacion.com\/?page_id=6"},"modified":"2025-06-24T06:10:52","modified_gmt":"2025-06-24T06:10:52","slug":"hermosos-portafolios-para-creativos-excepcionales","status":"publish","type":"page","link":"https:\/\/buscomunicacion.com\/","title":{"rendered":"Inteligencia de medios"},"content":{"rendered":"\n

<\/p>\n\n\n\n\n\n\n \n \n Informe Interactivo: Inteligencia de Medios<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\">\n <!-- Chosen Palette: Corporate Calm (refined for visual appeal) -->\n <!-- Application Structure Plan: A single-page dashboard structure with a sticky top navigation. Key sections are 'Qu\u00e9 es', 'Pilares', 'Visualizaciones', 'Aplicaciones', 'Clientes', and 'Futuro'. The 'Aplicaciones' section remains the interactive core, using a tab-like system where clicking a sector dynamically updates a bar chart and detailed text, enhancing information digestibility. A floating 'Back to Top' button improves navigation. This design prioritizes user exploration and understanding by breaking down complex information into manageable, interactive segments. -->\n <!-- Visualization & Content Choices: \n - Report Info: Introduction -> Goal: Engage & Inform -> Viz: Hero section with prominent title, subtitle, and an engaging icon\/emoji -> Interaction: None -> Justification: Sets the tone and provides a high-level overview.\n - Report Info: Pillars -> Goal: Inform core concepts -> Viz: Grid of visually enhanced cards with distinct numbering and short descriptions -> Interaction: Subtle hover effect -> Justification: Offers a clean, scannable summary of foundational elements.\n - Report Info: Media coverage distribution & Sentiment analysis -> Goal: Inform proportions -> Viz: Doughnut Charts (Chart.js\/Canvas) with refined colors and clear tooltips -> Interaction: Hover for details -> Justification: Clearly visualizes parts of a whole and emotional tone.\n - Report Info: Sector-specific applications -> Goal: Organize & Compare detailed information -> Viz: Interactive tab-like buttons to control a bar chart and rich text content -> Interaction: Click sector buttons to dynamically update chart and text, making it highly exploratory -> Justification: Handles a large amount of segmented data efficiently, allowing users to focus on relevant information without being overwhelmed.\n - Report Info: Client types and needs -> Goal: Organize & Inform specific benefits -> Viz: Grid of visually distinct cards, each with an icon and a list of benefits -> Interaction: Subtle hover effect -> Justification: Provides a structured, scannable overview of different client segments and their value propositions.\n - Report Info: Future trends and challenges -> Goal: Inform & Organize insights -> Viz: Two-column layout with visually differentiated cards, using check\/exclamation mark icons for clarity -> Interaction: None -> Justification: Presents qualitative future-looking information clearly and distinguishes between positive trends and potential obstacles.\n -->\n <!-- CONFIRMATION: NO SVG graphics used. NO Mermaid JS used. -->\n <style>\n body {\n font-family: 'Inter', sans-serif;\n background-color: #f8fafc; \/* Very light blue-gray *\/\n color: #1e293b; \/* Dark slate *\/\n }\n .chart-container {\n position: relative;\n margin: auto;\n height: 320px;\n width: 100%;\n max-width: 500px;\n padding: 1rem; \/* Added padding to ensure chart isn't too close to edge *\/\n box-sizing: border-box; \/* Include padding in element's total width and height *\/\n }\n @media (min-width: 768px) {\n .chart-container {\n height: 400px;\n }\n }\n .nav-link {\n transition: color 0.3s ease;\n }\n .nav-link:hover {\n color: #2563eb; \/* Blue-700 *\/\n }\n .sector-btn {\n transition: all 0.3s ease;\n }\n .sector-btn.active {\n background-color: #2563eb; \/* Blue-700 *\/\n color: #ffffff;\n box-shadow: 0 4px 14px 0 rgba(37, 99, 235, 0.5);\n transform: translateY(-2px); \/* Slight lift *\/\n }\n .scroll-to-top {\n position: fixed;\n bottom: 2rem;\n right: 2rem;\n background-color: #2563eb;\n color: white;\n padding: 0.75rem;\n border-radius: 9999px; \/* Fully rounded *\/\n box-shadow: 0 4px 14px 0 rgba(37, 99, 235, 0.4);\n transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;\n cursor: pointer;\n z-index: 100;\n opacity: 0;\n transform: translateY(20px);\n }\n .scroll-to-top.show {\n opacity: 1;\n transform: translateY(0);\n }\n <\/style>\n<\/head>\n<body class=\"bg-slate-50 text-slate-800\">\n\n <header class=\"bg-white shadow-sm sticky top-0 z-50\">\n <nav class=\"container mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center\">\n <h1 class=\"text-xl md:text-2xl font-bold text-blue-700\">Inteligencia de Medios<\/h1>\n <div class=\"hidden md:flex space-x-8\">\n <a href=\"#que-es\" class=\"nav-link font-semibold text-slate-600\">Qu\u00e9 es<\/a>\n <a href=\"#pilares\" class=\"nav-link font-semibold text-slate-600\">Pilares<\/a>\n <a href=\"#visualizaciones\" class=\"nav-link font-semibold text-slate-600\">Visualizaciones<\/a>\n <a href=\"#aplicaciones\" class=\"nav-link font-semibold text-slate-600\">Aplicaciones<\/a>\n <a href=\"#clientes\" class=\"nav-link font-semibold text-slate-600\">Clientes<\/a>\n <a href=\"#futuro\" class=\"nav-link font-semibold text-slate-600\">Futuro<\/a>\n <\/div>\n <button id=\"mobile-menu-button\" class=\"md:hidden p-2 rounded-md text-slate-600 hover:bg-slate-100 focus:outline-none\">\n <svg class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16m-7 6h7\" \/>\n <\/svg>\n <\/button>\n <\/nav>\n <div id=\"mobile-menu\" class=\"hidden md:hidden bg-white border-t border-slate-200\">\n <a href=\"#que-es\" class=\"block py-2 px-4 text-sm text-slate-600 hover:bg-slate-50\">Qu\u00e9 es<\/a>\n <a href=\"#pilares\" class=\"block py-2 px-4 text-sm text-slate-600 hover:bg-slate-50\">Pilares<\/a>\n <a href=\"#visualizaciones\" class=\"block py-2 px-4 text-sm text-slate-600 hover:bg-slate-50\">Visualizaciones<\/a>\n <a href=\"#aplicaciones\" class=\"block py-2 px-4 text-sm text-slate-600 hover:bg-slate-50\">Aplicaciones<\/a>\n <a href=\"#clientes\" class=\"block py-2 px-4 text-sm text-slate-600 hover:bg-slate-50\">Clientes<\/a>\n <a href=\"#futuro\" class=\"block py-2 px-4 text-sm text-slate-600 hover:bg-slate-50\">Futuro<\/a>\n <\/div>\n <\/header>\n\n <main class=\"container mx-auto px-4 sm:px-6 lg:px-8 py-8 md:py-12\">\n \n <section id=\"que-es\" class=\"text-center pt-16 pb-12 bg-gradient-to-br from-blue-50 to-white rounded-xl shadow-inner mb-12\">\n <span class=\"text-5xl md:text-6xl mb-4 block animate-bounce-slow\">\u2728<\/span>\n <h2 class=\"text-4xl md:text-6xl font-extrabold text-blue-800 mb-4 leading-tight\">Transformando Datos en Decisi\u00f3n Estrat\u00e9gica<\/h2>\n <p class=\"max-w-4xl mx-auto text-xl text-slate-700 mt-6\">\n La inteligencia de medios es la clave para desentra\u00f1ar el vasto volumen de informaci\u00f3n actual, convirtiendo el ruido en conocimiento accionable. Empoderamos a las organizaciones para tomar decisiones informadas, anticipar desaf\u00edos y capitalizar oportunidades en un entorno medi\u00e1tico en constante evoluci\u00f3n.\n <\/p>\n <\/section>\n\n <section id=\"pilares\" class=\"pt-16 pb-12\">\n <div class=\"text-center mb-12\">\n <h3 class=\"text-3xl md:text-4xl font-bold text-slate-900\">Nuestros Pilares de Servicio<\/h3>\n <p class=\"mt-4 text-lg text-slate-600 max-w-2xl mx-auto\">La inteligencia de medios se construye sobre principios s\u00f3lidos que garantizan una visi\u00f3n profunda y verificada del panorama comunicacional.<\/p>\n <\/div>\n <div class=\"grid md:grid-cols-2 lg:grid-cols-4 gap-8\">\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1 border border-blue-50\">\n <div class=\"flex items-center justify-center h-14 w-14 rounded-full bg-blue-100 text-blue-600 mb-4 text-3xl font-bold\">1<\/div>\n <h4 class=\"text-xl font-semibold mb-2 text-slate-900\">Monitorizaci\u00f3n Estrat\u00e9gica<\/h4>\n <p class=\"text-slate-600 text-sm\">Rastreo exhaustivo en prensa, redes sociales, radio, TV, blogs y foros para identificar menciones y contexto.<\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1 border border-green-50\">\n <div class=\"flex items-center justify-center h-14 w-14 rounded-full bg-green-100 text-green-600 mb-4 text-3xl font-bold\">2<\/div>\n <h4 class=\"text-xl font-semibold mb-2 text-slate-900\">An\u00e1lisis Cuantitativo y Cualitativo<\/h4>\n <p class=\"text-slate-600 text-sm\">Evaluaci\u00f3n avanzada de la calidad y el sentimiento (positivo, neutro, negativo) de las menciones.<\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1 border border-amber-50\">\n <div class=\"flex items-center justify-center h-14 w-14 rounded-full bg-amber-100 text-amber-600 mb-4 text-3xl font-bold\">3<\/div>\n <h4 class=\"text-xl font-semibold mb-2 text-slate-900\">Identificaci\u00f3n de Tendencias<\/h4>\n <p class=\"text-slate-600 text-sm\">Detecci\u00f3n proactiva de tendencias emergentes y narrativas dominantes para adaptar estrategias.<\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1 border border-red-50\">\n <div class=\"flex items-center justify-center h-14 w-14 rounded-full bg-red-100 text-red-600 mb-4 text-3xl font-bold\">4<\/div>\n <h4 class=\"text-xl font-semibold mb-2 text-slate-900\">Gesti\u00f3n Proactiva de Reputaci\u00f3n y Crisis<\/h4>\n <p class=\"text-slate-600 text-sm\">Sistema de alerta temprana para permitir una respuesta \u00e1gil y minimizar el impacto negativo.<\/p>\n <\/div>\n <\/div>\n <\/section>\n \n <section id=\"visualizaciones\" class=\"pt-16 pb-12 bg-slate-100 -mx-4 sm:-mx-6 lg:-mx-8 px-4 sm:px-6 lg:px-8 rounded-xl shadow-inner mb-12\">\n <div class=\"text-center mb-12\">\n <h3 class=\"text-3xl md:text-4xl font-bold text-slate-900\">Visualizando los Insights Clave<\/h3>\n <p class=\"mt-4 text-lg text-slate-600 max-w-2xl mx-auto\">Transformamos datos complejos en representaciones claras y concisas que facilitan la comprensi\u00f3n del impacto medi\u00e1tico.<\/p>\n <\/div>\n <div class=\"grid lg:grid-cols-2 gap-8 md:gap-12\">\n <div class=\"bg-white p-6 rounded-xl shadow-lg border border-slate-200 flex flex-col items-center justify-center\">\n <h4 class=\"text-xl font-semibold text-center mb-4 text-slate-900\">Distribuci\u00f3n de Cobertura Medi\u00e1tica por Canal<\/h4>\n <p class=\"text-slate-600 text-sm text-center mb-6\">Este gr\u00e1fico de donut ilustra el porcentaje de menciones de su marca o sector en diferentes tipos de medios de comunicaci\u00f3n.<\/p>\n <div class=\"chart-container\">\n <canvas id=\"mediaCoverageChart\"><\/canvas>\n <\/div>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-lg border border-slate-200 flex flex-col items-center justify-center\">\n <h4 class=\"text-xl font-semibold text-center mb-4 text-slate-900\">An\u00e1lisis del Sentimiento General de las Menciones<\/h4>\n <p class=\"text-slate-600 text-sm text-center mb-6\">Comprenda la percepci\u00f3n p\u00fablica de su marca, categorizando el tono de las conversaciones como positivo, neutro o negativo.<\/p>\n <div class=\"chart-container\">\n <canvas id=\"sentimentChart\"><\/canvas>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <section id=\"aplicaciones\" class=\"pt-16 pb-12\">\n <div class=\"text-center mb-12\">\n <h3 class=\"text-3xl md:text-4xl font-bold text-slate-900\">Aplicaciones Estrat\u00e9gicas por Sector<\/h3>\n <p class=\"mt-4 text-lg text-slate-600 max-w-2xl mx-auto\">La inteligencia de medios se adapta para impulsar el \u00e9xito en diversas industrias. Seleccione un sector para ver c\u00f3mo podemos transformar sus desaf\u00edos en oportunidades.<\/p>\n <\/div>\n <div class=\"flex flex-wrap justify-center gap-2 md:gap-4 mb-8\" id=\"sector-buttons\">\n <\/div>\n\n <div class=\"grid md:grid-cols-5 gap-8 items-start\">\n <div id=\"sector-info\" class=\"md:col-span-3 bg-white p-6 rounded-xl shadow-lg border border-slate-200\">\n <\/div>\n <div class=\"md:col-span-2 bg-white p-6 rounded-xl shadow-lg border border-slate-200\">\n <h4 id=\"sector-chart-title\" class=\"text-xl font-semibold text-center mb-4 text-slate-900\"><\/h4>\n <div class=\"chart-container h-80 md:h-[450px]\">\n <canvas id=\"sectorChart\"><\/canvas>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <section id=\"clientes\" class=\"pt-16 pb-12 bg-slate-100 -mx-4 sm:-mx-6 lg:-mx-8 px-4 sm:px-6 lg:px-8 rounded-xl shadow-inner mb-12\">\n <div class=\"text-center mb-12\">\n <h3 class=\"text-3xl md:text-4xl font-bold text-slate-900\">Nuestros Clientes Clave<\/h3>\n <p class=\"mt-4 text-lg text-slate-600 max-w-2xl mx-auto\">La inteligencia de medios es un activo vital para una amplia gama de clientes que buscan entender y gestionar su impacto en el panorama medi\u00e1tico.<\/p>\n <\/div>\n <div class=\"max-w-6xl mx-auto grid md:grid-cols-2 lg:grid-cols-3 gap-8\">\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1 border border-blue-50\">\n <h4 class=\"text-xl font-semibold mb-2 flex items-center text-slate-900\">\n <span class=\"mr-2 text-blue-600 text-2xl\">\ud83d\udce2<\/span> Marketing y Comunicaci\u00f3n (PR)\n <\/h4>\n <ul class=\"list-disc list-inside text-slate-600 space-y-1 text-sm\">\n <li>Gesti\u00f3n de Marca y Reputaci\u00f3n.<\/li>\n <li>An\u00e1lisis y Optimizaci\u00f3n de Campa\u00f1as.<\/li>\n <li>Identificaci\u00f3n de Influencers y Medios Clave.<\/li>\n <li>Benchmarking de Competencia.<\/li>\n <\/ul>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1 border border-green-50\">\n <h4 class=\"text-xl font-semibold mb-2 flex items-center text-slate-900\">\n <span class=\"mr-2 text-green-600 text-2xl\">\ud83d\udcbc<\/span> Directivos y CEOs (C-level Executives)\n <\/h4>\n <ul class=\"list-disc list-inside text-slate-600 space-y-1 text-sm\">\n <li>Toma de Decisiones Estrat\u00e9gicas.<\/li>\n <li>Gesti\u00f3n y Prevenci\u00f3n de Crisis.<\/li>\n <\/ul>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1 border border-amber-50\">\n <h4 class=\"text-xl font-semibold mb-2 flex items-center text-slate-900\">\n <span class=\"mr-2 text-amber-600 text-2xl\">\ud83e\udd1d<\/span> Agencias de RRPP y Comunicaci\u00f3n\n <\/h4>\n <ul class=\"list-disc list-inside text-slate-600 space-y-1 text-sm\">\n <li>Optimizaci\u00f3n de Servicio a Clientes.<\/li>\n <li>Desarrollo de Estrategias Basadas en Datos.<\/li>\n <\/ul>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1 border border-purple-50\">\n <h4 class=\"text-xl font-semibold mb-2 flex items-center text-slate-900\">\n <span class=\"mr-2 text-purple-600 text-2xl\">\ud83c\udfdb\ufe0f<\/span> Asuntos P\u00fablicos y Gobiernos\n <\/h4>\n <ul class=\"list-disc list-inside text-slate-600 space-y-1 text-sm\">\n <li>Monitoreo Legislativo y Pol\u00edtico.<\/li>\n <li>Gesti\u00f3n de la Imagen Institucional.<\/li>\n <\/ul>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1 border border-pink-50\">\n <h4 class=\"text-xl font-semibold mb-2 flex items-center text-slate-900\">\n <span class=\"mr-2 text-pink-600 text-2xl\">\ud83d\udcb0<\/span> Ventas y Desarrollo de Negocio\n <\/h4>\n <ul class=\"list-disc list-inside text-slate-600 space-y-1 text-sm\">\n <li>Identificaci\u00f3n de Oportunidades de Mercado.<\/li>\n <li>Inteligencia Competitiva de Negocio.<\/li>\n <\/ul>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1 border border-indigo-50\">\n <h4 class=\"text-xl font-semibold mb-2 flex items-center text-slate-900\">\n <span class=\"mr-2 text-indigo-600 text-2xl\">\ud83d\udcca<\/span> Analistas de Mercado e Investigadores\n <\/h4>\n <ul class=\"list-disc list-inside text-slate-600 space-y-1 text-sm\">\n <li>Investigaci\u00f3n de Tendencias de Consumo.<\/li>\n <li>An\u00e1lisis Sectorial Profundo.<\/li>\n <\/ul>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1 border border-red-50\">\n <h4 class=\"text-xl font-semibold mb-2 flex items-center text-slate-900\">\n <span class=\"mr-2 text-red-600 text-2xl\">\ud83d\udc65<\/span> Departamentos de Recursos Humanos\n <\/h4>\n <ul class=\"list-disc list-inside text-slate-600 space-y-1 text-sm\">\n <li>Fortalecimiento de la Marca Empleadora.<\/li>\n <li>Gesti\u00f3n de Crisis Internas y Externas.<\/li>\n <\/ul>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1 border border-teal-50\">\n <h4 class=\"text-xl font-semibold mb-2 flex items-center text-slate-900\">\n <span class=\"mr-2 text-teal-600 text-2xl\">\ud83c\udf10<\/span> Sector P\u00fablico y ONGs\n <\/h4>\n <ul class=\"list-disc list-inside text-slate-600 space-y-1 text-sm\">\n <li>Monitoreo de Pol\u00edticas y Programas.<\/li>\n <li>Gesti\u00f3n de la Imagen Institucional.<\/li>\n <li>Estrategias de Recaudaci\u00f3n de Fondos.<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <\/section>\n\n <section id=\"futuro\" class=\"pt-16 pb-12 bg-slate-50\">\n <div class=\"text-center mb-12\">\n <h3 class=\"text-3xl md:text-4xl font-bold text-slate-900\">El Futuro de la Inteligencia de Medios<\/h3>\n <p class=\"mt-4 text-lg text-slate-600 max-w-2xl mx-auto\">La evoluci\u00f3n tecnol\u00f3gica redefine constantemente las fronteras de lo posible, trayendo consigo tanto avances prometedores como desaf\u00edos cr\u00edticos.<\/p>\n <\/div>\n <div class=\"max-w-5xl mx-auto grid md:grid-cols-2 gap-8\">\n <div class=\"bg-white p-8 rounded-xl shadow-lg border border-slate-200\">\n <h4 class=\"text-2xl font-semibold mb-4 text-slate-900 flex items-center\">\n <span class=\"mr-3 text-blue-600\">\ud83d\ude80<\/span> Tendencias y Avances Clave\n <\/h4>\n <ul class=\"space-y-3 text-slate-600\">\n <li class=\"flex items-start\"><span class=\"text-blue-500 font-bold mr-3 mt-1 text-lg\">\u2713<\/span><span><strong>IA y Personalizaci\u00f3n:<\/strong> Hipersegmentaci\u00f3n para experiencias de usuario \u00fanicas y optimizaci\u00f3n de campa\u00f1as en tiempo real.<\/span><\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-500 font-bold mr-3 mt-1 text-lg\">\u2713<\/span><span><strong>An\u00e1lisis Predictivo:<\/strong> Pron\u00f3stico de tendencias de mercado y comportamiento del consumidor para decisiones proactivas.<\/span><\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-500 font-bold mr-3 mt-1 text-lg\">\u2713<\/span><span><strong>Formatos Inmersivos:<\/strong> Integraci\u00f3n con RA\/RV y marketing de voz para nuevas formas de engagement.<\/span><\/li>\n <\/ul>\n <\/div>\n <div class=\"bg-white p-8 rounded-xl shadow-lg border border-slate-200\">\n <h4 class=\"text-2xl font-semibold mb-4 text-slate-900 flex items-center\">\n <span class=\"mr-3 text-amber-600\">\u26a0\ufe0f<\/span> Desaf\u00edos y Consideraciones \u00c9ticas\n <\/h4>\n <ul class=\"space-y-3 text-slate-600\">\n <li class=\"flex items-start\"><span class=\"text-amber-500 font-bold mr-3 mt-1 text-lg\">!<\/span><span><strong>Privacidad de Datos:<\/strong> La recopilaci\u00f3n masiva exige medidas robustas de ciberseguridad y cumplimiento normativo estricto.<\/span><\/li>\n <li class=\"flex items-start\"><span class=\"text-amber-500 font-bold mr-3 mt-1 text-lg\">!<\/span><span><strong>Sesgo Algor\u00edtmico:<\/strong> Necesidad de abordar activamente los sesgos en algoritmos para evitar resultados injustos o discriminatorios.<\/span><\/li>\n <li class=\"flex items-start\"><span class=\"text-amber-500 font-bold mr-3 mt-1 text-lg\">!<\/span><span><strong>Desinformaci\u00f3n:<\/strong> El gran volumen de informaci\u00f3n y las \u00abfake news\u00bb exigen un filtrado y verificaci\u00f3n rigurosos.<\/span><\/li>\n <\/ul>\n <\/div>\n <\/div>\n <\/section>\n\n <\/main>\n \n <footer class=\"bg-slate-800 text-white mt-12\">\n <div class=\"container mx-auto px-4 sm:px-6 lg:px-8 py-8 text-center\">\n <p class=\"font-semibold text-lg mb-2\">La inteligencia de medios no es solo escuchar, es <span class=\"text-blue-300\">entender, anticipar y actuar<\/span> con precisi\u00f3n.<\/p>\n <p class=\"text-sm text-slate-400\">Informe Interactivo de Inteligencia de Medios \u00a9 2025<\/p>\n <\/div>\n <\/footer>\n\n <button id=\"scrollToTopBtn\" class=\"scroll-to-top hidden\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 10l7-7m0 0l7 7m-7-7v18\" \/>\n <\/svg>\n <\/button>\n\n <script>\n document.addEventListener('DOMContentLoaded', () => {\n\n const mobileMenuButton = document.getElementById('mobile-menu-button');\n const mobileMenu = document.getElementById('mobile-menu');\n mobileMenuButton.addEventListener('click', () => {\n mobileMenu.classList.toggle('hidden');\n });\n \n document.querySelectorAll('#mobile-menu a').forEach(link => {\n link.addEventListener('click', () => {\n mobileMenu.classList.add('hidden');\n });\n });\n\n const scrollToTopBtn = document.getElementById('scrollToTopBtn');\n window.addEventListener('scroll', () => {\n if (window.scrollY > 300) { \/\/ Show button after scrolling 300px\n scrollToTopBtn.classList.add('show');\n } else {\n scrollToTopBtn.classList.remove('show');\n }\n });\n\n scrollToTopBtn.addEventListener('click', () => {\n window.scrollTo({\n top: 0,\n behavior: 'smooth'\n });\n });\n\n\n const data = {\n mediaCoverage: {\n labels: ['Prensa Online', 'Redes Sociales', 'TV & Radio', 'Blogs y Foros'],\n datasets: [{\n data: [45, 30, 15, 10],\n backgroundColor: ['#3b82f6', '#10b981', '#f59e0b', '#ef4444'],\n borderColor: '#ffffff',\n borderWidth: 4,\n hoverOffset: 8\n }]\n },\n sentiment: {\n labels: ['Positivo', 'Neutro', 'Negativo'],\n datasets: [{\n data: [65, 25, 10],\n backgroundColor: ['#10b981', '#f59e0b', '#ef4444'],\n borderColor: '#ffffff',\n borderWidth: 4,\n hoverOffset: 8\n }]\n },\n sectors: {\n empresas: {\n title: 'Empresas y Marcas',\n icon: '\ud83c\udfe2',\n info: `\n <h4 class=\"text-2xl font-bold mb-4 text-slate-900\">Para Empresas y Marcas<\/h4>\n <p class=\"mb-4 text-slate-600\">La inteligencia de medios es una herramienta indispensable para navegar el complejo panorama digital y mantener una ventaja competitiva. Permite un enfoque unificado y basado en datos para gestionar todo el ecosistema de la marca.<\/p>\n <ul class=\"space-y-3 text-slate-600\">\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Gesti\u00f3n de Reputaci\u00f3n:<\/strong> Protecci\u00f3n proactiva de la imagen de marca y mitigaci\u00f3n de crisis.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>An\u00e1lisis Competitivo:<\/strong> Comprensi\u00f3n de estrategias rivales para ganar cuota de mercado.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Desarrollo de Producto:<\/strong> Adaptaci\u00f3n de ofertas seg\u00fan el feedback real de los consumidores.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Optimizaci\u00f3n de Campa\u00f1as:<\/strong> Medici\u00f3n y ajuste en tiempo real para maximizar el ROI.<\/li>\n <\/ul>`,\n chartData: {\n labels: ['Reputaci\u00f3n', 'Competencia', 'Producto', 'Campa\u00f1as'],\n datasets: [{\n label: 'Impacto Estrat\u00e9gico',\n data: [90, 85, 80, 95],\n backgroundColor: ['#3b82f6', '#10b981', '#f59e0b', '#ef4444'],\n }]\n }\n },\n instituciones: {\n title: 'Instituciones P\u00fablicas',\n icon: '\ud83c\udfdb\ufe0f',\n info: `\n <h4 class=\"text-2xl font-bold mb-4 text-slate-900\">Para Instituciones P\u00fablicas<\/h4>\n <p class=\"mb-4 text-slate-600\">Se ha convertido en un pilar para una gobernanza m\u00e1s eficaz y receptiva, transformando la administraci\u00f3n de un modelo reactivo a uno proactivo y centrado en el ciudadano.<\/p>\n <ul class=\"space-y-3 text-slate-600\">\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Opini\u00f3n P\u00fablica:<\/strong> Medici\u00f3n del sentimiento ciudadano sobre pol\u00edticas e iniciativas.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Mejora de Servicios:<\/strong> Optimizaci\u00f3n de la atenci\u00f3n al ciudadano a trav\u00e9s de IA y chatbots.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Evaluaci\u00f3n de Pol\u00edticas:<\/strong> An\u00e1lisis del impacto socioecon\u00f3mico de los programas p\u00fablicos.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Gesti\u00f3n de Riesgos:<\/strong> Detecci\u00f3n temprana de crisis de salud o seguridad p\u00fablica.<\/li>\n <\/ul>`,\n chartData: {\n labels: ['Opini\u00f3n', 'Servicios', 'Pol\u00edticas', 'Riesgos'],\n datasets: [{\n label: '\u00c1reas de Aplicaci\u00f3n',\n data: [88, 92, 85, 95],\n backgroundColor: ['#3b82f6', '#10b981', '#f59e0b', '#ef4444'],\n }]\n }\n },\n politicos: {\n title: 'Pol\u00edticos y Campa\u00f1as',\n icon: '\ud83d\uddf3\ufe0f',\n info: `\n <h4 class=\"text-2xl font-bold mb-4 text-slate-900\">Para Pol\u00edticos y Campa\u00f1as<\/h4>\n <p class=\"mb-4 text-slate-600\">Es un componente cr\u00edtico para el \u00e9xito. Permite un nivel de precisi\u00f3n estrat\u00e9gica antes inalcanzable, pasando de la persuasi\u00f3n a gran escala a un compromiso dirigido y basado en datos.<\/p>\n <ul class=\"space-y-3 text-slate-600\">\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Monitoreo de Campa\u00f1a:<\/strong> Seguimiento del gasto publicitario y la cobertura medi\u00e1tica propia y rival.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>An\u00e1lisis de Votantes:<\/strong> Comprensi\u00f3n de lo que resuena con el electorado para ajustar mensajes.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Estrategia de Mensajes:<\/strong> Identificaci\u00f3n de los mensajes m\u00e1s efectivos para diferentes demograf\u00edas.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Gesti\u00f3n de Crisis:<\/strong> Respuesta r\u00e1pida y coordinada ante eventos inesperados o ataques.<\/li>\n <\/ul>`,\n chartData: {\n labels: ['Monitoreo', 'An\u00e1lisis Votantes', 'Mensajes', 'Gesti\u00f3n Crisis'],\n datasets: [{\n label: 'Importancia en Campa\u00f1a',\n data: [95, 90, 92, 85],\n backgroundColor: ['#3b82f6', '#10b981', '#f59e0b', '#ef4444'],\n }]\n }\n },\n futbol: {\n title: 'Clubes de F\u00fatbol',\n icon: '\u26bd',\n info: `\n <h4 class=\"text-2xl font-bold mb-4 text-slate-900\">Para Clubes de F\u00fatbol<\/h4>\n <p class=\"mb-4 text-slate-600\">Est\u00e1 transformando tanto el rendimiento en el campo como el \u00e9xito comercial fuera de \u00e9l, yendo m\u00e1s all\u00e1 del scouting subjetivo hacia decisiones objetivas y basadas en datos.<\/p>\n <ul class=\"space-y-3 text-slate-600\">\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Rendimiento y Scouting:<\/strong> An\u00e1lisis de datos para identificar talento y optimizar el rendimiento.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>An\u00e1lisis T\u00e1ctico:<\/strong> Estudio de rivales para dise\u00f1ar estrategias de juego efectivas.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Engagement de Aficionados:<\/strong> Optimizaci\u00f3n del marketing para mejorar la experiencia del seguidor.<\/li>\n <li class=\"flex items-start\"><span class=\"text-blue-600 mr-2 text-lg\">\u25cf<\/span><strong>Valoraci\u00f3n de Patrocinios:<\/strong> Medici\u00f3n del ROI de los patrocinios para maximizar ingresos.<\/li>\n <\/ul>`,\n chartData: {\n labels: ['Rendimiento', 'T\u00e1ctica', 'Aficionados', 'Patrocinios'],\n datasets: [{\n label: 'Impacto en el Club',\n data: [90, 85, 88, 92],\n backgroundColor: ['#3b82f6', '#10b981', '#f59e0b', '#a855f7'],\n }]\n }\n }\n }\n };\n \n let mediaCoverageChart, sentimentChart, sectorChart;\n\n function renderMediaCoverageChart() {\n const ctx = document.getElementById('mediaCoverageChart').getContext('2d');\n if (mediaCoverageChart) mediaCoverageChart.destroy();\n mediaCoverageChart = new Chart(ctx, {\n type: 'doughnut',\n data: data.mediaCoverage,\n options: {\n responsive: true,\n maintainAspectRatio: false,\n plugins: {\n legend: {\n position: 'bottom',\n labels: {\n font: {\n size: 14\n }\n }\n },\n tooltip: {\n callbacks: {\n label: (c) => `${c.label}: ${c.raw}%`\n },\n titleFont: {\n size: 14\n },\n bodyFont: {\n size: 14\n }\n }\n }\n }\n });\n }\n\n function renderSentimentChart() {\n const ctx = document.getElementById('sentimentChart').getContext('2d');\n if (sentimentChart) sentimentChart.destroy();\n sentimentChart = new Chart(ctx, {\n type: 'doughnut',\n data: data.sentiment,\n options: {\n responsive: true,\n maintainAspectRatio: false,\n plugins: {\n legend: {\n position: 'bottom',\n labels: {\n font: {\n size: 14\n }\n }\n },\n tooltip: {\n callbacks: {\n label: (c) => `${c.label}: ${c.raw}%`\n },\n titleFont: {\n size: 14\n },\n bodyFont: {\n size: 14\n }\n }\n },\n cutout: '50%'\n }\n });\n }\n\n const sectorButtonsContainer = document.getElementById('sector-buttons');\n const sectorInfoContainer = document.getElementById('sector-info');\n const sectorChartTitle = document.getElementById('sector-chart-title');\n \n Object.keys(data.sectors).forEach((key, index) => {\n const sector = data.sectors[key];\n const button = document.createElement('button');\n button.className = 'sector-btn text-sm md:text-base font-semibold py-2 px-4 rounded-full bg-white shadow-sm hover:bg-blue-100';\n button.innerHTML = `<span class=\"mr-2\">${sector.icon}<\/span>${sector.title}`;\n button.dataset.sector = key;\n if (index === 0) {\n button.classList.add('active');\n }\n sectorButtonsContainer.appendChild(button);\n });\n \n function updateSectorView(sectorKey) {\n const sectorData = data.sectors[sectorKey];\n \n sectorInfoContainer.innerHTML = sectorData.info;\n sectorChartTitle.textContent = `Principales Aplicaciones: ${sectorData.title}`;\n\n const ctx = document.getElementById('sectorChart').getContext('2d');\n if(sectorChart) sectorChart.destroy();\n sectorChart = new Chart(ctx, {\n type: 'bar',\n data: sectorData.chartData,\n options: {\n indexAxis: 'y',\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n x: {\n beginAtZero: true,\n max: 100,\n grid: {\n display: false\n },\n ticks: {\n display: false\n }\n },\n y: {\n grid: {\n display: false\n }\n }\n },\n plugins: {\n legend: { display: false },\n tooltip: {\n callbacks: {\n label: (c) => ` Nivel de Impacto: ${c.raw}`\n },\n titleFont: {\n size: 14\n },\n bodyFont: {\n size: 14\n }\n }\n }\n }\n });\n \n document.querySelectorAll('.sector-btn').forEach(btn => {\n btn.classList.toggle('active', btn.dataset.sector === sectorKey);\n });\n }\n \n sectorButtonsContainer.addEventListener('click', (e) => {\n const button = e.target.closest('.sector-btn');\n if (button) {\n const sectorKey = button.dataset.sector;\n updateSectorView(sectorKey);\n }\n });\n\n renderMediaCoverageChart();\n renderSentimentChart();\n updateSectorView('empresas');\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<!DOCTYPE html>\n<html lang=\"es\" class=\"scroll-smooth\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Explorador Interactivo de Informes de Inteligencia de Medios<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n <!-- Chosen Palette: Warm Neutral Harmony -->\n <!-- Application Structure Plan: The SPA uses a solution-focused architecture. Instead of a linear report, it starts with a \"What is your goal?\" section that directs users to the most relevant service. The core of the app is an interactive catalog where users can select a report type and see its details (metrics, value proposition) and a representative data visualization update dynamically. This is more usable than a static document because it allows users to quickly compare services and understand their specific benefits without reading the entire report. Sections on value, customization, and technology are included to provide deeper context, accessed via a sticky navigation bar. -->\n <!-- Visualization & Content Choices: Report Info -> Goal -> Viz\/Presentation Method -> Interaction -> Justification -> Library\/Method. 1. Sentiment Analysis -> Understand perception -> Doughnut Chart -> Click filter -> Visualizes proportions easily -> Chart.js. 2. Competitor Analysis -> Compare performance -> Bar Chart -> Click filter -> Direct comparison of Share of Voice -> Chart.js. 3. Campaign Analysis -> Measure KPIs -> Radar Chart -> Click filter -> Shows multidimensional performance -> Chart.js. 4. Crisis Management -> Track negative mentions -> Line Chart -> Click filter -> Shows trends over time -> Chart.js. All other reports use appropriate chart types (bar, line) to represent their key metrics. Textual data is organized into interactive tabs for clarity and to avoid overwhelming the user. The primary interaction is a central filter\/selection mechanism that updates all content views (chart + text), creating a cohesive and intuitive dashboard-like experience. -->\n <!-- CONFIRMATION: NO SVG graphics used. NO Mermaid JS used. -->\n <style>\n body {\n font-family: 'Inter', sans-serif;\n }\n .chart-container {\n position: relative;\n width: 100%;\n max-width: 600px;\n margin-left: auto;\n margin-right: auto;\n height: 300px;\n max-height: 40vh;\n }\n @media (min-width: 768px) {\n .chart-container {\n height: 350px;\n }\n }\n .tab-button.active {\n border-color: #0d9488;\n color: #0d9488;\n background-color: #f0fdfa;\n }\n .report-button.active {\n background-color: #0d9488;\n color: white;\n transform: scale(1.05);\n }\n .goal-card:hover {\n transform: translateY(-5px);\n box-shadow: 0 10px 15px -3px rgb(0 0 0 \/ 0.1), 0 4px 6px -4px rgb(0 0 0 \/ 0.1);\n }\n <\/style>\n<\/head>\n<body class=\"bg-stone-50 text-gray-800\">\n\n <header class=\"bg-white\/80 backdrop-blur-lg sticky top-0 z-50 shadow-sm\">\n <nav class=\"container mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center\">\n <h1 class=\"text-xl md:text-2xl font-bold text-teal-700\">Inteligencia de Medios<\/h1>\n <div class=\"hidden md:flex items-center space-x-6 text-gray-600\">\n <a href=\"#informes\" class=\"hover:text-teal-600 transition-colors\">Nuestros Informes<\/a>\n <a href=\"#valor\" class=\"hover:text-teal-600 transition-colors\">Propuesta de Valor<\/a>\n <a href=\"#personalizacion\" class=\"hover:text-teal-600 transition-colors\">Personalizaci\u00f3n<\/a>\n <a href=\"#tecnologia\" class=\"hover:text-teal-600 transition-colors\">Tecnolog\u00eda<\/a>\n <\/div>\n <div class=\"md:hidden\">\n <select id=\"mobile-nav\" class=\"border border-gray-300 rounded-md p-2 text-sm\">\n <option value=\"#home\">Inicio<\/option>\n <option value=\"#informes\">Informes<\/option>\n <option value=\"#valor\">Valor<\/option>\n <option value=\"#personalizacion\">Personalizaci\u00f3n<\/option>\n <option value=\"#tecnologia\">Tecnolog\u00eda<\/option>\n <\/select>\n <\/div>\n <\/nav>\n <\/header>\n\n <main id=\"home\" class=\"container mx-auto px-4 sm:px-6 lg:px-8 py-8 md:py-16\">\n\n <section class=\"text-center mb-16 md:mb-24\">\n <h2 class=\"text-3xl md:text-5xl font-bold mb-4 text-gray-900\">Transformamos Datos en Decisiones Estrat\u00e9gicas<\/h2>\n <p class=\"max-w-3xl mx-auto text-lg text-gray-600\">Nuestra inteligencia de medios va m\u00e1s all\u00e1 del monitoreo. Le damos las herramientas para comprender su entorno, anticipar tendencias y actuar con confianza, convirtiendo la informaci\u00f3n en una ventaja competitiva.<\/p>\n <\/section>\n\n <section id=\"informes\" class=\"mb-16 md:mb-24\">\n <div class=\"text-center mb-12\">\n <h3 class=\"text-2xl md:text-3xl font-bold text-gray-900\">\u00bfCu\u00e1l es tu objetivo principal?<\/h3>\n <p class=\"max-w-2xl mx-auto mt-2 text-gray-600\">Selecciona el reto de negocio que quieres abordar. Te mostraremos el informe ideal para alcanzar tus metas.<\/p>\n <\/div>\n <div class=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6\">\n <div class=\"goal-card bg-white p-6 rounded-xl shadow-md cursor-pointer border border-transparent hover:border-teal-500 transition-all duration-300\" data-report=\"sentimiento\">\n <div class=\"text-3xl mb-3\">\ud83e\udd14<\/div>\n <h4 class=\"font-bold text-lg mb-2\">Entender mi reputaci\u00f3n<\/h4>\n <p class=\"text-sm text-gray-600\">Evaluar la percepci\u00f3n p\u00fablica y el tono de las menciones sobre mi marca.<\/p>\n <\/div>\n <div class=\"goal-card bg-white p-6 rounded-xl shadow-md cursor-pointer border border-transparent hover:border-teal-500 transition-all duration-300\" data-report=\"campanas\">\n <div class=\"text-3xl mb-3\">\ud83c\udfaf<\/div>\n <h4 class=\"font-bold text-lg mb-2\">Medir mis campa\u00f1as<\/h4>\n <p class=\"text-sm text-gray-600\">Evaluar el impacto, alcance y ROI de mis acciones de comunicaci\u00f3n.<\/p>\n <\/div>\n <div class=\"goal-card bg-white p-6 rounded-xl shadow-md cursor-pointer border border-transparent hover:border-teal-500 transition-all duration-300\" data-report=\"competencia\">\n <div class=\"text-3xl mb-3\">\ud83e\uddd0<\/div>\n <h4 class=\"font-bold text-lg mb-2\">Analizar a la competencia<\/h4>\n <p class=\"text-sm text-gray-600\">Comparar mi presencia y estrategia con la de mis competidores.<\/p>\n <\/div>\n <div class=\"goal-card bg-white p-6 rounded-xl shadow-md cursor-pointer border border-transparent hover:border-teal-500 transition-all duration-300\" data-report=\"crisis\">\n <div class=\"text-3xl mb-3\">\ud83d\udea8<\/div>\n <h4 class=\"font-bold text-lg mb-2\">Anticipar una crisis<\/h4>\n <p class=\"text-sm text-gray-600\">Detectar tempranamente riesgos reputacionales y actuar con rapidez.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"mt-16 bg-white p-6 md:p-8 rounded-2xl shadow-xl\">\n <div class=\"mb-8\">\n <p class=\"text-center text-sm text-gray-500 mb-4\">O explora nuestro cat\u00e1logo completo de informes:<\/p>\n <div id=\"report-selector\" class=\"flex flex-wrap justify-center gap-2 md:gap-4\">\n <\/div>\n <\/div>\n\n <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-8 md:gap-12 items-center\">\n <div class=\"lg:pr-8\">\n <h4 id=\"report-title\" class=\"text-2xl font-bold mb-2 text-teal-700\"><\/h4>\n <p id=\"report-purpose\" class=\"text-gray-600 mb-6\"><\/p>\n \n <div>\n <div class=\"border-b border-gray-200 mb-4\">\n <nav id=\"tab-selector\" class=\"flex -mb-px space-x-4\" aria-label=\"Tabs\">\n <\/nav>\n <\/div>\n\n <div id=\"tab-content\">\n <\/div>\n <\/div>\n <\/div>\n <div class=\"chart-container\">\n <canvas id=\"reportChart\"><\/canvas>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <section id=\"valor\" class=\"py-16 md:py-24 bg-teal-50\/50 rounded-2xl\">\n <div class=\"text-center mb-12\">\n <h3 class=\"text-2xl md:text-3xl font-bold text-gray-900\">M\u00e1s All\u00e1 de los Datos: Valor Accionable y ROI<\/h3>\n <p class=\"max-w-3xl mx-auto mt-2 text-gray-600\">Nuestros informes no solo presentan datos, sino que generan conocimiento que impulsa el negocio. Conectamos la actividad medi\u00e1tica con resultados tangibles.<\/p>\n <\/div>\n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-8 text-center max-w-5xl mx-auto\">\n <div class=\"bg-white p-6 rounded-xl shadow-sm\">\n <div class=\"text-3xl text-teal-600 mb-3\">\ud83d\udca1<\/div>\n <h4 class=\"font-semibold text-lg mb-2\">Mejores Decisiones<\/h4>\n <p class=\"text-sm text-gray-600\">Tome decisiones informadas basadas en un profundo entendimiento de su mercado y audiencia.<\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-sm\">\n <div class=\"text-3xl text-teal-600 mb-3\">\ud83d\udcc8<\/div>\n <h4 class=\"font-semibold text-lg mb-2\">Optimizaci\u00f3n de Inversi\u00f3n<\/h4>\n <p class=\"text-sm text-gray-600\">Maximice el retorno de su inversi\u00f3n en comunicaci\u00f3n, marketing y RRPP.<\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-sm\">\n <div class=\"text-3xl text-teal-600 mb-3\">\ud83d\udee1\ufe0f<\/div>\n <h4 class=\"font-semibold text-lg mb-2\">Ventaja Competitiva<\/h4>\n <p class=\"text-sm text-gray-600\">Antic\u00edpese a los movimientos de la competencia y descubra nuevas oportunidades de mercado.<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n <section id=\"personalizacion\" class=\"py-16 md:py-24\">\n <div class=\"text-center mb-12\">\n <h3 class=\"text-2xl md:text-3xl font-bold text-gray-900\">Un Servicio Flexible, Adaptado a Ti<\/h3>\n <p class=\"max-w-3xl mx-auto mt-2 text-gray-600\">Entendemos que cada cliente es \u00fanico. Ofrecemos una completa flexibilidad para adaptar nuestros informes a tus necesidades espec\u00edficas.<\/p>\n <\/div>\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6\">\n <div class=\"bg-white p-6 rounded-xl shadow-sm border-t-4 border-teal-500\">\n <h4 class=\"font-semibold text-lg mb-2\">Alcance Adaptable<\/h4>\n <p class=\"text-sm text-gray-600\">Desde un monitoreo global hasta un enfoque en medios locales espec\u00edficos, t\u00fa defines el \u00e1mbito.<\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-sm border-t-4 border-teal-500\">\n <h4 class=\"font-semibold text-lg mb-2\">Fuentes a Medida<\/h4>\n <p class=\"text-sm text-gray-600\">Incorporamos fuentes de nicho, blogs o foros especializados seg\u00fan tus requerimientos.<\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-sm border-t-4 border-teal-500\">\n <h4 class=\"font-semibold text-lg mb-2\">M\u00e9tricas Personalizadas<\/h4>\n <p class=\"text-sm text-gray-600\">Creamos KPIs que se alinean directamente con los objetivos \u00fanicos de tu negocio.<\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-sm border-t-4 border-teal-500\">\n <h4 class=\"font-semibold text-lg mb-2\">Frecuencia Flexible<\/h4>\n <p class=\"text-sm text-gray-600\">Entregas diarias, semanales, mensuales o puntuales, seg\u00fan la urgencia de tu necesidad.<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n <section id=\"tecnologia\" class=\"py-16 md:py-24 bg-gray-800 text-white rounded-2xl\">\n <div class=\"text-center mb-12 px-4\">\n <h3 class=\"text-2xl md:text-3xl font-bold\">Potenciado por Tecnolog\u00eda de Vanguardia<\/h3>\n <p class=\"max-w-3xl mx-auto mt-2 text-gray-300\">Utilizamos Inteligencia Artificial y Machine Learning para ir del monitoreo reactivo a la inteligencia proactiva y prescriptiva.<\/p>\n <\/div>\n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-8 max-w-5xl mx-auto px-4\">\n <div class=\"text-center\">\n <div class=\"text-4xl mb-3\">\ud83d\udd2e<\/div>\n <h4 class=\"font-semibold text-lg mb-2\">An\u00e1lisis Predictivo<\/h4>\n <p class=\"text-sm text-gray-400\">Anticipamos tendencias emergentes y el potencial de viralidad de las conversaciones para que puedas actuar antes que nadie.<\/p>\n <\/div>\n <div class=\"text-center\">\n <div class=\"text-4xl mb-3\">\ud83d\udd04<\/div>\n <h4 class=\"font-semibold text-lg mb-2\">Visi\u00f3n 360\u00b0<\/h4>\n <p class=\"text-sm text-gray-400\">Integramos datos de todas las fuentes (online, offline, redes sociales, TV, radio) para ofrecerte una narrativa unificada y completa.<\/p>\n <\/div>\n <div class=\"text-center\">\n <div class=\"text-4xl mb-3\">\ud83e\udd16<\/div>\n <h4 class=\"font-semibold text-lg mb-2\">Personalizaci\u00f3n con IA<\/h4>\n <p class=\"text-sm text-gray-6400\">Nuestra IA adapta el contenido y las recomendaciones a tus preferencias, ofreciendo insights de m\u00e1xima relevancia a gran escala.<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n <\/main>\n\n <footer class=\"bg-gray-800 text-white\">\n <div class=\"container mx-auto px-4 sm:px-6 lg:px-8 py-8 text-center\">\n <p>© 2024 Inteligencia de Medios. Todos los derechos reservados.<\/p>\n <p class=\"text-sm text-gray-400 mt-2\">Transformando datos en decisiones estrat\u00e9gicas.<\/p>\n <\/div>\n <\/footer>\n\n <script>\n document.addEventListener('DOMContentLoaded', function () {\n const reportData = {\n sentimiento: {\n name: 'An\u00e1lisis de Sentimiento',\n title: 'An\u00e1lisis de Sentimiento de Marca',\n purpose: 'Eval\u00faa la percepci\u00f3n p\u00fablica de tu marca, producto o servicio, identificando el tono predominante (positivo, negativo o neutro) de las menciones en los medios y observando su evoluci\u00f3n en el tiempo.',\n tabs: {\n metricas: {\n name: 'M\u00e9tricas Clave',\n content: `<ul>\n <li class=\"mb-2\"><strong>N\u00famero de Menciones:<\/strong> Cantidad total de referencias.<\/li>\n <li class=\"mb-2\"><strong>Sentimiento (Tonalidad):<\/strong> % de menciones positivas, negativas y neutras.<\/li>\n <li class=\"mb-2\"><strong>Share of Voice (SoV):<\/strong> Cuota de conversaci\u00f3n frente a competidores.<\/li>\n <li class=\"mb-2\"><strong>Alcance Potencial:<\/strong> Audiencia estimada expuesta a las menciones.<\/li>\n <li><strong>Engagement:<\/strong> Interacciones generadas (likes, compartidos, etc.).<\/li>\n <\/ul>`\n },\n analisis: {\n name: 'An\u00e1lisis y Fuentes',\n content: `<p><strong>Tipo de An\u00e1lisis:<\/strong> Principalmente cuantitativo y cualitativo, con un enfoque diagn\u00f3stico para entender las causas de los cambios de sentimiento.<\/p>\n <p class=\"mt-2\"><strong>Fuentes:<\/strong> Redes Sociales (Twitter, Instagram, etc.), Prensa Online\/Offline, TV y Radio.<\/p>`\n },\n valor: {\n name: 'Tu Valor (PVU)',\n content: `<p><strong>Problema que resuelve:<\/strong> La incertidumbre sobre si la percepci\u00f3n de tu marca es positiva o negativa.<\/p>\n <p class=\"mt-2\"><strong>Beneficio principal:<\/strong> Gesti\u00f3n proactiva de la reputaci\u00f3n y optimizaci\u00f3n de estrategias de comunicaci\u00f3n.<\/p>\n <p class=\"mt-2\"><strong>Diferenciaci\u00f3n:<\/strong> IA avanzada para mayor granularidad y precisi\u00f3n en la clasificaci\u00f3n del tono.<\/p>`\n }\n },\n chartConfig: {\n type: 'doughnut',\n data: {\n labels: ['Positivo', 'Negativo', 'Neutro'],\n datasets: [{\n label: 'Sentimiento de Marca',\n data: [65, 15, 20],\n backgroundColor: ['#10b981', '#ef4444', '#6b7280'],\n hoverOffset: 4\n }]\n },\n options: {\n plugins: { legend: { position: 'top' } }\n }\n }\n },\n cobertura: {\n name: 'Cobertura Medi\u00e1tica',\n title: 'Monitoreo de Cobertura Medi\u00e1tica',\n purpose: 'Cuantifica y cualifica la presencia de tu marca, producto o tema en los medios de comunicaci\u00f3n, tanto tradicionales como digitales, para evaluar su repercusi\u00f3n y alcance.',\n tabs: {\n metricas: {\n name: 'M\u00e9tricas Clave',\n content: `<ul>\n <li class=\"mb-2\"><strong>Cantidad de Noticias:<\/strong> N\u00famero de apariciones en medios.<\/li>\n <li class=\"mb-2\"><strong>Audiencia Agregada:<\/strong> Suma de la audiencia potencial alcanzada.<\/li>\n <li class=\"mb-2\"><strong>Valor Econ\u00f3mico Equivalente (AVE):<\/strong> Valor publicitario estimado de la cobertura.<\/li>\n <li><strong>Tipos de Cobertura:<\/strong> Clasificaci\u00f3n por medio, grupo o relevancia.<\/li>\n <\/ul>`\n },\n analisis: {\n name: 'An\u00e1lisis y Fuentes',\n content: `<p><strong>Tipo de An\u00e1lisis:<\/strong> Cuantitativo (conteo, AVE) y cualitativo (tratamiento del contenido, mensajes clave).<\/p>\n <p class=\"mt-2\"><strong>Fuentes:<\/strong> Prensa Impresa, Prensa Online, Radio, TV, Blogs y Foros.<\/p>`\n },\n valor: {\n name: 'Tu Valor (PVU)',\n content: `<p><strong>Problema que resuelve:<\/strong> La dificultad para cuantificar el impacto real y el ROI de las acciones de RRPP.<\/p>\n <p class=\"mt-2\"><strong>Beneficio principal:<\/strong> Justificaci\u00f3n clara de la inversi\u00f3n y optimizaci\u00f3n de futuras estrategias.<\/p>\n <p class=\"mt-2\"><strong>Diferenciaci\u00f3n:<\/strong> Cobertura exhaustiva, incluyendo fuentes locales exclusivas y an\u00e1lisis contextualizado.<\/p>`\n }\n },\n chartConfig: {\n type: 'bar',\n data: {\n labels: ['Prensa Online', 'Prensa Impresa', 'TV', 'Radio'],\n datasets: [{\n label: 'N\u00famero de Menciones',\n data: [120, 45, 15, 25],\n backgroundColor: '#0d9488'\n }]\n },\n options: {\n scales: { y: { beginAtZero: true } },\n plugins: { legend: { display: false } }\n }\n }\n },\n crisis: {\n name: 'Gesti\u00f3n de Crisis',\n title: 'Detecci\u00f3n y Gesti\u00f3n de Crisis de Reputaci\u00f3n',\n purpose: 'Identifica y alerta de manera temprana sobre menciones negativas o situaciones con potencial de escalar a una crisis de reputaci\u00f3n, permitiendo una respuesta \u00e1gil para mitigar el da\u00f1o.',\n tabs: {\n metricas: {\n name: 'M\u00e9tricas Clave',\n content: `<ul>\n <li class=\"mb-2\"><strong>Alertas de Crisis:<\/strong> Notificaciones inmediatas sobre picos negativos.<\/li>\n <li class=\"mb-2\"><strong>Evoluci\u00f3n de Menciones Negativas:<\/strong> Seguimiento en tiempo real del volumen.<\/li>\n <li class=\"mb-2\"><strong>Identificaci\u00f3n de Emisores Clave:<\/strong> Detecci\u00f3n de perfiles que amplifican la crisis.<\/li>\n <li><strong>Velocidad de Propagaci\u00f3n:<\/strong> Medici\u00f3n de la viralidad de la informaci\u00f3n.<\/li>\n <\/ul>`\n },\n analisis: {\n name: 'An\u00e1lisis y Fuentes',\n content: `<p><strong>Tipo de An\u00e1lisis:<\/strong> Predictivo (anticipar escalada), diagn\u00f3stico (determinar causas) y cuantitativo\/cualitativo.<\/p>\n <p class=\"mt-2\"><strong>Fuentes:<\/strong> Redes Sociales (en tiempo real), Medios Digitales, Blogs y Foros.<\/p>`\n },\n valor: {\n name: 'Tu Valor (PVU)',\n content: `<p><strong>Problema que resuelve:<\/strong> La necesidad cr\u00edtica de detectar una amenaza a la reputaci\u00f3n antes de que sea incontrolable.<\/p>\n <p class=\"mt-2\"><strong>Beneficio principal:<\/strong> Minimizaci\u00f3n del da\u00f1o a la imagen de marca y protecci\u00f3n del valor de la empresa.<\/p>\n <p class=\"mt-2\"><strong>Diferenciaci\u00f3n:<\/strong> Sistema de alertas predictivas con IA que anticipa el potencial de viralidad.<\/p>`\n }\n },\n chartConfig: {\n type: 'line',\n data: {\n labels: ['D\u00eda 1', 'D\u00eda 2', 'D\u00eda 3', 'D\u00eda 4', 'D\u00eda 5', 'D\u00eda 6', 'D\u00eda 7'],\n datasets: [{\n label: 'Evoluci\u00f3n de Menciones Negativas',\n data: [5, 15, 120, 350, 180, 75, 30],\n borderColor: '#ef4444',\n backgroundColor: '#ef444420',\n fill: true,\n tension: 0.2\n }]\n },\n options: {\n scales: { y: { beginAtZero: true } },\n plugins: { legend: { position: 'top' } }\n }\n }\n },\n campanas: {\n name: 'An\u00e1lisis de Campa\u00f1as',\n title: 'An\u00e1lisis de Campa\u00f1as de Comunicaci\u00f3n',\n purpose: 'Eval\u00faa el impacto y la efectividad de tus campa\u00f1as de marketing, RRPP o publicidad, midiendo su alcance, engagement y retorno de la inversi\u00f3n para optimizar futuras acciones.',\n tabs: {\n metricas: {\n name: 'M\u00e9tricas Clave',\n content: `<ul>\n <li class=\"mb-2\"><strong>Alcance (Reach) e Impresiones:<\/strong> Audiencia potencial y visualizaciones.<\/li>\n <li class=\"mb-2\"><strong>Engagement:<\/strong> Total de interacciones generadas.<\/li>\n <li class=\"mb-2\"><strong>Menciones de Hashtags:<\/strong> Seguimiento de palabras clave de la campa\u00f1a.<\/li>\n <li class=\"mb-2\"><strong>Share of Voice de Campa\u00f1a:<\/strong> Cuota de conversaci\u00f3n generada.<\/li>\n <li><strong>ROI de Comunicaci\u00f3n:<\/strong> Retorno de la inversi\u00f3n en RRPP.<\/li>\n <\/ul>`\n },\n analisis: {\n name: 'An\u00e1lisis y Fuentes',\n content: `<p><strong>Tipo de An\u00e1lisis:<\/strong> Cuantitativo (medici\u00f3n de KPIs), comparativo (frente a benchmarks) y cualitativo (percepci\u00f3n de mensajes).<\/p>\n <p class=\"mt-2\"><strong>Fuentes:<\/strong> Redes Sociales, Prensa, TV, Radio y datos internos de la campa\u00f1a.<\/p>`\n },\n valor: {\n name: 'Tu Valor (PVU)',\n content: `<p><strong>Problema que resuelve:<\/strong> El desconocimiento sobre si una campa\u00f1a llega al p\u00fablico correcto y genera un retorno real.<\/p>\n <p class=\"mt-2\"><strong>Beneficio principal:<\/strong> Optimizaci\u00f3n de la inversi\u00f3n en comunicaci\u00f3n y marketing con datos claros sobre el rendimiento.<\/p>\n <p class=\"mt-2\"><strong>Diferenciaci\u00f3n:<\/strong> Integraci\u00f3n de m\u00e9tricas de medios propios y ganados con recomendaciones predictivas.<\/p>`\n }\n },\n chartConfig: {\n type: 'radar',\n data: {\n labels: ['Alcance', 'Engagement', 'Conversiones', 'Sentimiento Positivo', 'Share of Voice'],\n datasets: [{\n label: 'Rendimiento de Campa\u00f1a',\n data: [85, 70, 60, 90, 75],\n fill: true,\n backgroundColor: 'rgba(13, 148, 136, 0.2)',\n borderColor: 'rgb(13, 148, 136)',\n pointBackgroundColor: 'rgb(13, 148, 136)',\n pointBorderColor: '#fff',\n pointHoverBackgroundColor: '#fff',\n pointHoverBorderColor: 'rgb(13, 148, 136)'\n }]\n },\n options: {\n elements: {\n line: {\n borderWidth: 3\n }\n },\n plugins: { legend: { position: 'top' } }\n }\n }\n },\n competencia: {\n name: 'Estudio de Competencia',\n title: 'Estudio de la Competencia',\n purpose: 'Proporciona una visi\u00f3n comparativa de la presencia, reputaci\u00f3n y estrategias de comunicaci\u00f3n de tus competidores, permitiendo identificar sus fortalezas, debilidades y oportunidades.',\n tabs: {\n metricas: {\n name: 'M\u00e9tricas Clave',\n content: `<ul>\n <li class=\"mb-2\"><strong>Share of Voice Competitivo:<\/strong> Cuota de conversaci\u00f3n comparada.<\/li>\n <li class=\"mb-2\"><strong>Menciones de Marca Competidoras:<\/strong> Volumen y evoluci\u00f3n de sus menciones.<\/li>\n <li class=\"mb-2\"><strong>Sentimiento Competitivo:<\/strong> Tono de las menciones de la competencia.<\/li>\n <li><strong>Temas Clave y Mensajes:<\/strong> Narrativas que dominan su comunicaci\u00f3n.<\/li>\n <\/ul>`\n },\n analisis: {\n name: 'An\u00e1lisis y Fuentes',\n content: `<p><strong>Tipo de An\u00e1lisis:<\/strong> Predominantemente comparativo, con an\u00e1lisis cuantitativos y cualitativos para medir datos y contenido.<\/p>\n <p class=\"mt-2\"><strong>Fuentes:<\/strong> Prensa, Redes Sociales, TV, Radio, Medios Especializados.<\/p>`\n },\n valor: {\n name: 'Tu Valor (PVU)',\n content: `<p><strong>Problema que resuelve:<\/strong> La falta de inteligencia de mercado sobre las acciones y el posicionamiento de la competencia.<\/p>\n <p class=\"mt-2\"><strong>Beneficio principal:<\/strong> Obtener una ventaja competitiva al entender sus estrategias y detectar oportunidades.<\/p>\n <p class=\"mt-2\"><strong>Diferenciaci\u00f3n:<\/strong> An\u00e1lisis del SoV por tema, no solo por volumen, para una comprensi\u00f3n profunda de su narrativa.<\/p>`\n }\n },\n chartConfig: {\n type: 'bar',\n data: {\n labels: ['Sector', 'Mi Marca', 'Competidor A', 'Competidor B'],\n datasets: [{\n label: 'Share of Voice (%)',\n data: [100, 25, 20, 15],\n backgroundColor: ['#9ca3af','#0d9488', '#0ea5e9', '#f97316']\n }]\n },\n options: {\n indexAxis: 'y',\n scales: { x: { beginAtZero: true } },\n plugins: { legend: { display: false } }\n }\n }\n },\n influencers: {\n name: 'Identificaci\u00f3n de Influencers',\n title: 'Identificaci\u00f3n de L\u00edderes de Opini\u00f3n\/Influencers',\n purpose: 'Detecta y analiza perfiles clave (individuos, medios, organizaciones) con alta capacidad de influencia y viralidad en temas espec\u00edficos para facilitar colaboraciones estrat\u00e9gicas.',\n tabs: {\n metricas: { name: 'M\u00e9tricas Clave', content: `<ul><li class=\"mb-2\"><strong>Puntuaci\u00f3n de Influencia:<\/strong> Impacto de un perfil en la conversaci\u00f3n.<\/li><li class=\"mb-2\"><strong>Alcance (Reach):<\/strong> Tama\u00f1o de la audiencia potencial.<\/li><li class=\"mb-2\"><strong>Engagement Generado:<\/strong> Nivel de interacci\u00f3n que provocan.<\/li><li><strong>Viralidad de Contenido:<\/strong> Capacidad de generar difusi\u00f3n masiva.<\/li><\/ul>` },\n analisis: { name: 'An\u00e1lisis y Fuentes', content: `<p><strong>Tipo de An\u00e1lisis:<\/strong> Cualitativo (credibilidad, tono) y cuantitativo (alcance, engagement), incluyendo mapeo de redes de conexi\u00f3n.<\/p><p class=\"mt-2\"><strong>Fuentes:<\/strong> Redes Sociales (Twitter, Instagram, TikTok, etc.), Blogs y Foros.<\/p>` },\n valor: { name: 'Tu Valor (PVU)', content: `<p><strong>Problema que resuelve:<\/strong> La dificultad de encontrar a los \"voceros\" m\u00e1s adecuados y efectivos para la marca.<\/p><p class=\"mt-2\"><strong>Beneficio principal:<\/strong> Optimizaci\u00f3n de las estrategias de RRPP y marketing de influencers.<\/p><p class=\"mt-2\"><strong>Diferenciaci\u00f3n:<\/strong> An\u00e1lisis que va m\u00e1s all\u00e1 de los seguidores, midiendo el engagement real y la relevancia tem\u00e1tica.<\/p>` }\n },\n chartConfig: {\n type: 'bar',\n data: {\n labels: ['Influencer A', 'Influencer B', 'Influencer C', 'Influencer D'],\n datasets: [{\n label: 'Puntuaci\u00f3n de Influencia',\n data: [92, 85, 78, 65],\n backgroundColor: '#0ea5e9',\n }]\n },\n options: { scales: { y: { beginAtZero: true, max: 100 } }, plugins: { legend: { display: false } } }\n }\n },\n tendencias: {\n name: 'An\u00e1lisis de Tendencias',\n title: 'An\u00e1lisis de Tendencias Sectoriales',\n purpose: 'Identifica temas emergentes, cambios en la conversaci\u00f3n y patrones de comportamiento en tu sector, permitiendo anticipar desarrollos y adaptar estrategias proactivamente.',\n tabs: {\n metricas: { name: 'M\u00e9tricas Clave', content: `<ul><li class=\"mb-2\"><strong>Volumen de Conversaci\u00f3n por Tema:<\/strong> Cantidad de menciones de una tendencia.<\/li><li class=\"mb-2\"><strong>Evoluci\u00f3n de Temas Clave:<\/strong> Crecimiento o declive de la relevancia de asuntos.<\/li><li class=\"mb-2\"><strong>Sentimiento sobre Tendencias:<\/strong> Percepci\u00f3n general de temas emergentes.<\/li><li><strong>\"Hot Topics\":<\/strong> Asuntos con mayor pico de inter\u00e9s.<\/li><\/ul>` },\n analisis: { name: 'An\u00e1lisis y Fuentes', content: `<p><strong>Tipo de An\u00e1lisis:<\/strong> Fuertemente predictivo y descriptivo, utilizando t\u00e9cnicas de data mining para obtener patrones.<\/p><p class=\"mt-2\"><strong>Fuentes:<\/strong> Medios Online, Blogs, Foros, Redes Sociales y Prensa Especializada.<\/p>` },\n valor: { name: 'Tu Valor (PVU)', content: `<p><strong>Problema que resuelve:<\/strong> La necesidad de anticiparse a los cambios del mercado para no perder relevancia.<\/p><p class=\"mt-2\"><strong>Beneficio principal:<\/strong> Toma de decisiones estrat\u00e9gicas proactivas y adaptaci\u00f3n r\u00e1pida a los cambios.<\/p><p class=\"mt-2\"><strong>Diferenciaci\u00f3n:<\/strong> Uso de machine learning para ofrecer una previsi\u00f3n del mercado, no solo una retrospectiva.<\/p>` }\n },\n chartConfig: {\n type: 'line',\n data: {\n labels: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun'],\n datasets: [\n { label: 'Tendencia A (IA)', data: [120, 150, 220, 210, 300, 350], borderColor: '#0d9488', tension: 0.2 },\n { label: 'Tendencia B (Sostenibilidad)', data: [200, 220, 250, 240, 260, 270], borderColor: '#0ea5e9', tension: 0.2 }\n ]\n },\n options: { scales: { y: { beginAtZero: true } }, plugins: { legend: { position: 'top' } } }\n }\n },\n notoriedad: {\n name: 'Notoriedad de Marca',\n title: 'Informe de Notoriedad de Marca',\n purpose: 'Mide la visibilidad y el reconocimiento de tu marca en el ecosistema medi\u00e1tico, evaluando cu\u00e1ntas personas la conocen y la recuerdan para construir tu presencia en el mercado.',\n tabs: {\n metricas: { name: 'M\u00e9tricas Clave', content: `<ul><li class=\"mb-2\"><strong>Impresiones y Alcance (Reach):<\/strong> Visualizaciones y n\u00famero \u00fanico de personas alcanzadas.<\/li><li class=\"mb-2\"><strong>Menciones de Marca:<\/strong> Referencias directas e indirectas.<\/li><li class=\"mb-2\"><strong>Crecimiento de Seguidores:<\/strong> Aumento de la base de audiencia social.<\/li><li><strong>Share of Voice:<\/strong> Cuota de la conversaci\u00f3n total.<\/li><\/ul>` },\n analisis: { name: 'An\u00e1lisis y Fuentes', content: `<p><strong>Tipo de An\u00e1lisis:<\/strong> Cuantitativo (vol\u00famenes, crecimiento), evolutivo (seguimiento en el tiempo) y demogr\u00e1fico (an\u00e1lisis de la audiencia).<\/p><p class=\"mt-2\"><strong>Fuentes:<\/strong> Todos los medios monitoreados (Prensa, Online, Redes Sociales, TV, Radio).<\/p>` },\n valor: { name: 'Tu Valor (PVU)', content: `<p><strong>Problema que resuelve:<\/strong> La duda sobre si los esfuerzos de comunicaci\u00f3n est\u00e1n realmente aumentando el conocimiento de marca.<\/p><p class=\"mt-2\"><strong>Beneficio principal:<\/strong> Visi\u00f3n clara del crecimiento y la visibilidad de la marca.<\/p><p class=\"mt-2\"><strong>Diferenciaci\u00f3n:<\/strong> An\u00e1lisis demogr\u00e1fico de la audiencia alcanzada para asegurar que la notoriedad se construye en el p\u00fablico correcto.<\/p>` }\n },\n chartConfig: {\n type: 'bar',\n data: {\n labels: ['Q1', 'Q2', 'Q3', 'Q4'],\n datasets: [{\n label: 'Alcance Potencial (en millones)',\n data: [1.2, 1.5, 2.1, 2.8],\n backgroundColor: '#f97316'\n }]\n },\n options: {\n scales: { y: { beginAtZero: true } },\n plugins: { legend: { display: false } }\n }\n }\n },\n };\n\n let currentReportKey = 'sentimiento';\n let myChart;\n\n const reportSelector = document.getElementById('report-selector');\n const tabSelector = document.getElementById('tab-selector');\n const tabContentContainer = document.getElementById('tab-content');\n const reportTitleEl = document.getElementById('report-title');\n const reportPurposeEl = document.getElementById('report-purpose');\n const chartCanvas = document.getElementById('reportChart').getContext('2d');\n const goalCards = document.querySelectorAll('.goal-card');\n const mobileNav = document.getElementById('mobile-nav');\n\n function createChart(chartConfig) {\n if (myChart) {\n myChart.destroy();\n }\n const options = chartConfig.options || {};\n const defaultOptions = {\n responsive: true,\n maintainAspectRatio: false,\n plugins: {\n legend: {\n labels: {\n font: {\n family: \"'Inter', sans-serif\"\n }\n }\n }\n },\n scales: {\n x: { ticks: { font: { family: \"'Inter', sans-serif\" } } },\n y: { ticks: { font: { family: \"'Inter', sans-serif\" } } }\n }\n };\n \n myChart = new Chart(chartCanvas, {\n type: chartConfig.type,\n data: chartConfig.data,\n options: { ...defaultOptions, ...options }\n });\n }\n\n function updateView(reportKey) {\n currentReportKey = reportKey;\n const data = reportData[reportKey];\n\n reportTitleEl.textContent = data.title;\n reportPurposeEl.textContent = data.purpose;\n\n tabSelector.innerHTML = '';\n tabContentContainer.innerHTML = '';\n \n Object.keys(data.tabs).forEach((tabKey, index) => {\n const tabData = data.tabs[tabKey];\n const tabButton = document.createElement('a');\n tabButton.href = '#';\n tabButton.dataset.tab = tabKey;\n tabButton.className = `tab-button whitespace-nowrap py-2 px-3 font-medium text-sm rounded-md border-b-2 border-transparent text-gray-500 hover:text-teal-600 hover:border-teal-600\/50 transition-all`;\n if (index === 0) tabButton.classList.add('active');\n tabButton.textContent = tabData.name;\n tabSelector.appendChild(tabButton);\n\n const tabContent = document.createElement('div');\n tabContent.id = `tab-content-${tabKey}`;\n tabContent.className = 'tab-content-panel text-sm text-gray-700';\n if (index !== 0) tabContent.classList.add('hidden');\n tabContent.innerHTML = tabData.content;\n tabContentContainer.appendChild(tabContent);\n });\n\n document.querySelectorAll('.report-button').forEach(btn => {\n btn.classList.toggle('active', btn.dataset.report === reportKey);\n });\n \n createChart(data.chartConfig);\n }\n \n Object.keys(reportData).forEach(key => {\n const report = reportData[key];\n const button = document.createElement('button');\n button.className = 'report-button px-3 py-2 text-sm font-medium text-gray-700 bg-gray-100 rounded-lg hover:bg-teal-500 hover:text-white transition-all duration-200';\n button.textContent = report.name;\n button.dataset.report = key;\n reportSelector.appendChild(button);\n });\n\n reportSelector.addEventListener('click', (e) => {\n if (e.target.tagName === 'BUTTON') {\n const reportKey = e.target.dataset.report;\n if (reportKey) updateView(reportKey);\n }\n });\n\n tabSelector.addEventListener('click', (e) => {\n e.preventDefault();\n if (e.target.tagName === 'A') {\n const tabKey = e.target.dataset.tab;\n document.querySelectorAll('.tab-button').forEach(btn => btn.classList.remove('active'));\n e.target.classList.add('active');\n document.querySelectorAll('.tab-content-panel').forEach(panel => panel.classList.add('hidden'));\n document.getElementById(`tab-content-${tabKey}`).classList.remove('hidden');\n }\n });\n\n goalCards.forEach(card => {\n card.addEventListener('click', () => {\n const reportKey = card.dataset.report;\n document.getElementById('informes').scrollIntoView({ behavior: 'smooth' });\n setTimeout(() => updateView(reportKey), 300); \n });\n });\n\n mobileNav.addEventListener('change', (e) => {\n const targetId = e.target.value;\n document.querySelector(targetId).scrollIntoView({ behavior: 'smooth' });\n });\n\n updateView(currentReportKey);\n });\n <\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Informe Interactivo: Inteligencia de Medios Inteligencia de Medios Qu\u00e9 es Pilares Visualizaciones Aplicaciones Clientes Futuro Qu\u00e9 es Pilares Visualizaciones Aplicaciones Clientes Futuro \u2728 Transformando Datos en Decisi\u00f3n Estrat\u00e9gica La inteligencia de medios es la clave para desentra\u00f1ar el vasto volumen de informaci\u00f3n actual, convirtiendo el ruido en conocimiento accionable. Empoderamos a las organizaciones para tomar…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"advanced_seo_description":"","jetpack_seo_html_title":"","jetpack_seo_noindex":false,"footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/PgDuos-6","_links":{"self":[{"href":"https:\/\/buscomunicacion.com\/index.php\/wp-json\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/buscomunicacion.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/buscomunicacion.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/buscomunicacion.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/buscomunicacion.com\/index.php\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":11,"href":"https:\/\/buscomunicacion.com\/index.php\/wp-json\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":176,"href":"https:\/\/buscomunicacion.com\/index.php\/wp-json\/wp\/v2\/pages\/6\/revisions\/176"}],"wp:attachment":[{"href":"https:\/\/buscomunicacion.com\/index.php\/wp-json\/wp\/v2\/media?parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}