データよりもアニメーション
美しい Framer サイトでも、何がコンバージョンするかの証拠が必要です。ヒートマップとリプレイが訪問者の実際の行動を示します。
なぜ重要なのか
Framer チームがついに見られるもの
離脱が見えない
CTA とフォームのイベントを追跡してファネルを構築し、訪問者が離脱するステップを見つけましょう。
セッションを確認する方法がない
セッションリプレイで実際の訪問を確認でき、ためらいや混乱を理解できます。
セットアップ
PulsePanda を Framer に追加
Site Settings → General → Custom Code を開き、Start of <head> tag ボックスにスニペットを貼り付けて公開します。
Framer — Site Settings → Custom Code → Start of <head>
<script
src="https://pulsepanda.dev/sdk.js"
data-project="YOUR_PROJECT_ID"
defer></script>カスタムコードは公開済みの Framer サイト全体に適用されます。スニペットを有効にするには再公開してください。
ワークフロー
インストールからインサイトまで
スニペットをインストールする
Framer プロジェクトに一度スクリプトを追加するだけです。ウェブ分析、自動キャプチャされたクリック、セッションリプレイ、ヒートマップがすぐに収集を開始します。
重要なことを追跡する
主要なアクションでは pulsepanda.track() を、ログイン後には pulsepanda.identify() を呼び出して、イベント、セッション、フィードバックを各ユーザーに紐づけます。
データに基づいて行動する
ファネルを構築し、離脱の背後にあるリプレイを確認し、ヒートマップを読み、プロダクト内フィードバックを収集できます — すべて1つのワークスペースで。
得られるもの
1つのスニペットで全体像を把握
| 分析レイヤー | ページビュー、カスタムイベント、コンバージョンファネル、リテンション。 |
|---|---|
| 行動レイヤー | セッションリプレイ、クリックとスクロールのヒートマップ、エラーコンテキスト。 |
| フィードバックレイヤー | プロダクト内アンケート、フィードバックウィジェット、フォーム、機能投票ボード。 |
よくある質問
Framer に関する質問
Framer でスニペットをどこに追加しますか？
Site Settings → General → Custom Code の「Start of <head> tag」フィールドの中。公開済みサイトのすべてのページで読み込まれます。
Framer の無料プランで動作しますか？
カスタムコードには有料の Framer サイトプランが必要です。利用可能になったら、head セクションにスニペットを貼り付けて公開します。
コンバージョンを測定できますか？
はい。PulsePanda はクリックを自動キャプチャし、カスタムイベントに対応しているため、訪問からサインアップや購入までのファネルを構築できます。
関連ページ
もっと見る
Framer アプリに分析を追加
一度インストールするだけで、数分で分析、セッションリプレイ、ヒートマップ、ファネル、フィードバックを接続できます。
無料で始める