> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Welcome to Kameleoon

> Kameleoon is a powerful, unified platform designed to help teams deliver better digital experiences through experimentation, feature management, and personalization.

export const Quiz = () => {
  const translations = {
    en: {
      ui: {
        questionLabel: (current, total) => `Question ${current} of ${total}`,
        resultTitleSingle: "Your recommended solution",
        resultTitleMulti: "Your personalized solution mix",
        retake: "↺ Retake the quiz"
      },
      questions: [{
        question: "What is your team's primary objective?",
        options: [{
          text: "Launch UI/UX tests rapidly using AI",
          weights: {
            pbx: 3,
            personalization: 1,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Safely roll out backend changes and reduce risk",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 1
          }
        }, {
          text: "Experiment fast with AI and transpose winning tests into the codebase behind flags",
          weights: {
            pbx: 2,
            personalization: 0,
            feature: 2,
            mcp: 0
          }
        }, {
          text: "Personalize the user journey based on behavioral data",
          weights: {
            pbx: 1,
            personalization: 3,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Integrate Kameleoon with custom LLM tools or workflows",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 1,
            mcp: 3
          }
        }]
      }, {
        question: "How technical is the person managing the experiments?",
        options: [{
          text: "Mostly non-technical (Marketer, PM) using a visual editor",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Highly technical (Engineer) writing code and managing infrastructure",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 2,
            mcp: 2
          }
        }]
      }, {
        question: "Where do you plan to deploy your experiments?",
        options: [{
          text: "Strictly on the front-end website",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Across web, mobile, and server-side applications",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 0
          }
        }, {
          text: "Within an IDE like Cursor or via custom AI agents",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 0,
            mcp: 3
          }
        }]
      }],
      results: {
        pbx: {
          icon: "🪄",
          title: "Web experimentation and PBX",
          description: "Generate variations instantly and test without touching code. Prompt-Based Experimentation (PBX) transforms your ideas into working experiments using natural language.",
          linkText: "Get started with PBX →"
        },
        feature: {
          icon: "🚦",
          title: "Feature experimentation",
          description: "Control deployments and reduce risk. Feature Experimentation lets you decouple deployment from release and target specific segments server-side.",
          linkText: "Explore feature flagging →"
        },
        mcp: {
          icon: "🤖",
          title: "Kameleoon MCP server",
          description: "Build advanced AI integrations. The Kameleoon MCP Server acts as a bridge between Kameleoon and your IDE (like Cursor), enabling you to manage experiments directly from your code editor.",
          linkText: "View MCP server docs →"
        },
        personalization: {
          icon: "✨",
          title: "Web personalization",
          description: "Tailor the user journey in real-time. Leverage CRM and behavioral data to deliver personalized content across your website.",
          linkText: "Launch a personalization →"
        }
      }
    },
    fr: {
      ui: {
        questionLabel: (current, total) => `Question ${current} sur ${total}`,
        resultTitleSingle: "Votre solution recommandée",
        resultTitleMulti: "Votre combinaison de solutions personnalisée",
        retake: "↺ Refaire le quiz"
      },
      questions: [{
        question: "Quel est l'objectif principal de votre équipe ?",
        options: [{
          text: "Lancer rapidement des tests UI/UX grâce à l'IA",
          weights: {
            pbx: 3,
            personalization: 1,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Déployer en toute sécurité des changements backend et réduire les risques",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 1
          }
        }, {
          text: "Expérimenter rapidement avec l'IA et transposer les tests gagnants dans le code derrière des feature flags",
          weights: {
            pbx: 2,
            personalization: 0,
            feature: 2,
            mcp: 0
          }
        }, {
          text: "Personnaliser le parcours utilisateur à partir de données comportementales",
          weights: {
            pbx: 1,
            personalization: 3,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Intégrer Kameleoon à des outils LLM ou workflows personnalisés",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 1,
            mcp: 3
          }
        }]
      }, {
        question: "Quel est le profil technique de la personne qui gère les expériences ?",
        options: [{
          text: "Principalement non technique (Marketing, PM) utilisant un éditeur visuel",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Très technique (Ingénieur) écrivant du code et gérant l'infrastructure",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 2,
            mcp: 2
          }
        }]
      }, {
        question: "Où prévoyez-vous de déployer vos expériences ?",
        options: [{
          text: "Strictement sur le site front-end",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Sur le web, le mobile et les applications côté serveur",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 0
          }
        }, {
          text: "Dans un IDE comme Cursor ou via des agents IA personnalisés",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 0,
            mcp: 3
          }
        }]
      }],
      results: {
        pbx: {
          icon: "🪄",
          title: "Expérimentation web et PBX",
          description: "Générez des variations instantanément et testez sans toucher au code. L'expérimentation basée sur les prompts (PBX) transforme vos idées en expériences fonctionnelles en langage naturel.",
          linkText: "Démarrer avec PBX →"
        },
        feature: {
          icon: "🚦",
          title: "Feature experimentation",
          description: "Maîtrisez vos déploiements et réduisez les risques. La Feature Experimentation vous permet de découpler le déploiement de la mise en production et de cibler des segments spécifiques côté serveur.",
          linkText: "Découvrir le feature flagging →"
        },
        mcp: {
          icon: "🤖",
          title: "Serveur MCP Kameleoon",
          description: "Créez des intégrations IA avancées. Le serveur MCP Kameleoon fait le lien entre Kameleoon et votre IDE (comme Cursor), vous permettant de gérer vos expériences directement depuis votre éditeur de code.",
          linkText: "Voir la documentation du serveur MCP →"
        },
        personalization: {
          icon: "✨",
          title: "Personnalisation web",
          description: "Adaptez le parcours utilisateur en temps réel. Exploitez les données CRM et comportementales pour diffuser des contenus personnalisés sur votre site.",
          linkText: "Lancer une personnalisation →"
        }
      }
    },
    de: {
      ui: {
        questionLabel: (current, total) => `Frage ${current} von ${total}`,
        resultTitleSingle: "Ihre empfohlene Lösung",
        resultTitleMulti: "Ihr personalisierter Lösungsmix",
        retake: "↺ Quiz erneut starten"
      },
      questions: [{
        question: "Was ist das wichtigste Ziel Ihres Teams?",
        options: [{
          text: "UI/UX-Tests schnell mit KI starten",
          weights: {
            pbx: 3,
            personalization: 1,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Backend-Änderungen sicher ausrollen und Risiken reduzieren",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 1
          }
        }, {
          text: "Schnell mit KI experimentieren und erfolgreiche Tests hinter Feature-Flags in den Code übertragen",
          weights: {
            pbx: 2,
            personalization: 0,
            feature: 2,
            mcp: 0
          }
        }, {
          text: "Die User Journey auf Basis von Verhaltensdaten personalisieren",
          weights: {
            pbx: 1,
            personalization: 3,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Kameleoon mit eigenen LLM-Tools oder Workflows integrieren",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 1,
            mcp: 3
          }
        }]
      }, {
        question: "Wie technisch ist die Person, die die Experimente verwaltet?",
        options: [{
          text: "Überwiegend nicht-technisch (Marketing, PM) mit visuellem Editor",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Sehr technisch (Engineer), schreibt Code und verwaltet Infrastruktur",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 2,
            mcp: 2
          }
        }]
      }, {
        question: "Wo planen Sie, Ihre Experimente auszuspielen?",
        options: [{
          text: "Ausschließlich auf der Frontend-Website",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Über Web-, Mobile- und serverseitige Anwendungen hinweg",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 0
          }
        }, {
          text: "In einer IDE wie Cursor oder über eigene KI-Agenten",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 0,
            mcp: 3
          }
        }]
      }],
      results: {
        pbx: {
          icon: "🪄",
          title: "Web-Experimentation und PBX",
          description: "Erstellen Sie Varianten sofort und testen Sie, ohne Code anzufassen. Prompt-Based Experimentation (PBX) verwandelt Ihre Ideen mithilfe natürlicher Sprache in lauffähige Experimente.",
          linkText: "Mit PBX starten →"
        },
        feature: {
          icon: "🚦",
          title: "Feature Experimentation",
          description: "Steuern Sie Deployments und reduzieren Sie Risiken. Feature Experimentation entkoppelt Deployment und Release und ermöglicht serverseitiges Targeting bestimmter Segmente.",
          linkText: "Feature Flagging entdecken →"
        },
        mcp: {
          icon: "🤖",
          title: "Kameleoon MCP-Server",
          description: "Bauen Sie fortgeschrittene KI-Integrationen. Der Kameleoon MCP-Server fungiert als Brücke zwischen Kameleoon und Ihrer IDE (z. B. Cursor) und lässt Sie Experimente direkt aus Ihrem Code-Editor verwalten.",
          linkText: "MCP-Server-Dokumentation ansehen →"
        },
        personalization: {
          icon: "✨",
          title: "Web-Personalisierung",
          description: "Passen Sie die User Journey in Echtzeit an. Nutzen Sie CRM- und Verhaltensdaten, um personalisierte Inhalte auf Ihrer Website auszuspielen.",
          linkText: "Personalisierung starten →"
        }
      }
    },
    ja: {
      ui: {
        questionLabel: (current, total) => `質問 ${current} / ${total}`,
        resultTitleSingle: "おすすめのソリューション",
        resultTitleMulti: "あなたに合ったソリューションの組み合わせ",
        retake: "↺ もう一度挑戦する"
      },
      questions: [{
        question: "あなたのチームの主な目標は何ですか？",
        options: [{
          text: "AIを活用してUI/UXテストを素早く実施する",
          weights: {
            pbx: 3,
            personalization: 1,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "バックエンドの変更を安全にリリースし、リスクを軽減する",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 1
          }
        }, {
          text: "AIで素早く実験し、勝利したテストをフィーチャーフラグの背後でコードベースに組み込む",
          weights: {
            pbx: 2,
            personalization: 0,
            feature: 2,
            mcp: 0
          }
        }, {
          text: "行動データに基づいてユーザーのジャーニーをパーソナライズする",
          weights: {
            pbx: 1,
            personalization: 3,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "KameleoonをカスタムLLMツールやワークフローと連携する",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 1,
            mcp: 3
          }
        }]
      }, {
        question: "実験を管理する担当者のテクニカルレベルは？",
        options: [{
          text: "主に非技術系（マーケター、PM）でビジュアルエディターを使用",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "技術系（エンジニア）でコードを書きインフラを管理",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 2,
            mcp: 2
          }
        }]
      }, {
        question: "実験をどこで展開する予定ですか？",
        options: [{
          text: "フロントエンドのウェブサイトのみ",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "ウェブ、モバイル、サーバーサイドアプリケーションにまたがって",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 0
          }
        }, {
          text: "CursorなどのIDEやカスタムAIエージェント経由",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 0,
            mcp: 3
          }
        }]
      }],
      results: {
        pbx: {
          icon: "🪄",
          title: "Webエクスペリメンテーションと PBX",
          description: "バリエーションを即座に生成し、コードを変更せずにテストできます。プロンプトベースエクスペリメンテーション（PBX）は自然言語を使ってアイデアを実際の実験に変換します。",
          linkText: "PBXを始める →"
        },
        feature: {
          icon: "🚦",
          title: "フィーチャーエクスペリメンテーション",
          description: "デプロイを制御しリスクを軽減します。フィーチャーエクスペリメンテーションを使うと、デプロイとリリースを切り離し、サーバーサイドで特定セグメントをターゲットにできます。",
          linkText: "フィーチャーフラグを探索する →"
        },
        mcp: {
          icon: "🤖",
          title: "Kameleoon MCPサーバー",
          description: "高度なAI統合を構築します。Kameleoon MCPサーバーはKameleoonとIDE（Cursorなど）の橋渡しをし、コードエディターから直接実験を管理できます。",
          linkText: "MCPサーバーのドキュメントを見る →"
        },
        personalization: {
          icon: "✨",
          title: "Webパーソナライゼーション",
          description: "ユーザーのジャーニーをリアルタイムでカスタマイズします。CRMデータや行動データを活用して、ウェブサイト全体でパーソナライズされたコンテンツを配信します。",
          linkText: "パーソナライゼーションを開始する →"
        }
      }
    },
    es: {
      ui: {
        questionLabel: (current, total) => `Pregunta ${current} de ${total}`,
        resultTitleSingle: "Su solución recomendada",
        resultTitleMulti: "Su combinación personalizada de soluciones",
        retake: "↺ Volver a hacer el cuestionario"
      },
      questions: [{
        question: "¿Cuál es el objetivo principal de su equipo?",
        options: [{
          text: "Lanzar rápidamente tests de UI/UX con IA",
          weights: {
            pbx: 3,
            personalization: 1,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Desplegar cambios de backend de forma segura y reducir riesgos",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 1
          }
        }, {
          text: "Experimentar rápido con IA y trasladar los tests ganadores al código detrás de feature flags",
          weights: {
            pbx: 2,
            personalization: 0,
            feature: 2,
            mcp: 0
          }
        }, {
          text: "Personalizar el recorrido del usuario a partir de datos de comportamiento",
          weights: {
            pbx: 1,
            personalization: 3,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Integrar Kameleoon con herramientas LLM o flujos de trabajo personalizados",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 1,
            mcp: 3
          }
        }]
      }, {
        question: "¿Qué perfil técnico tiene la persona que gestiona los experimentos?",
        options: [{
          text: "Principalmente no técnico (Marketing, PM) usando un editor visual",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "Muy técnico (Ingeniero) escribiendo código y gestionando infraestructura",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 2,
            mcp: 2
          }
        }]
      }, {
        question: "¿Dónde planea desplegar sus experimentos?",
        options: [{
          text: "Únicamente en el sitio web front-end",
          weights: {
            pbx: 2,
            personalization: 2,
            feature: 0,
            mcp: 0
          }
        }, {
          text: "En web, móvil y aplicaciones del lado del servidor",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 3,
            mcp: 0
          }
        }, {
          text: "En un IDE como Cursor o a través de agentes de IA personalizados",
          weights: {
            pbx: 0,
            personalization: 0,
            feature: 0,
            mcp: 3
          }
        }]
      }],
      results: {
        pbx: {
          icon: "🪄",
          title: "Experimentación web y PBX",
          description: "Genere variaciones al instante y haga tests sin tocar el código. La experimentación basada en prompts (PBX) convierte sus ideas en experimentos funcionales mediante lenguaje natural.",
          linkText: "Empezar con PBX →"
        },
        feature: {
          icon: "🚦",
          title: "Feature experimentation",
          description: "Controle los despliegues y reduzca riesgos. Feature Experimentation le permite desacoplar el despliegue del lanzamiento y segmentar grupos específicos del lado del servidor.",
          linkText: "Descubrir el feature flagging →"
        },
        mcp: {
          icon: "🤖",
          title: "Servidor MCP de Kameleoon",
          description: "Cree integraciones de IA avanzadas. El servidor MCP de Kameleoon actúa como puente entre Kameleoon y su IDE (como Cursor), permitiéndole gestionar experimentos directamente desde su editor de código.",
          linkText: "Ver la documentación del servidor MCP →"
        },
        personalization: {
          icon: "✨",
          title: "Personalización web",
          description: "Adapte el recorrido del usuario en tiempo real. Aproveche los datos de CRM y de comportamiento para ofrecer contenido personalizado en todo su sitio web.",
          linkText: "Lanzar una personalización →"
        }
      }
    }
  };
  const resultLinks = {
    pbx: "/user-manual/experimentation/web-experimentation/prompt-based-experiments/get-started",
    feature: "/developer-docs/feature-experimentation/get-started/overview",
    mcp: "/developer-docs/developer-tools/mcp-server",
    personalization: "/user-manual/web-personalization/set-up-and-launch-a-personalization"
  };
  const detectLanguage = () => {
    if (typeof window === 'undefined') return 'en';
    const seg = window.location.pathname.split('/').filter(Boolean)[0];
    return ['fr', 'de', 'es', 'ja'].includes(seg) ? seg : 'en';
  };
  const [lang, setLang] = useState(detectLanguage);
  useEffect(() => {
    setLang(detectLanguage());
    const onChange = () => setLang(detectLanguage());
    window.addEventListener('popstate', onChange);
    return () => window.removeEventListener('popstate', onChange);
  }, []);
  const t = translations[lang] || translations.en;
  const questions = t.questions;
  const buildLink = key => {
    const base = resultLinks[key];
    return lang === 'en' ? base : `/${lang}${base}`;
  };
  const [currentQuestion, setCurrentQuestion] = useState(0);
  const [scores, setScores] = useState({
    pbx: 0,
    feature: 0,
    mcp: 0,
    personalization: 0
  });
  const [showResult, setShowResult] = useState(false);
  const handleAnswer = weights => {
    const newScores = {
      pbx: scores.pbx + (weights.pbx || 0),
      feature: scores.feature + (weights.feature || 0),
      mcp: scores.mcp + (weights.mcp || 0),
      personalization: scores.personalization + (weights.personalization || 0)
    };
    setScores(newScores);
    if (currentQuestion + 1 < questions.length) {
      setCurrentQuestion(currentQuestion + 1);
    } else {
      setShowResult(true);
    }
  };
  const getTopResults = () => {
    const sorted = Object.entries(scores).sort(([, a], [, b]) => b - a);
    const topScore = sorted[0][1];
    if (topScore === 0) return [{
      key: 'pbx',
      ...t.results.pbx
    }];
    return sorted.filter(([, score]) => score >= topScore - 1 && score > 0).slice(0, 2).map(([key]) => ({
      key,
      ...t.results[key]
    }));
  };
  const resetQuiz = () => {
    setCurrentQuestion(0);
    setScores({
      pbx: 0,
      feature: 0,
      mcp: 0,
      personalization: 0
    });
    setShowResult(false);
  };
  if (showResult) {
    const results = getTopResults();
    return <div className="mt-8 mb-8">
        <h3 className="text-2xl font-bold text-slate-900 dark:text-white mb-6 mt-0">
          {results.length > 1 ? t.ui.resultTitleMulti : t.ui.resultTitleSingle}
        </h3>

        <div className={`grid gap-4 ${results.length === 1 ? 'grid-cols-1' : 'grid-cols-1 md:grid-cols-2'}`}>
          {results.map((result, index) => <div key={index} className="p-4 sm:p-6 border border-slate-200 dark:border-slate-800 rounded-2xl bg-gradient-to-br from-slate-50 to-white dark:from-slate-900 dark:to-slate-800 shadow-sm flex flex-col h-full">
              <div className="text-3xl sm:text-4xl mb-3 sm:mb-4">{result.icon}</div>
              <h4 className="mt-0 text-lg sm:text-xl font-bold text-slate-900 dark:text-white mb-2 sm:mb-3">
                {result.title}
              </h4>
              <p className="text-slate-600 dark:text-slate-300 text-sm leading-relaxed mb-4 sm:mb-6 flex-grow">
                {result.description}
              </p>
              <div className="mt-auto">
                <a href={buildLink(result.key)} className="inline-flex items-center justify-center w-full sm:w-auto px-4 py-2.5 sm:py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg text-sm font-semibold transition-colors no-underline shadow-sm">
                  {result.linkText}
                </a>
              </div>
            </div>)}
        </div>

        <div className="mt-8 pt-6 border-t border-slate-200 dark:border-slate-700 flex justify-center">
          <button onClick={resetQuiz} className="text-sm text-slate-500 hover:text-slate-800 dark:hover:text-slate-200 font-medium transition-colors bg-transparent border-none cursor-pointer flex items-center gap-2">
            {t.ui.retake}
          </button>
        </div>
      </div>;
  }
  const progressPercentage = currentQuestion / questions.length * 100;
  return <div className="p-4 sm:p-8 border border-slate-200 dark:border-slate-800 rounded-2xl bg-white dark:bg-slate-900 mt-8 mb-8 shadow-sm">
      <div className="mb-8">
        <div className="flex justify-between items-center mb-3">
          <span className="text-xs font-bold text-slate-400 dark:text-slate-500 uppercase tracking-widest">
            {t.ui.questionLabel(currentQuestion + 1, questions.length)}
          </span>
        </div>
        <div className="w-full bg-slate-100 dark:bg-slate-800 rounded-full h-1.5 overflow-hidden">
          <div className="bg-blue-600 h-1.5 rounded-full transition-all duration-500 ease-out" style={{
    width: `${progressPercentage}%`
  }}></div>
        </div>
      </div>

      <h3 className="text-xl font-bold mb-6 text-slate-900 dark:text-white leading-snug mt-0">
        {questions[currentQuestion].question}
      </h3>

      <div className="flex flex-col gap-3">
        {questions[currentQuestion].options.map((option, index) => <button key={index} onClick={() => handleAnswer(option.weights)} className="group w-full flex justify-between items-center text-left p-4 border-2 border-slate-100 dark:border-slate-800 rounded-xl bg-white dark:bg-slate-900 hover:border-blue-500 dark:hover:border-blue-500 hover:shadow-md transition-all duration-200 ease-in-out cursor-pointer">
            <span className="font-medium text-slate-700 dark:text-slate-200 group-hover:text-blue-700 dark:group-hover:text-blue-400 transition-colors">
              {option.text}
            </span>
            <span className="text-blue-500 opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-200 font-bold">
              →
            </span>
          </button>)}
      </div>
    </div>;
};

