概要 #
診断ページでは、フォームの回答内容に基づいて分類された診断結果が自動で表示されます。デザインビルダーを使用することで、診断結果の前後に画像・テキスト・装飾などを自由にレイアウトでき、視覚的にも訴求力のある結果ページを作成することが可能です。
各診断タイプ（例：おすすめの犬種、性格タイプなど）ごとに個別のレイアウトや表現ができるため、結果に応じたストーリー性や印象づけを演出しやすくなります。
なお、診断結果に対するグラフが編集不可オブジェクトとして自動挿入されますが、位置の移動は可能です。
■ 活用例
・診断結果に合った画像やイラストを追加して、視覚的にイメージしやすい構成に
・各タイプに合わせた背景カラーやレイアウトで「個性」を演出し、印象に残る
結果ページを作成
・おすすめ商品やサービスの紹介を診断結果の補足として表示し、次のアクションに自然に
つなげる
・SNS共有ボタンや感想アンケートを設置し、ユーザーのエンゲージメントを高める
・補足情報（例：飼い方のポイントや生活スタイルとの相性）を載せて理解を深める
①エディターの切り替え #
診断ページでの結果表示をカスタマイズしたい場合、診断カテゴリーごとに「デザインビルダー」を使用することで、テキスト・画像・動画などを自由にレイアウトできる診断結果ページを構築することができます。
■ 切り替え手順
① フォーム設定画面で「診断カテゴリー」一覧から、編集したいカテゴリーの右端にある「編集」アイコン（✎）をクリックします。
② 表示された「診断カテゴリー設定」画面で、右上にある「デザインビルダーを使用」ボタンをクリックします。
③ 切り替えが完了すると、プレビュー画像が表示され、その中央にある「編集」ボタンをクリックすることで、デザインビルダー編集画面に遷移できます。
【注意事項】
デザインビルダーを使用することで、診断結果の見せ方に柔軟性が生まれますが、「解説文」とゴールページを「グラフページ」とした場合の「グラフ挿入エリア」などの自動出力エリアは
編集不可オブジェクトとして扱われ、削除や内容の編集はできません（位置の移動は可能です）。
誤って削除・改変しようとすると、結果が正しく表示されないなどの不具合につながるため、構成変更は慎重に行ってください。
■ 活用ポイント
・診断タイプごとに異なる背景画像やアイコンを使い、個性ある結果画面を作成
・おすすめ商品の紹介や外部リンクを挿入し、次のアクションへ誘導
・診断結果に応じたアドバイスや詳細解説をレイアウトして、理解を深める構成に
各診断タイプごとにビジュアルと文章を最適化することで、ユーザー体験の質を高め、シェアや再利用につながる魅力的な結果ページを実現できます。
②デザインビルダーの起動画面 #
【診断ページでの編集不可オブジェクトに関する注意】
デザインビルダーを使用して診断ページを編集する場合、以下のエリアは編集不可オブジェクトとして表示されます。
● グラフ挿入エリア
診断結果のスコアや傾向を視覚化するためのグラフ出力エリアも、編集・削除不可のオブジェクトとして固定されます。
● 解説文
診断カテゴリー設定で入力されたコメント（解説文）も編集不可となり、内容を変更したい場合は元の設定画面から行う必要があります。
これらのオブジェクトは、診断機能の正常な動作に必要不可欠な要素です。
無理に削除・書き換えようとすると、診断結果が正しく表示されない、または構成崩れが発生する可能性があります。
必ず編集不可オブジェクトはそのまま残し、装飾や補足を行いたい場合は、前後のスペースにテキストや画像、セクションを追加する形式で構成してください。