ツアー予約サイト

BayTrip

お客様が自ら出発日を選び、シーズン別の料金をその場で確認。湾の旅をわずか数分で予約できます。

BayTrip — ツアー予約サイト
クライアント
湾岸エリアでツアーと宿泊を手がける旅行会社
業界
観光
サービス
Webサイト制作
開発期間
13週間
年
2026

プロジェクト概要

対応範囲

UX/UIデザインツアー予約サイトオンライン決済料金管理

クライアントは、短期のクルーズツアー、カヤック、島めぐりを企画し、湾周辺の提携ホテルでの宿泊も提供しています。予約の大半は代理店やSNS経由で、メッセージのやり取りで成約していました。夏の繁忙期には、営業チームが空き状況の確認と見積りの再作成を手作業で繰り返さなければなりませんでした。

BayTripのWebサイトは、個人客が自分でツアーと客室を予約できるようにするために構築しました。空席のある出発日を確認でき、シーズンに応じて変わる料金も明瞭で、オンラインで決済してすぐに確認通知を受け取れます。これにより、仲介チャネルへの依存を減らし、1件あたりの利益率を改善することを目指しました。

課題

01

シーズンや日によって変わる料金

ツアー料金や客室料金は、繁忙期・閑散期、週末、祝日で異なり、さらに子ども料金やシングルルームの追加料金もかかります。

02

各便の限られた席数

クルーズ船や客室の定員は決まっており、2人のお客様が最後の1席を同時に決済しようとするケースも確実に処理する必要がありました。

03

天候による日程への影響

天候によってツアーが延期になることもあるため、日程変更、返金、予約済みのお客様への一斉通知の仕組みが求められました。

GREEN TECHのソリューション

NestJSとPostgreSQLで、シーズン、曜日、利用者区分ごとの料金ルールを構築し、運営チームが開発者に頼らず自ら調整できるようにしました。お客様が決済を始めると数分間だけ席を仮押さえし、決済が成功した時点で確定させることで、二重販売をなくしています。アカウント認証と画像の保存はSupabaseが担い、Next.jsとTailwind CSSによるフロントエンドは、多くの旅行者が情報収集や予約に使うスマートフォンでの表示速度を優先して設計しました。

主な機能

見やすい出発日カレンダー

月ごとのカレンダーで空席のある日、残りわずかな日、参考料金を表示し、お客様がすばやく比較して選べるようにしています。

明瞭なシーズン別料金

日付、人数、客室タイプを選ぶとすぐに総額を計算し、追加料金の内訳もひとつずつ明示します。

ツアーと宿泊のセットプラン

ツアーと提携ホテルの客室をひとつの予約にまとめ、セットで予約すると自動的に特典が適用されます。

オンラインでの決済と日程変更

カード、電子ウォレット、銀行振込で決済でき、予定が変わった場合もお客様が規定に沿って自分で日程を変更できます。

導入の成果

+36%

直接予約数

-18%

仲介手数料

3分

予約完了までの時間

最初の繁忙期を終えた時点で直接予約の比率が大きく伸び、仲介チャネルと手数料への依存が軽減されました。営業チームは手作業での見積り作成から、団体客やパートナーへの対応へと業務の軸足を移しています。天候によって日程を変更せざるを得ない場合も、お客様への通知と日程変更は管理画面での数回の操作だけで完了します。

使用技術

React / Next.js
Tailwind CSS
NestJS
PostgreSQL
Supabase
今すぐお問い合わせ!

次のプロジェクトのアイデアをお持ちですか?

貴社の目標をぜひGREEN TECHにお聞かせください。ご要望を分析したうえで最適なソリューションをご提案し、詳細なお見積りを無料でお送りします。

無料相談はこちら

お問い合わせ

貴社のプロジェクトを
今日から始めましょう

協業のご相談

または、こちらへ直接メールでご連絡ください:

  • 24時間以内にスピーディーに対応。
  • 専門家と直接やり取りが可能。
  • 明確な戦略をご提案。