診断コンテンツの作成

チュートリアル

Judgeで診断コンテンツを作成する流れを動画で確認してみましょう。


診断コンテンツの新規作成~URL公開まで

※システムアップデートにつき若干古い画面となっている部分があります

診断コンテンツ作成手順

診断コンテンツの骨格となる質問と選択肢の作成方法をはじめ、作成をサポートする便利な機能、合計得点の設定方法、レーダーチャート表示、SNSシェアボタンの設定方法などについて詳細に解説します。


ジャッジ新規作成

  1. Judgeにサインインし、>画面に移動。
  2. ボタンを押下。画面に遷移します。
  3. 画面の1~5に記載されている順番で診断コンテンツを作成していきます。
    診断コンテンツ作成のステップ

1. カバーウィンドウ作成

  • 診断コンテンツの概要を入力して保存しましょう。タイトル・詳細・画像を設定することができます。ここで入力した内容は診断コンテンツへのアクセス時に最初に表紙としてモーダル表示されます。

2. 質問・選択肢 作成

  • 画面に遷移するとパネルがあります。ガイドに従って質問と選択肢を作成していきましょう。保存が完了したら、再び画面に戻りましょう。
    質問・選択肢作成画面

診断ロジック

  • Judgeの診断ロジックは動的質問方式です。詳細についてはこちらで詳しく解説しています。

用語の解説

  • 紹介したい商材に導くための問いです。質問には複数の選択肢を登録することができ、関連する画像を1枚登録できます。
  • 質問に対する選択肢です。それぞれの選択肢に続く新たな質問を登録することができます。各選択肢が次の各質問に繋がっていることがポイントです。
  • 診断コンテンツの回答後に最後に到達するコンテンツのことです。診断結果の説明や商材へのリンクを登録することができます。
  • 特段の注記がない限り、ユーザーが作成した診断コンテンツのことです。ユーザーが画面から入力した説明・画像、画面で作成した質問・画像・選択肢・終端などのひとまとまりを指します。

ステップ

  1. 質問文を入力します。

    フォントサイズ・フォントカラーなどの設定や文字揃えなどの設定ができます。

    1画面1質問スライダーテンプレートを使用する場合は文章を中央揃え、縦型ステッパーテンプレートの場合は左揃えの設定をしておきましょう。デザインテンプレートを適用したときに綺麗な見栄えになります。

    質問入力欄
  2. playlist_addボタンで選択肢を新規追加します。
    選択肢追加
  3. 選択肢を入力していきましょう。質問と同様にフォントサイズ・フォントカラーなどの設定や文字揃えなどの設定ができます。

    選択肢編集

    次に選択肢の下部メニューの中のadd_circle_outlineボタンからその選択肢に後続する次の質問を新規作成して接続します。

    次の質問を作成
  4. 選択肢の下部にあるskip_nextボタンをクリックすると接続された次の質問が表示されます。
  5. 1~4を繰り返し、質問と選択肢を作成していきましょう。
  6. 選択肢に後続させる質問がなく診断結果を入力したい場合、check_box_outline_blank終端をチェックします。
    質問を診断結果に変える
  7. 質問が診断結果入力モードに切り替わります。診断結果の説明や商材等へのリンクを設定していきます。
  8. スイッチで、フローチャートが自動生成されます。ヌケモレ等をチェックしましょう。
    フローチャートの表示
  9. 編集を終了し、保存ボタンを押下します。

これだけです!あっという間に診断コンテンツの骨格である質問と選択肢の完成です。

Judgeでは、診断コンテンツの作成に際して以下のようなオプション機能を利用することができます。


終端共通ページ設定

  • 終端共通ページ設定では、終端に共用可能な任意のドキュメントを接続できます。

    このオプションを利用すれば、複数の終端で同一内容のドキュメントを表示したい場合、ドキュメントを重複して作成する手間を省くことができ便利です。

    add_circle_outlineボタンで新規の終端共通ページを作成できます。セレクトボックスには作成済の終端共通ページ一覧が表示されますので、任意のドキュメントを選択して接続しましょう。updateボタンでセレクトボックスの内容を最新状態に更新できます。

    終端共通ページは、 個別に保存する必要がある ことに注意が必要です。画面の最上部のsaveボタンを押下しても、終端共通ページ自体の更新内容は保存されません。

    終端共通ページ設定

合計得点算出設定

  • まず画面上部のトグルをONにして設定項目を表示します。

    このオプションでは、それぞれの選択肢を選んだ際のスコアを登録することができます。スコアを設定し終端の設定で合計得点チェックボックスにチェックしておくと、診断結果に到達した際にスコアを合計して表示することができます。※対応したデザインテンプレートを選ぶ必要があります。

    合計得点を表示させたくない場合は、終端の設定で合計得点チェックボックスをチェックしないようにしましょう。

    下図の例では、「質問A」の「選択肢Aー1」を選択した際の得点として「5点」を設定しています。

    選択肢を選択した際の得点を設定

