📋 PRD（製品要件定義書）
「バスケしようよ！」のプロダクト要件をまとめたドキュメントです。
1. 概要
草バスケプレイヤーのための、日本最大のピックアップゲーム・コミュニティマッチングサイト
背景・課題
📍 場所の課題
- • 体育館やコートの予約が難しい
- • ピックアップゲームの情報がない
👥 仲間の課題
- • 1人では参加しづらい
- • 対戦相手が見つからない
- • 急に人数が足りなくなる
解決策
- ✓募集（ピックアップゲーム）の簡単な作成・検索・参加
- ✓バスケプレイヤー同士のコミュニティ形成
- ✓圧倒的なネットワーク効果による日本一のプラットフォーム化
2. ターゲットユーザー（ペルソナ）
田中さん（28歳）- 社会人プレイヤー
- • 学生時代にバスケ部だったが、社会人になってプレイ機会が減少
- • 週末にバスケをしたいが、一緒にプレイする仲間がいない
- • 気軽に参加できるピックアップゲームを探している
鈴木さん（35歳）- 初心者プレイヤー
- • 最近バスケに興味を持ち始めた
- • 経験者ばかりの中に入るのは気が引ける
- • 初心者歓迎の募集を探している
山田さん（32歳）- 募集主催者
- • 定期的にピックアップゲームを開催している
- • 毎回SNSで参加者を募集するのが手間
- • 効率的に参加者を集めたい
3. ユーザーストーリー（MVP）
US-1: ユーザー登録・ログイン
ユーザーとして、メールアドレスでアカウントを作成・ログインできる。 それによって、募集への参加や作成ができるようになる。
US-2: パスワードリセット
ユーザーとして、パスワードを忘れた場合にメールで再設定できる。 それによって、アカウントへのアクセスを回復できる。
US-3: プロフィール作成・編集
ユーザーとして、プロフィール（ポジション、身長、活動エリア等）を3ステップで作成・編集できる。 それによって、適切なレベルの募集に参加しやすくなる。
US-4: 募集作成
主催者として、3ステップで募集を作成し、SNSで共有できる。 それによって、効率的に参加者を募集できる。
US-5: 募集検索・フィルタリング
ユーザーとして、エリア・日付・レベル等の条件で募集を検索できる。 それによって、自分に合った募集を見つけられる。
US-6: 募集参加申請
ユーザーとして、募集に参加申請し、主催者へメッセージを送れる。 それによって、ピックアップゲームに参加できる。
US-7: 参加者管理
主催者として、参加申請の承認・拒否と参加者一覧の管理ができる。 それによって、適切なメンバーで募集を運営できる。
US-8: メッセージ機能
ユーザーとして、主催者・参加者とチャットでメッセージのやり取りができる。 それによって、詳細確認や連絡ができる。
US-9: 通知機能
ユーザーとして、参加承認・申請・メッセージ・リマインダー等の通知を受け取れる。 それによって、重要な情報を見逃さない。
US-10: マイページ
ユーザーとして、参加予定・履歴・設定を一覧で確認しログアウト・アカウント削除ができる。 それによって、自分の活動を管理できる。
US-11: 管理者機能
管理者として、ユーザー・募集・通報をダッシュボードで管理できる。 それによって、サービスの安全な運営ができる。
US-12: エラーハンドリング
ユーザーとして、認証切れ・ネットワーク障害・権限エラー時に適切な案内を受けられる。 それによって、問題発生時も迷わず対処できる。
4. 画面構成（28画面）
デザインプレビューで定義済みの全画面一覧です。
認証・プロフィール（6画面）
トップページ(未ログイン)、ログイン、新規登録、パスワードリセット、プロフィール作成、プロフィール編集
募集（8画面）
ホーム(ログイン後)、募集一覧、募集詳細、募集編集、募集作成(3ステップ)、作成確認、作成完了、参加者管理
参加申請（2画面）
参加申請(確認)、参加申請(完了)
コミュニケーション（3画面）
チャット(一覧+会話)、通知一覧、プロフィール閲覧
ユーザー管理（1画面）
マイページ(参加予定/履歴/設定)
管理者（4画面）
ダッシュボード、ユーザー管理、募集管理、通報管理
エラー（4画面）
認証エラー、ネットワークエラー、権限エラー、データエラー
5. アクセシビリティ要件
WCAG 2.1 レベル AA 準拠を目標とし、すべてのユーザーが利用可能なサービスを目指す
⌨️キーボード・スクリーンリーダー対応
🎨カラーコントラスト・色覚対応
🏗️セマンティックHTML・構造
🧩コンポーネント別要件
| コンポーネント | 要件 |
|---|---|
| Button | disabled 時に aria-disabled="true"、role="button" 確保 |
| Input | <label> 必須、エラー時 aria-invalid="true" + aria-describedby でメッセージ紐付け |
| Modal | aria-modal="true"、開閉時のフォーカス管理、Escape キーで閉じる |
| BottomNav | <nav aria-label="メインナビゲーション">、現在タブに aria-current |
| Badge | 重要な情報は sr-only テキストを併記 |
| EventCard | カード全体をリンクにする場合、内部リンクの重複を避ける |
| Avatar | alt テキスト付与（ユーザー名）、装飾用は alt="" |
| EmptyState | role="status" で状態変化を通知 |
6. 技術スタック
| レイヤー | 技術 | 理由 |
|---|---|---|
| フロントエンド | Next.js 14 (App Router) | SSR/SSG対応、React最新機能 |
| 言語 | TypeScript | 型安全性、AI駆動開発との相性 |
| スタイリング | Tailwind CSS | ユーティリティファースト、高速開発 |
| バックエンド | Supabase | 認証・DB・リアルタイム一体型 |
| データベース | PostgreSQL (Supabase) | リレーショナルDB、RLS対応 |
| 認証 | Supabase Auth | メール認証、OAuth対応 |
| ホスティング | Vercel | Next.jsとの相性、自動デプロイ |
| ストレージ | Supabase Storage | 画像アップロード用 |
7. 成功指標（KPI）
最重要KPI
短期目標（3ヶ月後）
中長期目標（1年後）
8. タイムライン
MVP開発
認証（パスワードリセット含む）・プロフィール（3ステップ作成）・募集CRUD・参加申請・メッセージ・通知・管理者画面・エラー画面
機能拡充
チーム機能・評価レビュー・通知機能強化
全国展開
エリア拡大・パフォーマンス最適化・収益化機能