Flying High Works Webシステム機能デモサイト

Webシステムは、完成後の画面や操作感を事前にイメージしにくく、管理画面や検索機能についても、言葉や静止画だけでは具体的な仕様を共有しにくいという課題があります。
そこで、提案や要件整理の段階から実際の機能を操作し、検索速度、管理画面の使い勝手、会員登録からマイページへの流れなどを確認できるデモ環境を構築しました。

一般公開されたデモ用管理画面にログインし、お知らせ投稿、画像アップロード、会員管理、管理ユーザーの追加などを実際に操作できる構成にしました。
共通のデモアカウントを公開しながら、利用者ごとにデモセッションを発行しています。管理画面で登録した会員・お知らせ・管理ユーザー・操作履歴などは、デモセッション単位で分けて保存され、ほかのデモ利用者の管理画面には表示されません。
また、期限を過ぎたデモセッションと関連データを定期的に整理する仕組みを設け、一般公開された管理画面を継続して試せるようにしています。

誰でも操作できる公開管理画面を用意しながら、利用者ごとにデモ用のデータ領域を分離しています。検索、会員、予約、投稿、フォーム、ページ編集といったWebシステムの主要機能を、実際の画面で横断的に確認できる構成です。

公開管理画面 / ユーザー・ロール・権限管理 / 会員登録・マイページ / お知らせ投稿 / 画像アップロード / リッチテキスト編集 / 地域・市区町村・駅・路線検索 / 地図検索 / お気に入り・閲覧履歴 / 簡易予約 / フォーム作成 / ブロックページ作成 / 概算見積もり / CSV出力 / 操作ログ

Google Maps API / Google Places API / メール送信 / Google Tag Manager / Google Analytics / Microsoft Clarity

全国39,424件の検索データを扱うため、表示用データのJSON化とキャッシュを採用しています。大量の検索URLに対応した静的サイトマップの分割生成、メール送信のキュー処理、デモセッションと関連データの定期削除など、一般公開後の負荷と運用も考慮しています。

多くのデモ機能があっても目的の画面を探しやすいよう、トップページでは機能ごとに入口を分けています。
管理画面のログイン情報や操作できる内容も画面上に明示し、初めて訪れた方でも、検索機能や管理画面をすぐに試せる構成にしました。管理画面にはAdminLTEを採用し、業務システムとして見慣れた操作性を意識しています。

Laravel 12をベースに、管理者認証とフロント会員認証を分離して実装しています。
公開管理画面では、デモセッションIDを会員・投稿・管理ユーザー・フォーム・ページ・予約・操作ログなどに紐づけています。一覧取得時の絞り込みだけでなく、詳細表示・更新・削除時にもセッションの一致を確認し、ほかの利用者のデータを操作できないようにしています。
検索機能では、大量データを毎回データベースから組み立てないよう、表示用データのJSON化やキャッシュを採用しています。また、多数の検索URLに対応するサイトマップを事前生成し、分割して配信する構成にしています。