項目別集計設定

  • まず画面上部のトグルをONにして設定項目を表示します。

    このオプションでは、各選択肢ごとに項目別スコアを設定することができます。項目別スコアを設定したうえでテンプレートを適用すると、終端で集計結果をレーダーチャートなどで図示することができます。※対応したデザインテンプレートを選ぶ必要があります。

    性格やスキルなどの長短を診断結果として表示する際に便利な機能です。

    並び順スコアも登録することができ、レーダーチャートなどで表示する際に集計項目の並び順に反映されます。

    項目別集計結果を表示させたくない場合は、各選択肢で集計項目をデフォルトのまま未登録にしましょう。

    項目別集計機能

SNSシェアボタン設定

  • まず画面上部のトグルをONにして設定項目を表示します。

    このオプションでは、診断結果ごとにSNSシェアボタンを設定することができます。シェア用カードのタイトル・説明・画像を診断結果ごとにユーザーが個別に設定できるため訴求力の高いSNSシェア機能を実現できます。Twitter・Line・Facebookに対応しています。 各項目の詳細はこちらをご参照ください。

    SNSシェアボタン設定機能

    Twitterシェア時のカード表示の例(下図)。カードの表示を検証する際は、ジャッジの公開オプションが公開[URL]であることを確認してください。その他の公開オプションでは外部のサービスが診断コンテンツにアクセスできません。

    シェア時のTwitterカード

YouTube動画挿入

  • まず画面上部のトグルをONにして設定項目を表示します。

    このオプションでは、質問または終端にYouTube動画を挿入することができます。

    診断結果ごとに動画を用意したり、各質問ごとに動画を用意し動画の中で質問を出題すれば、よりユニークなユーザー体験を提供することができます。


    https://www.youtube.com/watch?v=xxxxx形式の動画URLを直接指定できます。対象の動画URLをコピーしてJudge内で張り付けましょう。

    下記の従来方法でも埋め込み可能です。


    ※こちらは従来の方法です。

    YouTube動画の埋め込みURLは通常のURLとは異なります。埋め込みURLを取得するには、まずYouTube内で動画のボタンをクリックします。

    診断コンテンツへのYouTube動画の設定ステップ1

    次に、ボタンをクリックします。

    診断コンテンツへのYouTube動画の設定ステップ2

    下図のように埋め込みコードが表示されます。src=""内のURLが埋め込みURLです。コピーしてJudge内で張り付けましょう。

    診断コンテンツへのYouTube動画の設定ステップ3

3. 公開方法を選択

  • 画面に遷移します。リストから目的に合わせて作成した診断コンテンツの公開モードを選択しましょう。

    通常はを選択することになります。

    詳細はこちらで解説しています。

4. 本番データへ反映

  • 画面に遷移します。ボタンを押下することで、現在までの編集情報を本番環境にアップロードして確定します。

    本番データに反映されていない画像ファイルは数日で削除されます。忘れずに本番データへ反映しましょう。

    テンプレート購入後は本番データを更新することで利用可能になります。購入後に本番データを更新せずに利用しようとしても利用権限がない旨のエラーが表示されます。

5. テンプレートを選択

  • 画面に遷移して、作成した診断コンテンツのイメージに合うテンプレートを見つけましょう。

    診断コンテンツのデザインテンプレート

できること

  • ボタンから作成した診断コンテンツにデザインテンプレートを仮適用して動作確認することができます。表示には有効期限があり、アナリティクスに各種情報は反映されません。
  • video_settingsボタンをクリックすると、作成した診断コンテンツの公開URLと埋め込みコードを取得することができます。※ボタンが表示されるのは、マイページからボタンを押下した場合、かつ、テンプレートが無料または購入済の場合です。

    本サイト上で公開したい場合はボタンから公開URLを取得することができます。自社サイトなどに診断コンテンツを埋め込みたい場合は、ボタンから埋め込みコードを取得しましょう。

  • Judgeでは、無料でご利用いただけるテンプレートと購入してご利用いただけるテンプレートを豊富に用意しています。購入したテンプレートは期限なくご利用いただくことができます。

診断コンテンツ作成時の補助機能

Judgeでは、診断コンテンツの作成に際して以下のような便利な補助機能を利用することができます。


フローチャート自動生成

  • 画面上部の トグルをONにすれば、作成した質問と選択肢の構造を図で確認することができます。

    フローチャート自動生成機能

    editボタンからフローチャート全体に対する様々な設定を行うことができます。 フォントサイズ、フォントカラー、フローチャートの向き、質問画像の有無、コネクタの種類、選択肢に表示する情報の制御、各種パディングなど非常に自由度の高い調整が可能です。お気に入りのフローチャート設定を探してみましょう。

    フローチャートの設定

    フローチャート上の個別の質問や選択肢をクリックするとPOPメニューが表示され、質問編集画面への遷移やフォントサイズの調整などを行うことができます。

    saveボタンをクリックすると、フローチャートの設定を保存・再現することができます。

全パス探索

  • 専門的で複雑な診断の場合、フローチャートで図示しても矢印が入り乱れて見にくく診断の流れが追いにくい場合があります。Judgeでは、対象の質問や終端に至るまでの全ての質問と選択肢を探索し、表示する機能があります。の各パネルからご利用になれます。

    特定の質問の後続の質問も同時に確認することができます。

    全パス探索機能
keyboard_double_arrow_right NEXT