{"id":7601,"date":"2026-01-14T18:21:03","date_gmt":"2026-01-14T17:21:03","guid":{"rendered":"https:\/\/innovacore.group\/?post_type=portfolio&p=7601"},"modified":"2026-03-17T10:40:12","modified_gmt":"2026-03-17T08:40:12","slug":"comave","status":"publish","type":"portfolio","link":"https:\/\/innovacore.group\/fr\/portfolio\/comave\/","title":{"rendered":"ComAve &#8211; Exp\u00e9rience Ultime des Fans et R\u00e9compenses"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">ComAve is revolutionizing the sports world by bridging the gap between passionate supporters and top European football clubs. Through a global platform that combines e-commerce, gamification, and an innovative loyalty program, ComAve offers fans more than just merchandise. They provide access to exclusive rewards, VIP treatments, and unique interactions, transforming the way fans connect with their favorite teams in a seamless digital environment.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Connectez-vous avec les clubs majeurs via des r\u00e9compenses exclusives, la gamification et des exp\u00e9riences VIP.<\/p>\n","protected":false},"featured_media":2369,"parent":0,"template":"","meta":{"inline_featured_image":false,"company_name":"ComAve","summary":"Ultimate<span class=\"ic-nycd\">Exp\u00e9rience des Fans<\/span>& <span class=\"ic-nycd\">R\u00e9compenses<\/span>","mission":"<p>La mission de ComAve est de r\u00e9compenser la passion des fans. Ils visent \u00e0 approfondir le lien entre les supporters et les \u00e9quipes en cr\u00e9ant un \u00e9cosyst\u00e8me unifi\u00e9 o\u00f9 les interactions quotidiennes d\u00e9bloquent des exp\u00e9riences r\u00e9elles inoubliables et des avantages officiels que lorment linance.<\/p>\n","impact":"<p>ComAve red\u00e9finit linance des fans de sport en passant de simples transactions \u00e0 des relations bas\u00e9es sur la loyaut\u00e9. En num\u00e9risant le parcours du fan et en offrant un acc\u00e8s in\u00e9gal\u00e9, ils favorisent une meilleure r\u00e9tention pour les clubs et apportent un retour tangible sur lormation \u00e9motionnelle des supporters dans le monde entier.<\/p>\n","company_logo":"https:\/\/innovacore.group\/wp-content\/uploads\/comave-logo-innov-innovacore-optimized.jpg","website_url":"https:\/\/comave.com\/","linkedin_url":"https:\/\/www.linkedin.com\/company\/wherefanswin\/","location":"Londres, Royaume-Uni","founded_year":"2020","key_numbers":{"item-0":{"metric_label":"Participants aux matchs","metric_value":"1919"},"item-1":{"metric_label":"Exp\u00e9riences VIP","metric_value":"1200"},"item-2":{"metric_label":"Exp\u00e9riences uniques","metric_value":"212"}},"hiring_status":"recrutement en cours","sector":"place de march\u00e9","company_type":"start-up","audience":["b2b_a_b2c"],"geo_scope":["mondial"],"business_model":["place de march\u00e9"],"funding_stage":"croissance","partnership_type":"acquisition","logo_animation":"<div id=\"comave-particle-root\">\r\n    <canvas id=\"comaveCanvas\"><\/canvas>\r\n<\/div>\r\n\r\n<style>\r\n    #comave-particle-root {\r\n        width: 100%;\r\n        height: 300px; \/* Hauteur fixe respect\u00e9e *\/\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n        background: transparent;\r\n        overflow: hidden;\r\n        cursor: crosshair;\r\n    }\r\n<\/style>\r\n\r\n<script>\r\n(function() {\r\n    const canvas = document.getElementById('comaveCanvas');\r\n    const ctx = canvas.getContext('2d', { willReadFrequently: true });\r\n    const root = document.getElementById('comave-particle-root');\r\n    \r\n    let width, height;\r\n    let particles = [];\r\n    let mouse = { x: -1000, y: -1000 };\r\n    const particleColor = '#f5f5f5'; \/\/ Gris clair Innovacore\r\n    let time = 0;\r\n\r\n    function init() {\r\n        width = root.offsetWidth;\r\n        height = 300;\r\n        \r\n        const dpr = window.devicePixelRatio || 1;\r\n        canvas.width = width * dpr;\r\n        canvas.height = height * dpr;\r\n        canvas.style.width = width + 'px';\r\n        canvas.style.height = height + 'px';\r\n        ctx.scale(dpr, dpr);\r\n\r\n        createLogoParticles();\r\n    }\r\n\r\n    function createLogoParticles() {\r\n        particles = [];\r\n        const cx = width \/ 2;\r\n        const cy = height \/ 2;\r\n        const isMobile = width < 600;\r\n\r\n        \/\/ --- 1. CONFIGURATION DU DESSIN ---\r\n        \/\/ On va dessiner le logo en blanc pour le scanner\r\n        ctx.fillStyle = 'white';\r\n        ctx.textAlign = 'left'; \r\n        ctx.textBaseline = 'middle';\r\n\r\n        \/\/ Dimensions relatives\r\n        const iconSize = isMobile ? 40 : 60; \/\/ Rayon de l'hexagone\r\n        const fontSizeMain = isMobile ? 40 : 70;\r\n        const fontSizeSub = isMobile ? 12 : 20;\r\n        const gap = isMobile ? 15 : 25; \/\/ Espace entre ic\u00f4ne et texte\r\n\r\n        \/\/ Calcul de la largeur totale pour centrer le tout\r\n        \/\/ Estimation : (Icon * 2) + Gap + TextWidth\r\n        ctx.font = `italic 900 ${fontSizeMain}px Arial, Helvetica, sans-serif`;\r\n        const textMetrics = ctx.measureText('Com Ave');\r\n        const textWidth = textMetrics.width;\r\n        \r\n        const totalWidth = (iconSize * 2) + gap + textWidth;\r\n        const startX = cx - (totalWidth \/ 2);\r\n\r\n        \/\/ --- 2. DESSIN DE L'IC\u00d4NE (HEXAGONE) ---\r\n        const hexX = startX + iconSize; \/\/ Centre de l'hexagone\r\n\r\n        \/\/ A. L'Hexagone plein\r\n        ctx.beginPath();\r\n        for (let i = 0; i < 6; i++) {\r\n            const angle = 2 * Math.PI \/ 6 * i;\r\n            \/\/ On tourne un peu pour avoir la pointe sur le c\u00f4t\u00e9 comme le logo\r\n            const x_i = hexX + iconSize * Math.cos(angle);\r\n            const y_i = cy + iconSize * Math.sin(angle);\r\n            if (i === 0) ctx.moveTo(x_i, y_i);\r\n            else ctx.lineTo(x_i, y_i);\r\n        }\r\n        ctx.closePath();\r\n        ctx.fill();\r\n\r\n        \/\/ B. Le \"C\" (Espace n\u00e9gatif)\r\n        \/\/ On change le mode de fusion pour \"gommer\" l'int\u00e9rieur\r\n        ctx.globalCompositeOperation = 'destination-out';\r\n\r\n        \/\/ Le trou du C\r\n        ctx.font = `900 ${iconSize * 1.2}px Arial, sans-serif`;\r\n        ctx.textAlign = 'center';\r\n        ctx.fillText('C', hexX, cy + (iconSize * 0.1)); \r\n\r\n        \/\/ Retour au mode normal pour dessiner la suite\r\n        ctx.globalCompositeOperation = 'source-over';\r\n\r\n        \/\/ C. Le point central (si n\u00e9cessaire, le logo a un axe central)\r\n        \/\/ On remet un petit point au centre pour styliser le C comme le logo ComAve\r\n        ctx.fillStyle = 'white';\r\n        ctx.beginPath();\r\n        ctx.arc(hexX, cy, iconSize * 0.15, 0, Math.PI*2);\r\n        ctx.fill();\r\n\r\n        \/\/ --- 3. DESSIN DU TEXTE ---\r\n        const textX = startX + (iconSize * 2) + gap;\r\n\r\n        \/\/ \"ComAve\"\r\n        ctx.textAlign = 'left';\r\n        ctx.font = `italic 900 ${fontSizeMain}px Arial, Helvetica, sans-serif`;\r\n        ctx.fillText('ComAve', textX, cy - (fontSizeMain * 0.15));\r\n\r\n        \/\/ \"United to win\"\r\n        ctx.font = `italic normal ${fontSizeSub}px Arial, Helvetica, sans-serif`;\r\n        ctx.fillText('United to win', textX, cy + (fontSizeMain * 0.5));\r\n\r\n        \/\/ --- 4. SCAN DES PIXELS ---\r\n        const density = 4;\r\n        const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height).data;\r\n        const dataWidth = canvas.width; \r\n\r\n        for (let y = 0; y < canvas.height; y += density) {\r\n            for (let x = 0; x < canvas.width; x += density) {\r\n                if (imageData[(y * dataWidth + x) * 4 + 3] > 128) {\r\n                    const dpr = window.devicePixelRatio || 1;\r\n                    particles.push({\r\n                        x: x \/ dpr,\r\n                        y: y \/ dpr,\r\n                        originX: x \/ dpr,\r\n                        originY: y \/ dpr,\r\n                        vx: 0, \r\n                        vy: 0,\r\n                        size: Math.random() * 1.5 + 0.5,\r\n                        force: Math.random() \r\n                    });\r\n                }\r\n            }\r\n        }\r\n        \r\n        ctx.clearRect(0, 0, width, height);\r\n    }\r\n\r\n    function draw() {\r\n        ctx.clearRect(0, 0, width, height);\r\n        time += 0.05;\r\n\r\n        ctx.fillStyle = particleColor;\r\n        \r\n        particles.forEach(p => {\r\n            \/\/ 1. Respiration\r\n            const waveX = Math.sin(time * 0.5 + p.y * 0.05) * 2;\r\n            const waveY = Math.cos(time * 0.3 + p.x * 0.05) * 2;\r\n\r\n            \/\/ 2. Interaction\r\n            const dx = mouse.x - p.x;\r\n            const dy = mouse.y - p.y;\r\n            const dist = Math.sqrt(dx*dx + dy*dy);\r\n            const radius = 80;\r\n\r\n            let repelX = 0;\r\n            let repelY = 0;\r\n\r\n            if (dist < radius) {\r\n                const force = (radius - dist) \/ radius;\r\n                const angle = Math.atan2(dy, dx);\r\n                repelX = -Math.cos(angle) * force * 20;\r\n                repelY = -Math.sin(angle) * force * 20;\r\n            }\r\n\r\n            \/\/ 3. Physique\r\n            const targetX = p.originX + waveX;\r\n            const targetY = p.originY + waveY;\r\n\r\n            const ax = (targetX - p.x) * 0.08;\r\n            const ay = (targetY - p.y) * 0.08;\r\n\r\n            p.vx += ax;\r\n            p.vy += ay;\r\n            p.vx += repelX * 0.5;\r\n            p.vy += repelY * 0.5;\r\n            p.vx *= 0.85; \r\n\r\n            p.x += p.vx;\r\n            p.y += p.vy;\r\n\r\n            ctx.beginPath();\r\n            ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2);\r\n            ctx.fill();\r\n        });\r\n\r\n        requestAnimationFrame(draw);\r\n    }\r\n\r\n    const updateMouse = (e) => {\r\n        const r = canvas.getBoundingClientRect();\r\n        const cx = e.touches ? e.touches[0].clientX : e.clientX;\r\n        const cy = e.touches ? e.touches[0].clientY : e.clientY;\r\n        mouse.x = cx - r.left;\r\n        mouse.y = cy - r.top;\r\n    };\r\n\r\n    window.addEventListener('resize', init);\r\n    canvas.addEventListener('mousemove', updateMouse);\r\n    canvas.addEventListener('touchmove', updateMouse, {passive: true});\r\n    canvas.addEventListener('mouseleave', () => { mouse.x = -1000; mouse.y = -1000; });\r\n    canvas.addEventListener('touchend', () => { mouse.x = -1000; mouse.y = -1000; });\r\n\r\n    setTimeout(init, 50);\r\n    draw();\r\n})();\r\n<\/script>"},"pt":[],"pipeline":[],"class_list":["post-7601","portfolio","type-portfolio","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/portfolio\/7601","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/portfolio"}],"about":[{"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/types\/portfolio"}],"version-history":[{"count":1,"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/portfolio\/7601\/revisions"}],"predecessor-version":[{"id":7602,"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/portfolio\/7601\/revisions\/7602"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/media\/2369"}],"wp:attachment":[{"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/media?parent=7601"}],"wp:term":[{"taxonomy":"pt","embeddable":true,"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/pt?post=7601"},{"taxonomy":"pipeline","embeddable":true,"href":"https:\/\/innovacore.group\/fr\/wp-json\/wp\/v2\/pipeline?post=7601"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}