たかし Back to Works
Home / Works / 予約管理システム
Webアプリ×予約

予約管理システム

電話と紙の予約台帳を、24時間受付のWeb予約に

予約管理システム
Overview

概要

飲食店をモデルに、お客様向けの予約画面と店舗向けの管理画面をセットで構築したWeb予約システムです。お客様は人数を選ぶと1週間分の空席が◯×で表示され、日時とコースを選んでそのまま予約を確定できます。予約が入るとカウンター・テーブル・個室の空き状況から席が自動で割り当てられ、店舗の管理画面に即座に反映。電話で受けた予約も同じ台帳に登録できます。コース・営業時間・臨時休業日・お知らせ文は管理画面から変更でき、予約画面にすぐ反映されます。「席」と「滞在時間」の考え方を置き換えれば、美容室・整体・教室・相談会など他業種の予約にも応用できる設計です。お客様画面と管理画面が連動する動くデモを公開しています。

Challenge

課題

予約の受付が電話だけのため、営業中は調理や接客の手を止めて電話に出る必要があり、営業時間外の予約は取りこぼしていました。紙の予約台帳では席の空き状況がひと目で分からず、二重予約や聞き間違いのリスクもあります。一方で、予約サイトは手数料や月額費用がかかり、小さなお店には負担が大きいという課題がありました。

Approach

アプローチ

お客様が自分で空席を確認して予約できるWeb予約画面と、店舗が予約を一元管理する管理画面を1つのシステムとして構築しました。予約の受付時には、人数と滞在時間から空いている席を自動で探して割り当てるため、空席表示と実際の席が常に一致し二重予約が起こりません。1〜2名はカウンター優先、3〜4名はテーブル優先といった店舗ごとの席の使い方もロジックに組み込んでいます。複数店舗での利用を想定したデータ設計(マルチテナント)にしています。

Features

主な機能

  • 01
    1週間の空席カレンダー
    人数とコースを選ぶと、滞在時間を考慮した空席が◯×で表示。タップするだけで日時を選べる。
  • 02
    席の自動割り当て
    カウンター・テーブル・個室の空きを時間帯ごとに計算して自動で席を確保。二重予約を仕組みで防ぐ。
  • 03
    予約台帳の一元管理
    Web予約も電話予約も同じ台帳に。日付・名前・電話番号で検索でき、確定・来店済・キャンセルなどのステータスを管理。
  • 04
    本日の席の埋まり具合
    ダッシュボードで席ごとの予約を時間軸で表示。今日どの席がいつ空くかがひと目で分かる。
  • 05
    コース・営業時間を管理画面で変更
    コースの公開切替、曜日ごとの営業時間、臨時休業日、お知らせ文を変更するとお客様の予約画面にすぐ反映。
  • 06
    他業種への応用
    「席」を施術台・講師・部屋に置き換えれば、美容室・整体・レッスン・相談会の予約にもそのまま応用できる設計。
Stack

技術スタック

  • Next.js
  • / TypeScript
  • / Supabase
  • / PostgreSQL
  • / Tailwind CSS
  • / Vercel
Results

成果

24時間
予約受付
自動で防止
二重予約
0円
予約手数料
Next

類似のシステム開発をご検討ですか?

現場の課題に沿った仕組みづくりをご支援します。お気軽にご相談ください。

More

他の事例も見る