maouM-cmd · Sep 12, 2026 · Sep 12, 2026 · Sep 12, 2026
diff --git a/bae-looks/.gitignore b/bae-looks/.gitignore
@@ -0,0 +1,41 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+.env*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
diff --git a/bae-looks/AGENTS.md b/bae-looks/AGENTS.md
@@ -0,0 +1,9 @@
+<!-- BEGIN:nextjs-agent-rules -->
+
+# This is NOT the Next.js you know
+
+This version has breaking changes — APIs, conventions, and file structure may all differ from your training data. Read the relevant guide in `node_modules/next/dist/docs/` (resolved from this file's directory; in monorepos the `next` package may not be visible from the repo root) before writing any code. Heed deprecation notices.
+
+This block is written and re-added by `next dev` — verify at `node_modules/next/dist/server/lib/generate-agent-files.js`. Removing it from a diff only re-creates the uncommitted change; committing it with your work keeps the tree clean.
+
+<!-- END:nextjs-agent-rules -->
diff --git a/bae-looks/BASIC_DESIGN.md b/bae-looks/BASIC_DESIGN.md
@@ -0,0 +1,178 @@
+# bae-looks 基本設計 v0.2
+
+> 要件の正: [REQUIREMENTS.md](./REQUIREMENTS.md)  
+> ファイル対応: [IMPLEMENTATION.md](./IMPLEMENTATION.md)
+
+## 1. 設計方針
+
+1. **ベイ一人にコンテキストを固定**し、UIの検証速度を上げる  
+2. **モックで体験を先に固める**（解析本体は後差し替え）  
+3. データ契約（モーメント / アイテム / 確証度）を先に固定し、将来の Agent API にそのまま載せられるようにする  
+
+---
+
+## 2. アーキテクチャ（現行 v0.1）
+
+```
+Browser
+  └─ Next.js App Router
+       ├─ Hero / WhySection …… Server Components
+       ├─ IdentifyDemo …… Client Component（選択・スキャン・結果）
+       │    └─ ItemCard / ConfidenceBadge
+       └─ data/moments.ts …… 静的モック（DEMO_MOMENTS + SITE）
+```
+
+```mermaid
+flowchart LR
+  hero[Hero] --> demo[IdentifyDemo]
+  demo --> select[SelectMoment]
+  select --> scan[ScanAnimation]
+  scan --> cards[ItemCards]
+  demo --> why[WhySection]
+```
+
+### 将来差し替え点
+
+`IdentifyDemo.runIdentify()` 内の `setTimeout` モックを、次の Agent API 呼び出しに置換する。
+
+```
+POST /api/identify
+  body: { momentId | videoUrl, timestamp, celebrity: "NMIXX Bae", focusCategory? }
+  response: DemoMoment 相当（items[] + confidence）
+```
+
+---
+
+## 3. 画面構成
+
+| セクション | アンカー | 役割 | 主な要素 |
+|------------|----------|------|----------|
+| Hero | top | ブランド第一ビュー | `SITE.brand` / tagline / CTA |
+| Demo | `#demo` | 特定体験の核 | モーメント3枚・抽象フレーム・スキャン・結果パネル |
+| Why | `#why` | スコープ説明 | コンテキスト固定 / UI先検証 / 拡張入口 |
+| Footer | — | 免責 | デモ推測であることの明記 |
+
+### Demo 状態機械（`IdentifyDemo`）
+
+| Phase | 意味 | UI |
+|-------|------|-----|
+| `idle` | 未実行 | 結果パネルに案内文 |
+| `scanning` | 解析中（約1.6s） | スキャンライン＋パルス。ボタン disabled |
+| `ready` | 結果表示 | `ItemCard` を表示 |
+
+モーメント切替（`selectMoment`）時は `idle` にリセットし、前回結果を破棄する。
+
+---
+
+## 4. データモデル（実装と同一）
+
+型定義の正: [`src/lib/types.ts`](./src/lib/types.ts)  
+データの正: [`src/data/moments.ts`](./src/data/moments.ts)
+
+### `DemoMoment`
+
+| フィールド | 型 | 説明 |
+|------------|-----|------|
+| `id` | string | `stage-silver` / `airport-denim` / `vlog-lip` |
+| `title` | string | シーン名 |
+| `sourceLabel` | string | ソース表示 |
+| `timestamp` | string | 表示用タイムスタンプ |
+| `sceneNote` | string | フレームの状況説明 |
+| `frameTone` | `stage` \| `airport` \| `vlog` | 抽象フレームの色調 |
+| `focusCategory` | `ItemCategory` | 注目カテゴリ |
+| `items` | `IdentifiedItem[]` | 候補 |
+
+### `IdentifiedItem`
+
+| フィールド | 型 | 説明 |
+|------------|-----|------|
+| `category` | `ItemCategory` | カテゴリ |
+| `brandName` / `productName` / `modelCandidate` | string | 推測ブランド・商品・型番 |
+| `primaryColor` / `materialsTexture` / `distinctiveMarks` | string | 視覚特徴 |
+| `confidence` | `exact` \| `same_brand` \| `similar` | 確証度 |
+| `confidenceNote` | string | 根拠テキスト |
+| `priceHint` | string | 価格目安 |
+| `links` | `ShopLink[]` | 購入・検索導線（`kind`: official / mall / similar） |
+| `alternatives` | `{ label, priceHint, note }[]` | プチプラ / 概念コーデ |
+
+### 確証度 UI
+
+| 値 | 表示 | 意味 |
+|----|------|------|
+| `exact` | 完全一致 | 複数手がかりが一致 |
+| `same_brand` | 同一ブランド | ブランドまでは有力 |
+| `similar` | 類似デザイン | シルエット近似 |
+
+### サイト定数 `SITE`
+
+| キー | 例 |
+|------|-----|
+| `brand` | `BAE FRAME` |
+| `member` / `memberJa` | `NMIXX Bae` / `NMIXX ベイ` |
+| `tagline` | ヒーローキャッチ |
+| `support` | ヒーロー補足文 |
+
+---
+
+## 5. Agent 入出力契約（v0.2 以降用）
+
+v0.1 はモックで同一スキーマを返す。本番接続時もこの形を維持する。
+
+### Input
+
+| 区分 | 例 |
+|------|-----|
+| メディア | 動画URL、タイムスタンプ、キーフレーム、ユーザー切り抜き |
+| コンテキスト | 出演者=`NMIXX Bae`（固定）、番組/配信タイトル、投稿日時、タイアップ表記 |
+| ユーザー希望 | 完全一致のみ / 類似可 / 予算上限 / 国内即納 / カテゴリ絞り込み |
+
+### Agent Steps（将来）
+
+1. メディア前処理・フレーム抽出  
+2. 物体検出・セグメンテーション（服・アクセ・コスメ）  
+3. マルチモーダル解析＋ベイの着用傾向・ファン特定ログの照合  
+4. EC・Web横断検索  
+5. 確証度スコアリングと根拠付与  
+
+### Output（ユーザー向け）
+
+- アイテム情報（ブランド、商品名、型番候補、定価目安）  
+- 購入導線（公式 / モール / 類似）  
+- 推し活拡張（シーン説明、代替・概念コーデ）  
+- 確証度の可視化（バッジ＋ `confidenceNote`）  
+
+中間JSON（特徴言語化）は鑑定プロンプトの  
+`visual_features` / `candidate_brands` / `search_queries` を想定し、最終的に `IdentifiedItem` へ正規化する。
+
+---
+
+## 6. UI / ビジュアル方針
+
+| 項目 | 方針 |
+|------|------|
+| トーン | ダークフィルム調＋シアンアクセント（紫グラデ依存を避ける） |
+| フォント | Syne（display）+ Manrope（本文） |
+| ヒーロー | フルブリード。ブランド名が第一ビューの主役 |
+| カード | 結果・操作のためのコンテナとしてのみ使用（ヒーローにカードを置かない） |
+| モーション | rise / scan / pulse-ring / card-enter（`globals.css`） |
+
+---
+
+## 7. 技術スタック
+
+| 層 | 選定 |
+|----|------|
+| フレームワーク | Next.js 16（App Router）+ React 19 |
+| スタイル | Tailwind CSS 4 |
+| データ | 静的 TypeScript モジュール（DBなし） |
+| 品質 | ESLint（`eslint-config-next`） |
+
+---
+
+## 8. リスクと対策
+
+| リスク | 対策 |
+|--------|------|
+| デモ商品が実在断定と誤解される | フッター・要件で「UX用デモ推測」と明記 |
+| 実AI接続時にUI契約が崩れる | `DemoMoment` / `IdentifiedItem` を API レスポンス契約にする |
+| 拡張時にベイ前提コピーが残る | `SITE` と `DEMO_MOMENTS` を差し替え可能な境界に保つ |
diff --git a/bae-looks/CLAUDE.md b/bae-looks/CLAUDE.md
@@ -0,0 +1 @@
+@AGENTS.md
diff --git a/bae-looks/IMPLEMENTATION.md b/bae-looks/IMPLEMENTATION.md
@@ -0,0 +1,53 @@
+# bae-looks 実装対応表 v0.3
+
+> 要件: [REQUIREMENTS.md](./REQUIREMENTS.md)  
+> 設計: [BASIC_DESIGN.md](./BASIC_DESIGN.md)
+
+## 機能 → ファイル
+
+| 機能 | ファイル | 備考 |
+|------|----------|------|
+| ランディングヒーロー | `src/components/Hero.tsx` | CTA → `#context` / `#demo` |
+| コンテキストボード | `src/components/ContextBoard.tsx` | 物 / 興味 / 場所タブ |
+| 興味カード | `src/components/InterestCard.tsx` | 発言引用＋出典 |
+| 場所カード | `src/components/PlaceCard.tsx` | 訪問ログ＋地図 |
+| 特定デモUI | `src/components/IdentifyDemo.tsx` | phase: idle / scanning / ready |
+| 候補カード | `src/components/ItemCard.tsx` | 特徴・根拠・リンク・代替 |
+| 確証度バッジ | `src/components/ConfidenceBadge.tsx` | exact / same_brand / similar |
+| スコープ説明 | `src/components/WhySection.tsx` | 物・興味・場所の骨格 |
+| モーメントモック | `src/data/moments.ts` | `DEMO_MOMENTS` + `SITE` |
+| コンテキストモック | `src/data/context.ts` | items / interests / places |
+| 型定義 | `src/lib/types.ts` | item / interest / place |
+| グローバルスタイル | `src/app/globals.css` | CSS変数・モーション |
+| ルートページ | `src/app/page.tsx` | Hero → ContextBoard → IdentifyDemo → Why |
+
+## 画面フロー
+
+```
+Hero
+  └─ CTA → #context / #demo
+ContextBoard (#context)
+  ├─ tab: 物 → ItemCard[]
+  ├─ tab: 興味 → InterestCard[]
+  └─ tab: 場所 → PlaceCard[]
+IdentifyDemo (#demo)
+  └─ moment select → scan → ItemCard[]
+WhySection (#why)
+Footer
+```
+
+## ローカル確認
+
+```bash
+cd bae-looks
+npm install
+npm run dev
+npm run lint
+npm run build
+```
+
+## 既知の制約
+
+- 解析はモックのみ。実動画・字幕パイプラインは未接続
+- 興味・場所もデモデータ（実在の断定ではない）
+- 購入・地図リンクはプレースホルダ
diff --git a/bae-looks/README.md b/bae-looks/README.md
@@ -0,0 +1,36 @@
+# bae-looks
+
+NMIXX **ベイ**特化の「動画フレーム → 着用アイテム特定」フロントエンド試作（ブランド名: **BAE FRAME**）。
+
+フロントの感触が良ければ、同じUI骨格でメンバー横断・他アーティストへ拡張する。
+
+## セットアップ
+
+```bash
+cd bae-looks
+npm install
+npm run dev
+```
+
+http://localhost:3000 を開く。
+
+## いまできること（v0.1）
+
+1. ベイ特化ヒーロー
+2. サンプルモーメント選択 → 特定アニメーション
+3. 確証度つき候補カード（完全一致 / 同一ブランド / 類似）と代替案
+
+データはすべてモック。実動画AI解析は未接続。
+
+## ドキュメント（仕様の正）
+
+| 文書 | 内容 |
+|------|------|
+| [REQUIREMENTS.md](./REQUIREMENTS.md) | 要件定義 v0.2 |
+| [BASIC_DESIGN.md](./BASIC_DESIGN.md) | 基本設計・データ契約・将来Agent入出力 |
+| [IMPLEMENTATION.md](./IMPLEMENTATION.md) | 機能→ファイル対応 |
+| [ブリーフ](../business-ops/briefs/bae-looks-brief.md) | 立ち上げ用サマリ |
+
+## ライセンス
+
+Private