398 lines
11 KiB
Markdown
398 lines
11 KiB
Markdown
|
# 🚀 ぽんるーむ Lite - 完全スタートガイド
|
|||
|
|
|
|||
|
|
**プロジェクト名**: ぽんるーむ Lite (Ponshu Room Lite)
|
|||
|
|
**バージョン**: 2.0 - "My Digital Sake Cellar with Personality"
|
|||
|
|
**作成日**: 2025-12-29
|
|||
|
|
**このフォルダの状態**: 完全にクリーン（設計書のみ）
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 💡 「Lite」の意味
|
|||
|
|
|
|||
|
|
**「Lite」= 機能制限ではなく、「洗練されたコア体験」**
|
|||
|
|
|
|||
|
|
- ✅ 写真を主役にした雑誌のようなUI
|
|||
|
|
- ✅ 完全ローカル保存（プライバシー最優先）
|
|||
|
|
- ✅ MBTI・四柱推命と日本酒を掛け合わせた「あなただけの診断」
|
|||
|
|
- ✅ フォント切り替え機能（明朝体 ⇔ ゴシック体）
|
|||
|
|
|
|||
|
|
**将来の「Pro」版**:
|
|||
|
|
- Synology NAS連携
|
|||
|
|
- 高度な統計分析
|
|||
|
|
- チーム共有機能
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🎯 このアプリの3つの魂
|
|||
|
|
|
|||
|
|
### 🍶 1. 「瞬撮」- 魔法の解析体験
|
|||
|
|
カメラを向けて撮るだけで、Gemini 3.0がリアルタイム実況しながら解析。
|
|||
|
|
```
|
|||
|
|
「ラベルを読んでいます...」
|
|||
|
|
「お、これは山口県の銘柄ですね...」
|
|||
|
|
「データを整理しています...」
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 🎨 2. 「美録」- インスタ映えする情報の見せ方
|
|||
|
|
雑誌のようなレイアウト、選べるフォント、Instagram用正方形画像生成。
|
|||
|
|
|
|||
|
|
### 🧩 3. 「遊び心」- あなただけのパーソナライズ
|
|||
|
|
- **MBTI × 日本酒相性診断**: 「このお酒はENFPのあなたにピッタリ！」
|
|||
|
|
- **四柱推命 × 今日の一滴**: 「今日の運気を上げる辛口な一本」
|
|||
|
|
- **フレーバー・マトリックス**: あなたの好みを可視化
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## ✅ このフォルダの状況
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
現在のフォルダ: C:\Users\maita\posimai-project\ponshu_room_lite
|
|||
|
|
|
|||
|
|
含まれるもの:
|
|||
|
|
✅ FINAL_REQUIREMENTS.md（最終仕様書）
|
|||
|
|
✅ ANTIGRAVITY_PROMPT.md（実装手順書）
|
|||
|
|
✅ UI_UX_DECISION_GUIDE.md（デザイン決定ガイド）
|
|||
|
|
✅ START_HERE_FINAL.md（このファイル）
|
|||
|
|
|
|||
|
|
含まれないもの:
|
|||
|
|
❌ 古いWeb版のコード（完全に除外）
|
|||
|
|
❌ lib/ フォルダ
|
|||
|
|
❌ pubspec.yaml
|
|||
|
|
❌ 何のコードもありません
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
**これは意図的です。完全にゼロから始めます。**
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🎯 Antigravity向け - 最終完全プロンプト
|
|||
|
|
|
|||
|
|
以下をAntigravityに送ってください：
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
@Antigravity
|
|||
|
|
|
|||
|
|
ぽんるーむ Lite をゼロから実装します。
|
|||
|
|
このフォルダ（ponshu_room_lite）は完全にクリーンです。
|
|||
|
|
|
|||
|
|
📂 現在のフォルダ:
|
|||
|
|
C:\Users\maita\posimai-project\ponshu_room_lite
|
|||
|
|
|
|||
|
|
📄 読み込むべきドキュメント:
|
|||
|
|
1. START_HERE_FINAL.md（最初に読む）
|
|||
|
|
2. ANTIGRAVITY_PROMPT.md（メイン実装手順）
|
|||
|
|
3. FINAL_REQUIREMENTS.md（完全仕様書）
|
|||
|
|
|
|||
|
|
🔑 新しいAPIキー:
|
|||
|
|
AIzaSyA2BSr16R2k0bHjSYcSUdmLoY8PKwaFts0
|
|||
|
|
|
|||
|
|
🎨 デザイン方針（Lite版の魂）:
|
|||
|
|
|
|||
|
|
【写真最大化】
|
|||
|
|
- 余白は最小限（padding: 8dp, separator: 4dp）
|
|||
|
|
- 写真サイズ: 120x120
|
|||
|
|
- フル幅カード
|
|||
|
|
- 極細ボーダー（0.5px）で区切り
|
|||
|
|
|
|||
|
|
【フォント戦略】
|
|||
|
|
- デフォルト: Noto Sans JP（親しみやすいゴシック体）
|
|||
|
|
- 設定で切り替え可能: Noto Serif JP（高級感のある明朝体）
|
|||
|
|
- ユーザーが好みで選べるようにする
|
|||
|
|
|
|||
|
|
【パーソナライズ機能の準備】
|
|||
|
|
- UserProfileモデルを作成:
|
|||
|
|
- MBTI診断結果（16タイプ）
|
|||
|
|
- 生年月日（四柱推命用）
|
|||
|
|
- 好みのフォント設定
|
|||
|
|
- これらは Phase 2以降で使用（今は枠だけ準備）
|
|||
|
|
|
|||
|
|
⚠️ 絶対にやってはいけないこと:
|
|||
|
|
❌ ../ponshu-room/ フォルダを参照しない
|
|||
|
|
❌ 古いコードをコピーしない
|
|||
|
|
❌ Web版のUIを踏襲しない
|
|||
|
|
|
|||
|
|
✅ やるべきこと（Phase 1）:
|
|||
|
|
|
|||
|
|
【1-1. プロジェクト初期化】
|
|||
|
|
1. このフォルダで flutter create . を実行
|
|||
|
|
2. pubspec.yaml を設定（google_fonts, hive, riverpod, etc.）
|
|||
|
|
3. Android設定（compileSdk: 36, targetSdk: 35）
|
|||
|
|
|
|||
|
|
【1-2. データモデル】
|
|||
|
|
1. SakeItem モデル:
|
|||
|
|
- 基本情報（銘柄名、酒蔵、都道府県、etc.）
|
|||
|
|
- キャッチコピー（Geminiが自動生成）
|
|||
|
|
- フレーバースコア（sweetnessScore, bodyScore）
|
|||
|
|
|
|||
|
|
2. UserProfile モデル（🆕）:
|
|||
|
|
- mbtiType: String? // 例: "ENFP"
|
|||
|
|
- birthDate: DateTime? // 四柱推命用
|
|||
|
|
- fontPreference: String // "serif" or "sans"
|
|||
|
|
- createdAt: DateTime
|
|||
|
|
|
|||
|
|
【1-3. テーマ設定】
|
|||
|
|
1. AppTheme を作成:
|
|||
|
|
- posimaiカラー（#376495）
|
|||
|
|
- 動的フォント切り替え対応
|
|||
|
|
- デフォルトは Noto Sans JP
|
|||
|
|
|
|||
|
|
2. FontProvider（Riverpod）を作成:
|
|||
|
|
- UserProfileからフォント設定を読み込み
|
|||
|
|
- アプリ全体でリアクティブに切り替え
|
|||
|
|
|
|||
|
|
【1-4. Gemini AI解析】
|
|||
|
|
1. GeminiService:
|
|||
|
|
- モデル: gemini-2.5-flash-latest
|
|||
|
|
- リアルタイム実況機能
|
|||
|
|
- キャッチコピー自動生成
|
|||
|
|
|
|||
|
|
【1-5. UI実装】
|
|||
|
|
1. ホーム画面（4タブ）:
|
|||
|
|
- 酒リスト（フル幅カード）
|
|||
|
|
- マップ
|
|||
|
|
- AIソムリエ
|
|||
|
|
- プロフィール
|
|||
|
|
|
|||
|
|
2. フル幅カード:
|
|||
|
|
- 左: 写真120x120
|
|||
|
|
- 右: 銘柄名（選択したフォント）、データ
|
|||
|
|
|
|||
|
|
3. プロフィール画面:
|
|||
|
|
- フォント切り替えスイッチ
|
|||
|
|
- MBTI入力欄（今は空でOK）
|
|||
|
|
- 生年月日入力欄（今は空でOK）
|
|||
|
|
|
|||
|
|
【1-6. SafeArea対応】
|
|||
|
|
- すべての画面でSafeAreaを徹底使用
|
|||
|
|
- Android 15で見切れ・重なりゼロ
|
|||
|
|
|
|||
|
|
🚀 開始:
|
|||
|
|
ANTIGRAVITY_PROMPT.md の「プロジェクト作成」セクションから開始してください。
|
|||
|
|
Phase 1-1（プロジェクト初期化）完了後に報告をお願いします。
|
|||
|
|
|
|||
|
|
💡 重要な追加仕様:
|
|||
|
|
|
|||
|
|
【フォント切り替えの実装】
|
|||
|
|
設定画面に以下を追加:
|
|||
|
|
|
|||
|
|
```dart
|
|||
|
|
// 設定画面の一部
|
|||
|
|
Row(
|
|||
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|||
|
|
children: [
|
|||
|
|
Text('フォント設定'),
|
|||
|
|
SegmentedButton(
|
|||
|
|
segments: [
|
|||
|
|
ButtonSegment(value: 'sans', label: Text('ゴシック')),
|
|||
|
|
ButtonSegment(value: 'serif', label: Text('明朝')),
|
|||
|
|
],
|
|||
|
|
selected: {currentFont},
|
|||
|
|
onSelectionChanged: (Set<String> newSelection) {
|
|||
|
|
// UserProfileを更新
|
|||
|
|
// AppThemeを再構築
|
|||
|
|
},
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
)
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
【UserProfileモデルの完全コード】
|
|||
|
|
|
|||
|
|
```dart
|
|||
|
|
// lib/models/user_profile.dart
|
|||
|
|
import 'package:hive/hive.dart';
|
|||
|
|
|
|||
|
|
part 'user_profile.g.dart';
|
|||
|
|
|
|||
|
|
@HiveType(typeId: 1)
|
|||
|
|
class UserProfile extends HiveObject {
|
|||
|
|
@HiveField(0)
|
|||
|
|
String? mbtiType; // "ENFP", "INTJ", etc.
|
|||
|
|
|
|||
|
|
@HiveField(1)
|
|||
|
|
DateTime? birthDate; // 四柱推命用
|
|||
|
|
|
|||
|
|
@HiveField(2)
|
|||
|
|
String fontPreference; // "serif" or "sans"
|
|||
|
|
|
|||
|
|
@HiveField(3)
|
|||
|
|
DateTime createdAt;
|
|||
|
|
|
|||
|
|
@HiveField(4)
|
|||
|
|
DateTime? updatedAt;
|
|||
|
|
|
|||
|
|
UserProfile({
|
|||
|
|
this.mbtiType,
|
|||
|
|
this.birthDate,
|
|||
|
|
this.fontPreference = 'sans', // デフォルトはゴシック
|
|||
|
|
required this.createdAt,
|
|||
|
|
this.updatedAt,
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
【Phase 2以降の予告】
|
|||
|
|
- MBTI × 日本酒相性診断
|
|||
|
|
- 四柱推命 × 今日の一滴
|
|||
|
|
- フレーバー・マトリックス
|
|||
|
|
- Instagram用画像生成（診断結果入り）
|
|||
|
|
|
|||
|
|
これらは Phase 1完了後に実装します。
|
|||
|
|
今は UserProfile の枠だけ準備してください。
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 📋 実装の流れ
|
|||
|
|
|
|||
|
|
### Phase 0: 準備（今ここ）
|
|||
|
|
- [x] 新しいフォルダ作成（ponshu_room_lite）
|
|||
|
|
- [x] 設計書をコピー
|
|||
|
|
- [ ] Antigravityに指示を送る
|
|||
|
|
|
|||
|
|
### Phase 1: MVP（5-6時間）
|
|||
|
|
- [ ] プロジェクト初期化
|
|||
|
|
- [ ] データモデル（SakeItem + UserProfile）
|
|||
|
|
- [ ] フォント切り替え機能
|
|||
|
|
- [ ] Gemini解析（リアルタイム実況）
|
|||
|
|
- [ ] フル幅カード
|
|||
|
|
- [ ] SafeArea対応
|
|||
|
|
|
|||
|
|
### Phase 2: パーソナライズ（3-4時間）
|
|||
|
|
- [ ] MBTI入力UI
|
|||
|
|
- [ ] MBTI × 日本酒相性診断
|
|||
|
|
- [ ] 四柱推命 × 今日の一滴
|
|||
|
|
- [ ] フレーバー・マトリックス
|
|||
|
|
|
|||
|
|
### Phase 3: 共有機能（2時間）
|
|||
|
|
- [ ] Instagram用画像生成（診断結果入り）
|
|||
|
|
- [ ] キャッチコピー付き共有
|
|||
|
|
|
|||
|
|
### Phase 4: 遊び心（3時間）
|
|||
|
|
- [ ] 日本酒・制覇マップ
|
|||
|
|
- [ ] AIソムリエチャット
|
|||
|
|
|
|||
|
|
**合計: 13-15時間**
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🎨 フォント選択のガイド
|
|||
|
|
|
|||
|
|
### デフォルト: Noto Sans JP（ゴシック体）
|
|||
|
|
```
|
|||
|
|
印象: 親しみやすい、読みやすい、診断コンテンツと相性◎
|
|||
|
|
おすすめな人: MBTIや診断を楽しみたい、カジュアルに記録したい
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### オプション: Noto Serif JP（明朝体）
|
|||
|
|
```
|
|||
|
|
印象: 高級感、伝統、雑誌のような洗練
|
|||
|
|
おすすめな人: 日本酒の本格的な雰囲気を大切にしたい
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
**いつでも切り替え可能！設定画面からワンタップ。**
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🔐 APIキーの設定
|
|||
|
|
|
|||
|
|
Antigravityが `lib/secrets.dart` を作成した後、以下が正しく設定されているか確認してください:
|
|||
|
|
|
|||
|
|
```dart
|
|||
|
|
// lib/secrets.dart
|
|||
|
|
class Secrets {
|
|||
|
|
static const String geminiApiKey = 'AIzaSyA2BSr16R2k0bHjSYcSUdmLoY8PKwaFts0';
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## ✅ 完成確認チェックリスト
|
|||
|
|
|
|||
|
|
### Phase 1 MVP完成の確認
|
|||
|
|
- [ ] カメラで日本酒を撮影できる
|
|||
|
|
- [ ] Gemini解析で「ラベルを読んでいます...」と表示される
|
|||
|
|
- [ ] キャッチコピーが自動生成される
|
|||
|
|
- [ ] フル幅カード（写真120x120）で表示される
|
|||
|
|
- [ ] フォント切り替えが動作する（ゴシック ⇔ 明朝）
|
|||
|
|
- [ ] Android 15で見切れない
|
|||
|
|
- [ ] UserProfileが保存される
|
|||
|
|
|
|||
|
|
### Phase 2 パーソナライズ完成の確認
|
|||
|
|
- [ ] MBTI診断結果を入力できる
|
|||
|
|
- [ ] 「このお酒はあなた（ENFP）にピッタリ！」と表示される
|
|||
|
|
- [ ] フレーバー・マトリックスが表示される
|
|||
|
|
|
|||
|
|
### 最終完成の確認
|
|||
|
|
- [ ] すべての機能が動作
|
|||
|
|
- [ ] 「雑誌のような」デザイン
|
|||
|
|
- [ ] 60fpsの滑らかな動作
|
|||
|
|
- [ ] 「魔法のような」心地よさ
|
|||
|
|
- [ ] 知人に見せたくなる
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 📞 トラブルシューティング
|
|||
|
|
|
|||
|
|
### もしAntigravityが古いコードを参照しようとしたら
|
|||
|
|
|
|||
|
|
**即座に指摘してください**:
|
|||
|
|
```
|
|||
|
|
@Antigravity
|
|||
|
|
|
|||
|
|
古い ponshu-room フォルダは参照しないでください。
|
|||
|
|
このフォルダ（ponshu_room_lite）内のドキュメントだけを見てください。
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### もし余白が大きすぎたら
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
@Antigravity
|
|||
|
|
|
|||
|
|
余白が大きすぎます。以下に修正してください:
|
|||
|
|
- ListView.padding: EdgeInsets.symmetric(horizontal: 8, vertical: 12)
|
|||
|
|
- separatorBuilder: SizedBox(height: 4)
|
|||
|
|
- 写真サイズ: 120x120
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### もしフォント切り替えが動作しなかったら
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
@Antigravity
|
|||
|
|
|
|||
|
|
フォント切り替えが動作しません。
|
|||
|
|
UserProfileのfontPreferenceを変更したら、AppThemeが再構築されるようにしてください。
|
|||
|
|
Riverpodのproviderを使って、リアクティブに更新してください。
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 🎊 準備完了！
|
|||
|
|
|
|||
|
|
すべての準備が整いました。
|
|||
|
|
|
|||
|
|
**次のアクション**:
|
|||
|
|
1. 上記の「Antigravityへの指示」をコピー
|
|||
|
|
2. Antigravityに送信
|
|||
|
|
3. 実装開始を待つ
|
|||
|
|
|
|||
|
|
**「ぽんるーむ Lite」の誕生を楽しみにしています！🍶✨**
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 💡 将来の拡張（Pro版へ）
|
|||
|
|
|
|||
|
|
Phase 1-4が完了し、知人にも好評だったら：
|
|||
|
|
|
|||
|
|
### ぽんるーむ Pro（構想）
|
|||
|
|
- Synology NAS自動バックアップ
|
|||
|
|
- 複数デバイス同期
|
|||
|
|
- チーム共有機能
|
|||
|
|
- 高度な統計分析
|
|||
|
|
- カスタムテーマ
|
|||
|
|
- エクスポート機能強化
|
|||
|
|
|
|||
|
|
**まずは Lite を完璧に仕上げましょう！**
|