DAMIANO
VENTURA
ショーケースに戻るお話ししましょう
05 / 舞台芸術 / 予約 / スタジオ運営

Adele Deliss

カスタム 3D シーンによる舞台表現と、レッスン予約・受講プラン・メール管理を統合したスタジオワークスペースを兼ね備える、エアリアルアーティストのための多言語プラットフォーム。

構想から実装までのプロダクトデザインと Full-Stack エンジニアリング
デジタル舞台からスタジオ運営まで

カスタム 3D 舞台美術

シルクやエアリアル器具を用いたインタラクティブな 3D シーンがアーティストの舞台表現を Web 上に再現。環境に応じた自動最適化レンダリングと洗練された静的フォールバック表示を備えています。

スタジオクラスとサブスクリプション

定期クラス、サブスクリプション受講枠、出席追跡、休講ルールによって、受講生ポータルとアーティストの管理画面を緊密に連携させます。

統合型 Mailroom

受信した問い合わせ、会話スレッド、添付ファイル、ブランド統一された返信メールを、管理ワークスペース内で直接一元管理します。

実現へのプロセス

背景と課題

世界の舞台と、日々のレッスン。

イベント主催者には公演実績を把握し連絡できる手段が必要であり、新規の受講希望者にはスムーズなレッスン申請、継続受講生にはクラス日程や出席状況を確認できる仕組みが必要でした。またスタジオを運営する Adele にとっては、問い合わせ対応、スケジュール調整、受講生との連絡に追われず、細部まで把握できる管理体制が不可欠でした。

変革とソリューション

表現力豊かなデジタル舞台。実用的なスタジオ運営システム。

カスタム 3D エアリアルシーンと多言語展開を核とした公開 Web サイトを設計・開発しました。その裏側では、受講生専用ポータルと管理ワークスペースがレッスンの承認、定期クラスのスケジュール、受講プラン、スタジオメールを単一の連携システムとして統合しています。

担当領域と責任

プロダクトデザイン、フロントエンドおよびバックエンドの開発、スケジュール・受講プランのロジック、受講生ポータルと管理者ワークスペース、メール基盤、そしてクライアント提供のアートワークを世界観に落とし込んだカスタム 3D シーンの制作。

プロダクト体験
01 / 04LIVE SITE
AD / カスタム 3D 舞台美術
カスタム 3D 舞台美術

カスタム 3D 舞台美術

シルクやエアリアル器具を用いたインタラクティブな 3D シーンがアーティストの舞台表現を Web 上に再現。環境に応じた自動最適化レンダリングと洗練された静的フォールバック表示を備えています。

02 / 04プロダクトの実績・実証
AD / レッスン申請と受講生アカウント
レッスン申請と受講生アカウント

レッスン申請と受講生アカウント

受講生はレッスンの空き状況確認や受講申請を行い、専用のアカウント領域から予約履歴や出席状況を一元管理できます。

参考画面 · サンプルデータ

03 / 04プロダクトの実績・実証
AD / スタジオクラスとサブスクリプション
スタジオクラスとサブスクリプション

スタジオクラスとサブスクリプション

定期クラス、サブスクリプション受講枠、出席追跡、休講ルールによって、受講生ポータルとアーティストの管理画面を緊密に連携させます。

参考画面 · サンプルデータ

04 / 04プロダクトの実績・実証
AD / 統合型 Mailroom
統合型 Mailroom

統合型 Mailroom

受信した問い合わせ、会話スレッド、添付ファイル、ブランド統一された返信メールを、管理ワークスペース内で直接一元管理します。

参考画面 · サンプルデータ

プロダクトの実績・実証

カスタム 3D 舞台美術

シルクやエアリアル器具を用いたインタラクティブな 3D シーンがアーティストの舞台表現を Web 上に再現。環境に応じた自動最適化レンダリングと洗練された静的フォールバック表示を備えています。

クリエイティブエンジニアリング

空中パフォーマンスの優美な躍動を Web の世界へ。

Web サイトの世界観は、エアリアルパフォーマンスから直結して形作られています。シルク、フープ、ポール、ストラップは単なる写真ギャラリーにとどまらず、インタラクティブな 3D シーンとして表現。ライト/ダークテーマや、視覚効果を抑制する Reduced Motion ビューも設計当初から標準実装されています。

スタジオ運営

スタジオの実際の指導スタイルに合わせて設計されたシステム。

初回のレッスン申請にはアーティストの個別承認が必要であり、定期受講サブスクリプションでは毎週の定期クラス枠が予約されます。すべての予約を画一的な汎用フォームに押し込めるのではなく、空き状況、クラス日程の自動生成、定員枠、出欠、受講生アカウントを連動させた独立の業務フローとして構築しました。

レッスン申請
  1. 受講生の申請
  2. アーティストの承認
  3. 確定レッスン
定期クラス
  1. 週次クラス
  2. 日程別セッション
  3. 確保された受講枠
  4. 出席管理

申請は辞退や別日程の提案も可能です。定期サブスクリプションの受講枠には、独自の予約・出席ルールが適用されます。

インハウスコミュニケーション

スタジオワークスペースに組み込まれた Mailroom。

公演への問い合わせ、レッスン申請、受講生からの返信をクラススケジュールと同一画面で管理できるよう、Mailroom を構築しました。受信メール、会話スレッド、全文検索、添付ファイル、ブランド統一された返信メールをすべて管理者ワークスペースに統合しています。

メール処理フロー
  1. 受信メール
  2. メール原本とスレッド
  3. 安全なメール閲覧ビュー
  4. 返信送信
FULL-STACK アーキテクチャ

明快なビジネスルールと、クリーンなインフラ境界。

公開 Web サイト、受講生ポータル、管理者ワークスペースは型安全なサービス契約を介して相互に連携します。スタジオの業務ルールがデータベースやメール処理コードから明確に分離されているため、スケジューリングロジックをローカルでテストし、Cloudflare 上で高信頼に稼働させることができます。

導入後の変化と成果

舞台表現とスタジオ運営を支える単一の統合システム

訪問者はアーティストの作品を鑑賞し公演やレッスンを依頼でき、受講生は専用アカウントで予約や出欠を自己管理。Adele はクラス編成、受講プラン、出欠確認、メール対応を一元的に遂行できます。

目的を持った技術選定

アプリケーションの基盤は Next.js、React、TypeScript で構築し、Three.js、GSAP、Lenis がインタラクティブな公開体験を駆動します。Cloudflare Workers 上で OpenNext により Next.js アプリケーションを稼働させ、レコード管理には D1、未加工のメール保管には R2 を採用。Better Auth が受講生アカウントの認証を担い、Resend による送信メール配信、Cloudinary によるメディア配信を統合しています。

学びと総括

このプロジェクトの最大のやりがいは、まったく性質の異なる2つの側面を結びつけた点にありました。アーティストの舞台上での表現力をWeb上で生き生きと伝える体験を創出しながら、日々のスタジオ運営を確実に支える実用的なツール群を構築したことです。

次のプロジェクト / 01New Leasing
ご相談やアイデアをお持ちですか?

価値あるプロダクトを、 共に創りましょう。

新しいプロダクト、より優れたシステム、挑む価値のある困難な課題。

[email protected]