> ## 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.
# プロジェクトを作成する
> ウェブサイト、ウェブアプリ、またはモバイルアプリ向けの Kameleoon プロジェクトを作成し、そのタイプとインストール方法を選択してから、セットアップチェックリストを完了します。
Kameleoon はプロジェクトごとにキャンペーンと機能フラグを実行するため、Kameleoon をインストールする前に、ウェブサイト、ウェブアプリ、またはモバイルアプリのプロジェクトを作成する必要があります。新規プロジェクトフローは、プロジェクトの用途を尋ね、その主要情報を集めてから、インストール手順をガイドします。
## 新規プロジェクトを追加する
アカウントプランで許可されている限り、プロジェクトをいくつでも設定できます。プロジェクトはウェブサイト、モバイルアプリ、または社内で使用する環境（例えば、ステージングや本番）にできます。
新規プロジェクトを追加するには：
1. [Kameleoon アカウント](https://app.kameleoon.com/)にログインします。
2. **Admin** > **Projects** をクリックします。
3. **New project** をクリックします。
4. **What do you want to use this project for?** で、プロジェクトタイプを選択します。プロジェクト作成後は、そのタイプを変更できません。
* **Web Experimentation**：Prompt-Based Experimentation (PBX) またはコードエディターを使用してウェブサイトで Web キャンペーンを実行します。後のステップで、Kameleoon をウェブサイトにインストールする方法を選択します。
* **Feature Experimentation**：フロントエンド、バックエンド、またはモバイル SDK を使用して機能を実験してロールアウトします。Kameleoon SDK でインストールします。
* **All campaign types**：単一のプロジェクトからすべてのキャンペーンタイプを作成・管理します。ウェブサイトにインストールし、Feature Experimentation 用に SDK を使用します。
5. **Feature Experimentation** を選択した場合、**What platform is this project for?** で **Web / Backend** または **Mobile app** を選択します：
* **Web / Backend**：ウェブサイトとバックエンド主導の機能で実験します。
* **Mobile app**：ネイティブモバイルアプリエクスペリエンスで実験します。
6. **Next** をクリックします。
7. プロジェクトの主要情報を入力します：
* **Main project domain**：プロジェクトに関連付けられたメインドメイン。Kameleoon は複数のドメインとサブドメイン全体で実験とパーソナライゼーションを実行できるため、メインドメインは Kameleoon がデフォルトで JavaScript スニペットを設定する場所です。**Mobile app** プラットフォームのみを持つプロジェクトには、**Main project domain** フィールドがありません。
* **Color**：プロジェクトの色を選択します。
* **Project name**（オプション）：ダッシュボードやリスト全体でプロジェクトを見つけやすくする、明確で認識しやすい名前。Kameleoon は、プロジェクト URL の代わりに、プラットフォーム全体で名前を表示します。空白のままにすると、Kameleoon はプロジェクト URL を表示します。**Mobile app** プラットフォームのみを持つプロジェクトには、プロジェクト名が必須です。
* **Description**（オプション）：プロジェクトの意図された用途をチームが理解するのに役立つ詳細。
* **Tags**：**Add tag** をクリックしてタグを追加します。
8. **Next** をクリックして、残りのステップを完了します。[プロジェクトセットアップステップ](#プロジェクトセットアップステップ)を参照してください。
メイン情報は、[Manage your projects](./manage-your-projects) の Overview タブでいつでも編集できます。
## プロジェクトセットアップステップ
ステップバイステップのフォームが Kameleoon を新規プロジェクトにインストールするプロセスをガイドします。既存プロジェクトでは、同じステップが [Manage your projects](./manage-your-projects) の Setup タブの **Installation method** または **Technical configuration** セクションで **Edit** をクリックしたときに開きます。この場合、**Main information** ステップは表示されません。
表示されるステップは、プロジェクトタイプと選択したインストール方法によって異なります。
### プロジェクトタイプ別のステップ
| プロジェクトタイプ | ステップ |
| - | - |
| **Web Experimentation** または **All campaign types** | **Main information**、**Installation method**、**Technical configuration**、**Checklist** |
| **Feature Experimentation**（**Web / Backend** または **Mobile app**） | **Main information**、**Checklist** |
2 つのインストール選択がステップをさらに変更します。インストール方法として **Shopify** を選択すると、Kameleoon は **Technical configuration** ステップをスキップします。**Tag Manager** を選択すると、**Loading mode** オプションと動的ウェブサイトオプションは表示されません。
**Main information** ステップで、**Next** をクリックして続行するか、**Cancel** をクリックして終了します。**Installation method** および **Technical configuration** ステップで、**Back** をクリックして前のステップに戻るか、**Next** をクリックして続行するか、**Save for later** をクリックして進捗を保存します。**Checklist** ステップで、**Back** をクリックするか、タスクが完了したら **Complete setup** をクリックします。既存プロジェクトの **Setup** タブからステップを開く場合、最後のボタンは **Complete setup** ではなく **Save changes** です。
**Save for later** をクリックしたときは、Kameleoon はプロジェクトをドラフトとして保存します。プロジェクトは **Projects** ページに **Draft** ステータスで表示されます。**Complete setup** をクリックすると、Kameleoon はプロジェクトを保存し、そのステータスを **Enabled** に設定します。ドラフトを完了するには、プロジェクトの行で **Edit** をクリックしてから、プロジェクト作成フローで必須情報を完了します。
### インストール方法
**Installation method** ステップは、Kameleoon がウェブサイトで実行される方法を定義します。**Web Experimentation** および **All campaign types** プロジェクトに適用されます。
**Installation method** で、次のいずれかのオプションを選択します：
* **Code snippet pasted on your site**（推奨）：HTML/JavaScript スニペットをページに追加して Kameleoon をインストールします。サーバーサイドフレームワークで構築されたウェブサイトを含みます。
* **Tag Manager (GTM, Tealium iQ, Adobe DTM, ...)**：ページコードを編集せずに、タグ管理システム経由で Kameleoon をデプロイします。
* **Shopify**：Shopify テーマまたはアプリセットアップ経由で Kameleoon をインストールします。
Kameleoon は、すべての主要タグ管理システムと互換性があります。ただし、Kameleoon はタグマネージャーを使用して Kameleoon をインストール**しない**ことを強くお勧めします。そうすることで、キャンペーンでのちらつきが発生する可能性が高まるためです。詳細については、[ちらつき管理とパフォーマンス](../../developer-docs/web-experimentation/technical-concepts/flicker-management-and-performance)を参照してください。
**Code snippet pasted on your site** を選択すると、ステップは **Loading mode** も表示します。これは Kameleoon がウェブサイトで読み込まれる方法を定義します：
* **Asynchronous with anti-flickering**（推奨）：ページ速度を維持するために Kameleoon を非同期で読み込み、一時的な CSS ルールは表示されるちらつきを最小化します。
* **Asynchronous**：ページをブロックせずに Kameleoon を非同期で読み込みます。ただし、スクリプトが実行される前にページがレンダリングされた場合、表示されるちらつきが発生する可能性があります。
* **Synchronous**：ちらつきを防ぐために Kameleoon を同期的に読み込みます。ただし、実行が完了するまでページをブロックします。Kameleoon は通常、このモードは推奨しません。
各読み込みモードの詳細については、[Standard implementation](../../developer-docs/web-experimentation/implementation-and-deployment/standard-implementation)を参照してください。
### 技術設定
**Technical configuration** ステップは、サイト、ドメイン、ホスティングが Kameleoon とどのように機能するかを定義します。**Web Experimentation** および **All campaign types** プロジェクト（インストール方法として **Shopify** を選択した場合を除く）に適用されます。
**Tag Manager** インストール方法を使用すると、ステップは **Resource hosting** で直接開始します。
#### 動的ウェブサイトサポート
**Code snippet pasted on your site** インストール方法を使用すると、ステップは質問 **Is your website a dynamic website (SPA or PWA)?** で開始します。シングルページアプリ（SPA）または Progressive Web App (PWA) はページをリロードせずに動的にコンテンツを読み込みます。動的ウェブサイトサポートをオンにすると、Kameleoon は URL の変更を検出し、A/B テスト、パーソナライゼーション、トラッキングのスクリプトを正しく実行します。
* **Enable support for dynamic websites**：ウェブサイトが仮想 URL を持つウェブアプリの場合、このトグルをオンにします。
* **Enable dynamic website support for**：範囲を選択します。トグルがオンの場合、範囲を選択する必要があります。オプションは **Entire website** と **Chosen elements in the visual editor** です。
* **Set a custom attribute**（オプション）：ウェブサイトが各 HTML 要素に一意の ID を生成していない、または動的 ID を生成している場合、属性名（例えば、`custom-id`）を入力します。Kameleoon はこれを使用して、変更された要素を一意に識別します。
* **Avoid dynamic IDs selectors**（オプション）：デフォルトでは、Kameleoon は 5 桁を超える数字を含む HTML ID を回避します。他の ID を除外するための独自の正規表現を入力します。
**My site uses a server-side framework (Next.js, Nuxt, SvelteKit, etc.)** トグルは動的ウェブサイトオプションの下の独立したカードにあります。これをオンにすると、[Checklist](#チェックリスト) ステップの **Add JavaScript snippet to your website** タスクは、JavaScript スニペットに加えて、サーバーサイドレンダリング（SSR）フレームワーク向けの推奨インストールを提供します。
[シングルページアプリで実験をセットアップする](../experimentation/web-experimentation/advanced-experiment-types/set-up-experiment-single-page-app)と [enableSinglePageSupport リファレンス](../../developer-docs/apis/activation-api-js/api-reference/api-reference#enablesinglepagesupport)の詳細をご覧ください。
#### リソースホスティング
デフォルトでは、Kameleoon は Kameleoon CDN からリソースを提供します。セルフホストを選択する場合、セキュリティと可用性はユーザーの責任になります。各オプションには、**View documentation** リンクがあります。
* **Self-host the script file**：メインの Kameleoon スクリプトを独自のサーバーまたは CDN から提供します。**Script file URL** でスクリプトファイルをホストしている完全な URL を入力します。
* **Self-host images**：Kameleoon イメージアセットを独自のサーバーまたは CDN から提供します。**Image base URL** でイメージファイルをホストしている基本 URL を入力します。イメージセルフホスティングは、組み込みレプリケーションメカニズムを提供する CDN 経由でのみ使用してください。
詳細については、[Simple self-hosting and on-premises options](../../developer-docs/web-experimentation/self-hosting/simple-self-hosting-and-on-premises-options)を参照してください。
#### ドメインとサブドメイン
デフォルトでは、Kameleoon はメインドメインとそのサブドメイン（`*.example.com`）のみを許可します。リストされたドメインとサブドメインのみがグラフィックエディターを使用できます。また、実験ターゲティングが実時間でメインドメインとそのサブドメイン間で共有される訪問者データに依存している場合にも適用されます。
Kameleoon は、メインドメイン用のワイルドカードエントリでリストを事前入力します。別のドメインを追加するには、リストの下のフィールドにそのドメインを入力して **Add domain** をクリックします。ドメインを削除するには、その行の末尾の **X** をクリックします。
**Cross-domain tracking** で、**Track visitors across listed subdomains** をオンにして、リストされたドメイン全体で訪問者データを共有し、リアルタイムターゲティングを行います。
Kameleoon はローカルストレージを使用してセッションデータを追跡します。セッションデータはキャンペーンターゲティングで使用できます。クロスドメイントラッキングは、複数のサブドメイン（例えば、`example.com` と `payment.example.com`）にわたって訪問者をトラッキングすることを可能にします。Kameleoon は、訪問者がドメインやサブドメイン全体をナビゲートするときに訪問者を新規訪問者と見なさず、デジタルプロパティ全体で経験を一貫したままにします。クロスドメイントラッキングは、高度な行動ターゲティングのためにすべてのドメイン全体でセッションデータを使用する予定がある場合にのみ必須です。詳細については、[Unify session data storage across subdomains](../../developer-docs/web-experimentation/technical-concepts/unify-session-data-storage-across-subdomains)を参照してください。
## チェックリスト
**Checklist** ステップは、実験の実行を開始するために完了する必須タスクをリストします。オプションのタスクもリストできます。タスクを開いてその指示を確認し、完了したら **Mark as completed** をクリックします。タスクの各グループは、完了したタスク数を表示します（例えば、**0 of 2 tasks completed**）。完了したら、**Complete setup** をクリックします。
タスクは最大 2 つのグループで表示されます：
* **For your A/B tests and personalizations**：Kameleoon をウェブサイトにインストールするタスク。このグループは **Web Experimentation** および **All campaign types** プロジェクトに表示されます。
* **For your flags and feature experiments**：Kameleoon SDK をインストールするタスク。このグループは **Feature Experimentation** および **All campaign types** プロジェクトに表示されます。
### ウェブ実験とパーソナライゼーション用のタスク
**For your A/B tests and personalizations** グループは、Kameleoon をウェブサイトにインストールするタスクをリストします。タスクは、選択したインストール方法によって異なります。
#### コードスニペットタスク
**Code snippet pasted on your site** インストール方法を使用すると、チェックリストには次のタスクが含まれます。
**Add JavaScript snippet to your website** は、ウェブページに Kameleoon をインストールします。**Copy** をクリックして、スニペットをウェブページの `` タグの直後（他のスクリプトの前）に貼り付けてから、**Mark as completed** をクリックします。**Implementation guide** リンクはインストール指示を開きます。
**Technical configuration** ステップで **My site uses a server-side framework** をオンにした場合、タスクには 2 つのオプションがあります。**SSR Framework**（推奨）はフレームワークのネイティブインストールです。プロジェクトサイトコードを使用してこれを初期化します。タスクはコピーボタン付きの **Project sitecode** を表示します。**Select your SSR framework** で **Next.js**、**Nuxt**、または **SvelteKit** を選択し、**Apply** をクリックします。フレームワークは下のテーブルに表示され、ドキュメントへのリンク付きです。**JavaScript snippet** は標準インストールです。**Copy** をクリックしてスニペットをウェブページの `` タグの直後（他のスクリプトの前）に貼り付けます。
**Set up file synchronization** は、セルフホストされた Kameleoon アプリケーションファイルのコピーを最新の状態に保つことをカバーしています。アプリケーションファイルは動的です。プラットフォームで実験またはパーソナライゼーションのステータスが変更されるたびに、また設定を変更するたびにその内容が変更されます。独自のサーバーまたは CDN でホストされているファイルと Kameleoon が生成する元のファイル間の同期を設定してから、**Mark as completed** をクリックします。CDN はこの設定用に独自のインターフェースを提供します。nginx や Apache などの標準的な HTTP サーバーでは、5 分ごとにファイルを取得するために `wget` コマンドを実行する cron ジョブを使用します。コマンドと詳細については、[Application file and public resources self-hosting](../../developer-docs/web-experimentation/self-hosting/simple-self-hosting-and-on-premises-options#アプリケーションファイル&パブリックリソースのセルフホスティング)を参照してください。タスクはコードスニペットおよびタグマネージャーインストール方法に表示され、**Implementation guide** リンクは指示を開きます。
#### タグマネージャータスク
**Tag Manager** インストール方法を使用すると、チェックリストには次のタスクが含まれます。
**Add this code to your Tag Manager** は、タグ管理システム経由で Kameleoon をインストールします。**Copy** をクリックしてコードをタグマネージャーインターフェースに貼り付けてから、**Mark as completed** をクリックします。**Implementation guide** リンクはインストール指示を開きます。
**Set up file synchronization** は、セルフホストされた Kameleoon アプリケーションファイルのコピーを最新の状態に保つことをカバーしています。これはコードスニペットの場合と同じタスクです。独自のサーバーまたは CDN でホストされているファイルと Kameleoon が生成する元のファイル間の同期を設定してから、**Mark as completed** をクリックします。タグマネージャータスクを完了すると、チェックリストは次の必須タスクとしてこれをリストします。
#### Shopify タスク
**Shopify** インストール方法を使用すると、グループは単一のタスクがあります。
**Installation via the Shopify app** は Shopify App Store の Kameleoon 統合経由で Kameleoon をインストールします。プロジェクトサイトコードをコピーして、Shopify でそれを使用して Kameleoon をサイトにインストールし、**Mark as completed** をクリックします。タスク内のリンクはインストールガイドラインを開きます。
#### クロスサブドメイントラッキングタスク
**Technical configuration** ステップで **Track visitors across listed subdomains** をオンにした場合、チェックリストには **Host the Kameleoon static HTML file** も含まれます。タスクはリストされたサブドメイン間のクロスサブドメインターゲティングを有効にします。HTML ファイルをダウンロードして、メインドメインの静的ディレクトリに公開アクセス可能なようにアップロードしてから、ホストされたファイルの完全な URL を入力して、**Mark as completed** をクリックします。
### フラグと機能実験用のタスク
**For your flags and feature experiments** グループは、Kameleoon SDK をインストールするタスクをリストします。
#### SDK をインストールするタスク
**Install the SDK** は必須タスクです。プログラミング言語向けの SDK インストールガイドに従い、プロジェクトに関連付けられたサイトコードを使用して SDK を初期化します。タスクはコピーボタン付きの **Project sitecode** を表示します。**Select your SDK** リストで SDK を選択して **Apply** をクリックします。SDK はリストの下のテーブルに表示され、テーブルの左側にドキュメントへのリンクがあります。完了したら **Mark as completed** をクリックします。
サイト、ウェブアプリ、またはモバイルアプリに SDK で Kameleoon をインストールするには、[client-side and mobile SDKs](../../developer-docs/feature-experimentation/get-started/overview#クライアントサイドまたはモバイル-sdk) のドキュメントを参照してください。
#### オプションのタグマネージャータスク
**Add this code to your Tag Manager** はオプションのタスクです。コードをコピーしてタグマネージャーインターフェースに貼り付け、Kameleoon をサイトにインストールしてから、**Mark as completed** をクリックします。タスクは **Mobile app** プラットフォームを持つプロジェクトには表示されません。そのチェックリストには **Install the SDK** タスクのみがあります。
セットアップを完了したら、[Manage your projects](./manage-your-projects) でプロジェクトの設定、同意、スクリプト、インストールを管理します。