OurTubeRooms - リアルタイム動画共有ルームプラットフォーム

友人やコミュニティと一緒に動画を視聴し、リアルタイムでコミュニケーションできるバーチャルルームプラットフォームを開発しました。離れた場所にいても、同じ空間で動画を楽しむ体験を提供します。

プロジェクト概要

• リアルタイム動画共有ルーム
• 同期再生機能
• ルーム内チャット
• プライベート・パブリックルーム設定

依頼者の目指した目標と解決したい課題

コロナ禍以降、オンラインでの交流が増える中、「一緒に動画を見る」という体験をオンラインで再現したいというニーズが高まっていました。既存のビデオ通話ツールで画面共有する方法はありますが、同期のズレや操作権限の問題があり、スムーズな共同視聴体験が実現できていませんでした。

開発したシステムの特徴

このプラットフォームは、複数のユーザーが同じ「ルーム」に集まり、動画を同期して視聴できる環境を提供します。主な機能として：

• リアルタイム同期: ルーム内の全ユーザーで動画が自動同期
• ルーム管理:
  • パブリックルーム: 誰でも参加可能
  • プライベートルーム: 招待制の限定公開
• 動画プレイリスト: ルーム内で次に見る動画をキューに追加
• ルーム内チャット: 動画を見ながらリアルタイムでコミュニケーション
• ルームホスト機能:
  • 再生・一時停止の制御
  • 動画の追加・削除
  • 参加者の管理
• セッション管理: ユーザーの入退室をリアルタイムで反映

技術的背景

Ruby on Rails 8をベースに、WebSocketを活用したリアルタイム通信を実装しました。Action Cableにより、ルーム内のすべてのユーザーに対して動画の再生状態（再生/一時停止、シーク位置、現在時刻）を即座に同期します。

データベース設計では、以下のモデルを中心に構築：

• Room: ルーム情報（公開設定、作成者）
• Video: 動画情報（YouTube動画ID、タイトル、長さ）
• RoomVideo: ルームと動画の関連（プレイリスト順序）
• User: ユーザー情報
• Session: ユーザーのルーム参加状態

Rails 8の新機能を活用し、Turboによる高速なページ遷移、StimulusコントローラーによるインタラクティブなUI/UXを実現しています。

解決された問題

このプラットフォームにより、離れた場所にいる友人や家族と「一緒に動画を見る」体験が可能になりました。映画鑑賞会、勉強会、ファンコミュニティでの動画視聴など、様々なシーンで活用されています。リアルタイム同期により、全員が同じ瞬間を共有でき、チャット機能で感想を即座に共有できます。

チーム構成

• (KW) プロジェクトマネージャー
• (KW) バックエンドエンジニア×2
• (KW) フロントエンドエンジニア
• (KW) UIデザイナー

(KW) はKaito Wingsが担当

プロジェクト期間

• 要件定義・設計 - 1.5ヶ月
• MVP開発 - 3ヶ月
• リアルタイム機能実装・調整 - 2ヶ月
• ベータテスト - 1ヶ月

システム構成

• Ruby on Rails 8 / PostgreSQL
• Action Cable (WebSocket)
• Turbo / Stimulus.js
• Tailwind CSS
• YouTube Iframe API
• Kamal (デプロイ)