## Choose your path

Select the portal that best fits your role and what you are trying to build today.

<CardGroup cols={2}>
  <Card title="User manual" icon="book-open" href="/user-manual/home/user-manual-overview">
    For marketers, product managers, and QA teams. Learn how to create, configure, and analyze experiments, manage personalizations, and use the Widget Studio.
  </Card>

  <Card title="Developer docs" icon="code" href="../developer-docs/home/developer-docs-overview">
    For engineers and technical teams. Find implementation guides, SDK references, API documentation, and edge-compute starter kits.
  </Card>
</CardGroup>

***

## Don't know where to start?

Take this quick 3-question quiz to find the exact documentation you need for your tech stack and use case.

<Quiz />

***

## Use docs with your AI assistant

Ask questions, get step-by-step guidance, and explore the full Kameleoon knowledge base—directly from your AI tool.

<Card title="Use Kameleoon docs with AI" icon="sparkles" href="/home/use-docs-with-ai">
  Open any article in Claude or ChatGPT with one click, or configure a persistent MCP server for Claude Desktop, Cursor, VS Code, and more.
</Card>

***

## Core capabilities

Blend experimentation, feature management, and personalization into one platform across web, mobile, and backend environments.

<CardGroup cols={2}>
  <Card title="Web Experimentation & PBX" icon="app-window" href="/user-manual/experimentation/web-experimentation/prompt-based-experiments/get-started">
    Use natural language prompts to instantly generate variations, or use the visual editor to test copy, design, and layouts on any website or single-page app.
  </Card>

  <Card title="Feature Experimentation" icon="toggle-right" href="../developer-docs/feature-experimentation/get-started/overview">
    Decouple deployment from release. Roll out new features progressively, run server-side experiments, and reduce risk with targeted feature flags.
  </Card>

  <Card title="Web personalization" icon="wand-sparkles" href="/user-manual/web-personalization/set-up-and-launch-a-personalization">
    Deliver experiences tailored to specific users in real-time by leveraging behavioral data, CRM integrations, or your data warehouse.
  </Card>

  <Card title="Advanced analytics" icon="chart-line" href="/user-manual/experiment-analytics/analyze-results/results-page-structure">
    Access reliable, real-time results powered by Kameleoon's multi-statistical engine (CUPED, Bayesian, or Sequential testing).
  </Card>
</CardGroup>

***

## Explore Kameleoon's tech stack

Deploy Kameleoon anywhere. We provide more than a dozen SDKs, REST APIs, and integrations to fit perfectly into your existing ecosystem.

<AccordionGroup>
  <Accordion title="Web SDKs" icon="file-code">
    Implement experiments quickly using JavaScript, TypeScript, React, Vue, PHP, Python, Ruby, Go, or Java.

    [Explore Web SDKs →](../developer-docs/sdks/web-sdks/js-sdk)
  </Accordion>

  <Accordion title="Mobile SDKs" icon="smartphone">
    Bring feature flagging and experimentation to your native apps with iOS, Android, Flutter, and React Native SDKs.

    [Explore Mobile SDKs →](../developer-docs/sdks/mobile-sdks/ios-sdk)
  </Accordion>

  <Accordion title="APIs" icon="server">
    Programmatically control experiments, automate workflows, and inject custom data using Kameleoon's REST and JS APIs.

    [Explore APIs →](../developer-docs/apis/overview)
  </Accordion>
</AccordionGroup>