無料相談
無料で相談する

CASE FILE

CASE STUDY Webサイトの診断・案内

3つの質問に答えるだけで、通い方とおすすめのプログラムを提案するWeb診断

福祉サービス事業所のWebサイトに、3つの質問から通い方・おすすめのプログラム・1週間の時間割の例を提案する診断を組み込みました。診断結果は、お問い合わせフォームへ自動で引き継がれます。

業種
福祉サービス（就労移行支援）
制作期間
約2ヶ月
参考価格
20万円
開発形式
Webサイトへの組み込み（WordPress）

お客さまに掲載許可をいただいた範囲で、一部の情報を匿名化しています。掲載している画面は、実際の画面をもとにサンプルデータで再現したものです。

  1. BEFORE

    改善前

    通い方やプログラムの情報が、紹介資料や各ページに分かれていて、自分の場合に当てはめて考えにくい。

  2. IMPLEMENTATION

    導入した仕組み

    3つの質問に答えると、回答の組み合わせに合った通い方・プログラム・時間割の例を表示する診断ページ。

  3. AFTER

    改善後

    自分向けに整理された提案を見てから、見学・体験のお問い合わせへ。事業所は診断結果を見て、事前に準備できる。

01PROBLEM

どのような作業に困っていたか

ご相談前の状況

就労移行支援サービスの利用を考えているご本人やご家族は、「どのくらいのペースで通えるか」「何を学べるのか」といった不安を抱えた段階でサイトを訪れます。サイトの目的は、そうした方に見学・体験へ進んでもらうことです。

ただ、通い方やプログラムの情報は紹介資料や各ページに分かれており、自分の場合に当てはめるには、訪問者が自分で情報を集めて整理する必要がありました。そこで、初めてサイトを訪れた方にも分かりやすく伝えたいという思いから、診断ページを作りたいとご相談をいただきました。

利用する方
サービスの利用を検討しているご本人・ご家族
訪問者の不安
どのくらいのペースで通えるか、何を学べるか
サイトの目的
見学・体験・お問い合わせにつなげること
求められたこと
迷わず答えられること、納得できる提案、お問い合わせへのスムーズなつながり

02SOLUTION

課題に対して、どのような仕組みを組み立てたか

質問は3つ・各3択に絞り、迷わず答えられる形にしました。結果は、回答の組み合わせごとに用意した対応表から選びます。時間割は全19パターンです。

結果の判定にはAIを使っていません。福祉サービスの案内として、事前に用意した内容だけを表示し、同じ回答なら必ず同じ結果になることを優先しました。一方、制作ではAI（Claude Code）を活用し、コードの作成や、Excelで整理した時間割の元データをプログラム用のデータへ変換する作業を効率化しています。

03FLOW

処理の流れ

  1. INPUT 3つの質問に、それぞれ3つの選択肢から答える
  2. PROCESS 1 未回答の質問があれば、ページ内でその場で案内する
  3. PROCESS 2 回答の組み合わせから、用意した対応表の結果を選ぶ
  4. PROCESS 3 回答ごとの解説文と、1週間の時間割の例を表示する
  5. OUTPUT 診断結果を、お問い合わせフォームへ自動で引き継ぐ

04FEATURES

実装した機能

  • F01

    回答の組み合わせで結果を切り替え

    3つの質問の回答から、全19パターンの時間割と、回答ごとの解説文を表示します。

  • F02

    入力漏れの防止

    未回答のまま進もうとすると「質問〇が未選択です」とページ内で案内します。

  • F03

    結果をお問い合わせへ引き継ぎ

    診断結果を保持し、お問い合わせフォームに自動で入力します。書き写す手間がかかりません。

  • F04

    スマホで見やすい時間割

    画面が狭いときは時間帯の列を固定し、横にスクロールして見られるようにしました。

  • F05

    回答に寄り添う解説文

    回答ごとに具体的な解説を表示し、提案に納得感を持たせています。

  • F06

    プラグインに頼らない実装

    診断専用のプラグインを使わずに構築し、表示の軽さと保守のしやすさを確保しました。

05SCREEN

画面・操作の様子

  • 質問画面（サンプル）。3つの質問に3択で答える。未回答の質問があると、ページ内で案内する
  • 結果画面（サンプル）。回答ごとの解説と、1週間の時間割の例を表示する
  • スマホでの結果画面（サンプル）。時間帯の列を固定し、時間割を横にスクロールして見られる

06RESULT

導入による変化

訪問者は、3つの質問に答えるだけで、自分に合った通い方とおすすめのプログラム、1週間の過ごし方の例をその場で確認できるようになりました。結果画面からは、プログラム紹介や見学・体験のお問い合わせへそのまま進めます。

診断のあとにお問い合わせがあると、診断結果もあわせて届くため、事業所は相談者の希望する通い方や学びたいことを把握したうえで対応できます。面談や見学に向けた事前準備がしやすくなりました。

  • 訪問者情報を自分で集めて整理 → 3つの質問で自分向けの提案を確認
  • お問い合わせ診断結果が自動で入り、書き写す手間がない
  • 事業所の対応相談者の希望を把握でき、事前準備がしやすくなった

07SCOPE

対応範囲

  1. 01 ヒアリング （対応）
  2. 02 業務整理 （対応）
  3. 03 提案 （対応）
  4. 04 設計 （対応）
  5. 05 開発 （対応）
  6. 06 テスト （対応）
  7. 07 操作説明 （対応）
  8. 08 公開・環境設定 （対応）

08DATA & AI

データ・AIの取扱い

処理する環境
Webサイトのサーバー内で判定（外部のサービスには送信しない）
外部AIの使用
診断の動作には使用しない（制作にはClaude Codeを活用）
機械学習への利用
外部のAIに回答を送らないため、学習に使われることはない
データの保存
回答はデータベースに保存しない。結果はブラウザ内に一時的に保持し、お問い合わせを送信した場合のみメールで届く
人による確認が必要な部分
判定のルールと結果の文面は事前に用意し、AIによる自動生成はしない

データ・AIの取扱い方針を見る

09INFORMATION

案件情報

掲載種別
CASE STUDY（実績）
業務カテゴリー
Webサイトの診断・案内
業種
福祉サービス（就労移行支援）
開発形式
Webサイトへの組み込み（WordPress）
使用環境
WordPress・パソコン／スマホのブラウザ
制作期間
約2ヶ月
参考価格
20万円
対応範囲
ヒアリング・業務整理・提案・設計・開発・テスト・操作説明・公開・環境設定

LET'S BUILD YOURS

この事例に近い作業について相談する

完全に同じ業務でなくても問題ありません。
現在の作業方法を伺い、どのような形にできるかをご提案します。

無料相談を申し込む

関連する対応例・実績

対応例・実績の一覧へ戻る