LaunchDeck

# selfdirected_agent_j_20260708T002658

This directory is a materialized LLM BuildPlan artifact candidate.

## Readiness

- First screen value: 作りたいプロジェクトの概要を入力するだけで、AIが公開までの具体的なタスクリストを自動で生成。何から手をつければ良いか分からない、というクリエイターの最初の壁を取り除きます。
- Core interaction: 「サンプル実行トレースを再生」ボタンを押すと、プロジェクトのアイデアが、具体的なタスクがステージごとに整理されたローンチ計画ボードへと変換される様子を体験できます。
- State change: ボタンをクリックすると、初期のプロジェクト入力画面から、AIが生成した詳細なタスクボード表示へと画面が切り替わります。
- Inspectable output: 生成されたタスクボード。各タスクのタイトル、説明、そしてAIが生成したSNS投稿文案のサンプルを確認できます。
- Static data boundary: 表示されるすべてのタスクとコンテンツは、あらかじめ用意された静的なサンプルデータです。ユーザーが入力した内容をリアルタイムでAIが処理するものではありません。
- Remaining weakness: 現在は単一のサンプルプロジェクトにしか対応していませんが、将来的には多様なクリエイティブ（ポッドキャスト、ニュースレター等）に特化したタスクテンプレートをAIが提案できるようにし、さらにユーザーがタスクを自由に追加・編集できる機能を加えて、あらゆるクリエイターの右腕のような存在にしたいです。

## Interaction Proof Plan

- Primary action: サンプル実行トレースを再生
- Initial state: プロジェクト概要入力画面が表示されている状態。
- Expected state: AIが生成したタスクボードが表示され、「企画」「制作」「宣伝」「公開前チェック」のステージにタスクカードが並んでいる状態。
- Visible evidence: ローンチ計画ボード; 企画; 制作; 宣伝; 公開前チェック; ターゲットオーディエンスの特定; SNS投稿文案の作成

## MVP Contract

- Required files: `source/README.md`, `source/metadata.json`, `source/manifest.json`, `source/app/page.tsx`, `source/core/pipeline.ts`, `source/core/gemini.ts`, `source/data/sample-input.ts`, `source/data/sample-trace.ts`, `source/validation/self-review.json`
- Non-goals: No live external API integration; No login-only experience; No paid API dependency; No external publishing
- Forbidden dependencies: external API; secret; login-only flow; paid API; external publishing

## MVP Contract V2

- Artifact tier: proposed_integration
- External dependency mode: proposed
- Runtime boundary: network=none, secrets=none, externalWrites=none
- Render verification: required (render, click, state_change, screenshot)
- Public copy boundary: この計画はAIが提案したサンプルです。; 実際のサービス連携は将来的な機能です。; AI生成のコンテンツは必ずご自身で確認・編集してください。
- External integrations: Google Gemini API=not_connected
- Mock fidelity: Successful generation of a multi-stage task plan.; Successful generation of social media copy for a specific task.

## Files

- `source/README.md`: Product overview, architecture, and usage instructions.
- `source/metadata.json`: Structured product metadata for discovery and display.
- `source/manifest.json`: File manifest for the build artifact.
- `source/app/page.tsx`: Main application entrypoint and trace-replay UI.
- `source/core/types.ts`: Core type definitions for the pipeline.
- `source/core/pipeline.ts`: Orchestrates the AI processing steps.
- `source/core/steps/01_decomposeProject.ts`: AI step to decompose a project idea into tasks.
- `source/core/steps/02_generateCopy.ts`: AI step to generate social media copy for a project.
- `source/core/gemini.ts`: Reference implementation for calling the Google Gemini API.
- `source/data/sample-input.ts`: Sample input data for the demo.
- `source/data/sample-trace.ts`: Hand-authored execution trace for replaying in the demo.
- `source/validation/self-review.json`: Self-review against Prodia MVP criteria.

## Demo Placeholder

- `demo-placeholder.md`: Inspectable placeholder for submission/demo review before UI wiring.

## DB Write

skipped: BuildPlan materialization is artifact-only for this session. Creating Project rows requires existing Run/Theme/Agent/Category IDs and should be owned by the integration session.

{
  "version": 1,
  "artifactId": "selfdirected_agent_j_20260708T002658",
  "generatedAt": "2026-07-08T00:38:19.944Z",
  "generatedFrom": {
    "input": "artifacts/llm-pipeline-runs/run_selfdirected_agent_j_20260708T002658/builder/response.json",
    "requirementSpecId": "req_j_20260708T003239",
    "framework": "next_static_artifact"
  },
  "sourceFiles": [
    {
      "relativePath": "source/README.md",
      "purpose": "Product overview, architecture, and usage instructions.",
      "sizeBytes": 3658,
      "checksum": "15c1b42f02abc06346c39fc2c37b69ec0b181cde43a055f83629d717719bff56",
      "generatedFrom": "README.md"
    },
    {
      "relativePath": "source/metadata.json",
      "purpose": "Structured product metadata for discovery and display.",
      "sizeBytes": 3086,
      "checksum": "bcf3bc9d07366eacb9ec7ea41b9e0aa9b2806e3785e5110a633f8fd9a0136cec",
      "generatedFrom": "metadata.json"
    },
    {
      "relativePath": "source/manifest.json",
      "purpose": "File manifest for the build artifact.",
      "sizeBytes": 445,
      "checksum": "fa8c3af2504ddff933dde687d579dd6d6a9ba75c78616b4203620e1f33909461",
      "generatedFrom": "manifest.json"
    },
    {
      "relativePath": "source/app/page.tsx",
      "purpose": "Main application entrypoint and trace-replay UI.",
      "sizeBytes": 8326,
      "checksum": "02b414978e850c35517acfc3c5febc38def18fbc46424a7e57d65b47dc2273b6",
      "generatedFrom": "source/app/page.tsx"
    },
    {
      "relativePath": "source/core/types.ts",
      "purpose": "Core type definitions for the pipeline.",
      "sizeBytes": 383,
      "checksum": "133a9d64c10f4ca672299e6a56c8e4d19c9ea18ccb7c6e3ed0fdbb28769df2c2",
      "generatedFrom": "source/core/types.ts"
    },
    {
      "relativePath": "source/core/pipeline.ts",
      "purpose": "Orchestrates the AI processing steps.",
      "sizeBytes": 1138,
      "checksum": "2704667eeba4f47ce46b87062fdc574dfdc284120428e0541a8e9802b9c9a987",
      "generatedFrom": "source/core/pipeline.ts"
    },
    {
      "relativePath": "source/core/steps/01_decomposeProject.ts",
      "purpose": "AI step to decompose a project idea into tasks.",
      "sizeBytes": 2118,
      "checksum": "cb24ea84dbf5cddbaf74ceb363c70cb1a916ceee099c361b107f61c79d4cf086",
      "generatedFrom": "source/core/steps/01_decomposeProject.ts"
    },
    {
      "relativePath": "source/core/steps/02_generateCopy.ts",
      "purpose": "AI step to generate social media copy for a project.",
      "sizeBytes": 1635,
      "checksum": "9b9418897d5b3079054380779a0c21e6127bbd413d1b7303c711e3166ee53f60",
      "generatedFrom": "source/core/steps/02_generateCopy.ts"
    },
    {
      "relativePath": "source/core/gemini.ts",
      "purpose": "Reference implementation for calling the Google Gemini API.",
      "sizeBytes": 1953,
      "checksum": "2346ff10b6ac1e423c669acaff3f0aa854aca22d2f48318128f3365e34aca90c",
      "generatedFrom": "source/core/gemini.ts"
    },
    {
      "relativePath": "source/data/sample-input.ts",
      "purpose": "Sample input data for the demo.",
      "sizeBytes": 293,
      "checksum": "5548d80860fdf55fcd2dab8861dd44386d6b2e8d2e53b05842452bc5401d054d",
      "generatedFrom": "source/data/sample-input.ts"
    },
    {
      "relativePath": "source/data/sample-trace.ts",
      "purpose": "Hand-authored execution trace for replaying in the demo.",
      "sizeBytes": 5901,
      "checksum": "0223e0c577bcddf0e0c34e82655fab5a10f2b1247f9d70fe9f5668f2aa6a690b",
      "generatedFrom": "source/data/sample-trace.ts"
    },
    {
      "relativePath": "source/validation/self-review.json",
      "purpose": "Self-review against Prodia MVP criteria.",
      "sizeBytes": 1345,
      "checksum": "ce4794b1de3c356b44eca4d9f872c8bbc2ff1702d72487b56c02d47ef7bf2da1",
      "generatedFrom": "validation/self-review.json"
    }
  ],
  "demo": {
    "path": "demo-placeholder.md",
    "purpose": "Inspectable placeholder for submission/demo review before UI wiring."
  },
  "readiness": {
    "firstScreenValue": "作りたいプロジェクトの概要を入力するだけで、AIが公開までの具体的なタスクリストを自動で生成。何から手をつければ良いか分からない、というクリエイターの最初の壁を取り除きます。",
    "coreInteraction": "「サンプル実行トレースを再生」ボタンを押すと、プロジェクトのアイデアが、具体的なタスクがステージごとに整理されたローンチ計画ボードへと変換される様子を体験できます。",
    "stateChange": "ボタンをクリックすると、初期のプロジェクト入力画面から、AIが生成した詳細なタスクボード表示へと画面が切り替わります。",
    "inspectableOutput": "生成されたタスクボード。各タスクのタイトル、説明、そしてAIが生成したSNS投稿文案のサンプルを確認できます。",
    "staticDataBoundary": "表示されるすべてのタスクとコンテンツは、あらかじめ用意された静的なサンプルデータです。ユーザーが入力した内容をリアルタイムでAIが処理するものではありません。",
    "remainingWeakness": "現在は単一のサンプルプロジェクトにしか対応していませんが、将来的には多様なクリエイティブ（ポッドキャスト、ニュースレター等）に特化したタスクテンプレートをAIが提案できるようにし、さらにユーザーがタスクを自由に追加・編集できる機能を加えて、あらゆるクリエイターの右腕のような存在にしたいです。"
  },
  "interestingness": "多くのクリエイターが直面する「アイデアはあるが、どこから手をつければいいか分からない」という壁。LaunchDeckは、その漠然としたアイデアを、AIが具体的な「公開までのロードマップ」へと変換する、まさに管制室（Deck）のような存在です。単なるToDoリストではなく、SNS投稿案まで生成してくれるため、地味で複雑な準備作業からクリエイターを解放します。これは、ゴールまでの複数ステップを自律的に計画・実行する「AIエージェント」技術の考え方を、誰もが使える形に応用した新しい試み。これにより、一人でも自信を持ってプロジェクトを完遂できる「次の一歩」が、はっきりと見えるようになります。",
  "mvpContract": {
    "firstScreenValue": "作りたいプロジェクトの概要を入力するだけで、AIが公開までの具体的なタスクリストを自動で生成。何から手をつければ良いか分からない、というクリエイターの最初の壁を取り除きます。",
    "coreInteraction": "「サンプル実行トレースを再生」ボタンを押すと、プロジェクトのアイデアが、具体的なタスクがステージごとに整理されたローンチ計画ボードへと変換される様子を体験できます。",
    "stateChange": "ボタンをクリックすると、初期のプロジェクト入力画面から、AIが生成した詳細なタスクボード表示へと画面が切り替わります。",
    "inspectableOutput": "生成されたタスクボード。各タスクのタイトル、説明、そしてAIが生成したSNS投稿文案のサンプルを確認できます。",
    "staticDataBoundary": "表示されるすべてのタスクとコンテンツは、あらかじめ用意された静的なサンプルデータです。ユーザーが入力した内容をリアルタイムでAIが処理するものではありません。",
    "requiredFiles": [
      "source/README.md",
      "source/metadata.json",
      "source/manifest.json",
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/core/gemini.ts",
      "source/data/sample-input.ts",
      "source/data/sample-trace.ts",
      "source/validation/self-review.json"
    ],
    "nonGoals": [
      "No live external API integration",
      "No login-only experience",
      "No paid API dependency",
      "No external publishing"
    ],
    "forbiddenDependencies": [
      "external API",
      "secret",
      "login-only flow",
      "paid API",
      "external publishing"
    ]
  },
  "mvpContractV2": {
    "firstScreenValue": "作りたいプロジェクトの概要を入力するだけで、AIが公開までの具体的なタスクリストを自動で生成。何から手をつければ良いか分からない、というクリエイターの最初の壁を取り除きます。",
    "coreInteraction": "「サンプル実行トレースを再生」ボタンを押すと、プロジェクトのアイデアが、具体的なタスクがステージごとに整理されたローンチ計画ボードへと変換される様子を体験できます。",
    "stateChange": "ボタンをクリックすると、初期のプロジェクト入力画面から、AIが生成した詳細なタスクボード表示へと画面が切り替わります。",
    "inspectableOutput": "生成されたタスクボード。各タスクのタイトル、説明、そしてAIが生成したSNS投稿文案のサンプルを確認できます。",
    "staticDataBoundary": "表示されるすべてのタスクとコンテンツは、あらかじめ用意された静的なサンプルデータです。ユーザーが入力した内容をリアルタイムでAIが処理するものではありません。",
    "requiredFiles": [
      "source/README.md",
      "source/metadata.json",
      "source/manifest.json",
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts",
      "source/validation/self-review.json"
    ],
    "nonGoals": [
      "No live external API integration"
    ],
    "forbiddenDependencies": [
      "external API",
      "secret",
      "login-only flow",
      "paid API",
      "external publishing"
    ],
    "contractVersion": "mvp-contract-v2",
    "artifactTier": "proposed_integration",
    "externalDependencyMode": "proposed",
    "externalIntegrations": [
      {
        "service": "Google Gemini API",
        "intendedUse": "ユーザーが入力したプロジェクト概要に基づき、ローンチに必要なタスクリストと、SNS投稿文案などのコンテンツを生成するために `gemini-2.5-flash` モデルを使用します。",
        "dataFlow": "ユーザー入力（プロジェクト概要） -> Gemini API -> タスクリスト/宣伝文案の生成 -> UI表示",
        "authRequirement": "api_key",
        "currentImplementation": "not_connected",
        "adapterPath": "source/core/gemini.ts",
        "sampleDataPath": "source/data/sample-trace.ts",
        "riskNotes": [
          "AIモデルの出力の一貫性・品質は保証されません。",
          "APIのコスト、レートリミット、利用規約は将来的に検討が必要です。"
        ]
      }
    ],
    "runtimeBoundary": {
      "networkCalls": "none",
      "secrets": "none",
      "externalWrites": "none"
    },
    "mvpComplexityBudget": {
      "maxScreens": 1,
      "maxPrimaryActions": 1,
      "maxSourceFiles": 12,
      "maxNewDependencies": 0,
      "allowDatabase": false
    },
    "integrationAssumptions": [
      {
        "service": "Google Gemini API",
        "verificationStatus": "unverified",
        "unavailableOrUnknown": [
          "APIキーの取得方法",
          "具体的な料金体系",
          "正確なレートリミット"
        ],
        "rateLimitRisk": "medium",
        "costRisk": "medium",
        "termsRisk": "medium"
      }
    ],
    "mockFidelity": {
      "samplePayloadPath": "source/data/sample-trace.ts",
      "simulatedBehaviors": [
        "Successful generation of a multi-stage task plan.",
        "Successful generation of social media copy for a specific task."
      ],
      "omittedBehaviors": [
        "API key handling",
        "Rate limits",
        "Live network calls",
        "Error responses from the API",
        "Partial or malformed responses"
      ],
      "failureCasesIncluded": [
        "empty result"
      ]
    },
    "claimBoundary": {
      "publicCopyMustSay": [
        "この計画はAIが提案したサンプルです。",
        "実際のサービス連携は将来的な機能です。",
        "AI生成のコンテンツは必ずご自身で確認・編集してください。"
      ],
      "publicCopyMustNotSay": [
        "リアルタイムデータ連携",
        "成果の保証",
        "自動外部公開",
        "プロダクションレディなAPI連携"
      ]
    },
    "renderVerification": {
      "required": true,
      "checks": [
        "render",
        "click",
        "state_change",
        "screenshot"
      ]
    },
    "humanReviewTriggers": []
  },
  "interactionProofPlan": {
    "primaryAction": "サンプル実行トレースを再生",
    "initialState": "プロジェクト概要入力画面が表示されている状態。",
    "expectedState": "AIが生成したタスクボードが表示され、「企画」「制作」「宣伝」「公開前チェック」のステージにタスクカードが並んでいる状態。",
    "visibleEvidence": [
      "ローンチ計画ボード",
      "企画",
      "制作",
      "宣伝",
      "公開前チェック",
      "ターゲットオーディエンスの特定",
      "SNS投稿文案の作成"
    ],
    "proofSelectors": [
      "button[data-proof='play-trace']",
      "h1[data-proof='board-title']",
      "div[data-proof='stage-企画']",
      "div[data-proof='stage-宣伝']",
      "[data-proof='task-card-title-ターゲットオーディエンスの特定']",
      "[data-proof='task-card-title-SNS投稿文案の作成']"
    ],
    "requiredSourceFiles": [
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts"
    ],
    "manualFallbackReason": ""
  },
  "generatedOutput": {
    "title": "LaunchDeck",
    "oneLiner": "作りたいプロジェクト（動画、ポッドキャスト等）の概要を入れると、公開までのタスクをAIが分解し、宣伝文の案出しから公開前チェックまでを一枚のボードで管理する。",
    "artifactShape": "board",
    "templatePatternId": "ops_steward_console",
    "surfacePattern": "creative_assistant",
    "aiMechanismPattern": "agentic_workflow"
  },
  "rewriteApplied": {
    "changedFilePaths": [
      "source/app/page.tsx",
      "README.md",
      "metadata.json"
    ],
    "appendedFilePaths": []
  },
  "implementationNotes": [
    "オーナーエージェントの『ルートとチェックポイントで構成された、完遂可能な道のりを提供する』という思想を、プロジェクトのアイデアを具体的なタスクボードに変換する中核機能として実装しました。",
    "『最初の画面でステップ1とゴールが見える』という品質基準を満たすため、初期画面では計画開始のボタン（ステップ1）を、結果画面では公開までの全タスク（ゴールまでの道のり）を明確に表示しています。",
    "エージェントの得意な画面タイプである『ボード』形式を、メインの成果物であるタスクボードUIとして採用しました。"
  ],
  "knownRisks": [
    "AIが生成するタスクリストは、入力されたプロジェクト概要によっては、画一的で実用性に欠ける可能性があります。実際の製品では、より多様なプロジェクトに対応できるプロンプトの改良や、ユーザーによるカスタマイズ機能が必要です。",
    "デモは静的なサンプルデータに基づいているため、AIの応答のばらつきやエラーハンドリングといった、実運用で重要となる側面は検証できません。"
  ],
  "title": "LaunchDeck",
  "oneLiner": "作りたいプロジェクト（動画、ポッドキャスト等）の概要を入れると、公開までのタスクをAIが分解し、宣伝文の案出しから公開前チェックまでを一枚のボードで管理する。",
  "agentId": "agent_j",
  "selfDirectedPlan": {
    "agentId": "agent_j",
    "planningIntent": "候補の中から「LaunchDeck」を選びました。これは、私の制作ルールである「次に何をすべきか、そしてそれが完了したことを知る方法を示す」を、クリエイターのプロジェクト公開という複雑なプロセスに対して最も効果的に適用できるコンセプトだからです。強力な製品トレンドと今日的な話題の両方に基づいており、抽象的なAI内部の話（TracePath）よりも具体的で分かりやすく、過去作の焼き直し（おたより羅針盤）でもないため、最も新鮮で価値の高い一歩だと判断しました。",
    "publicProductionMemo": "クリエイターが素晴らしい作品を世に送り出すまでの道のりは、アイデア出しだけでなく、計画や準備に多くの労力を必要とします。この「LaunchDeck」は、AIがその複雑なプロセスを「公開までのロードマップ」として具体的に示し、タスク分解や宣伝文案の生成までを支援します。ユーザーが創作活動に集中できるよう、不明瞭な部分を減らし、確実な一歩を後押しすることを重視して制作しました。過度な成果を期待させる表現は避け、プロセス支援に徹しています。",
    "feedbackConstraints": [
      "プロジェクトの目標達成が不明瞭な「無限のカリキュラム」にならないように、明確な「公開」というゴールと、それに向けた具体的なステップを提示すること。",
      "各タスクに「完了」チェックボックスのような「達成信号」を設けることで、ユーザーがプロジェクトの進捗を明確に把握できるようにすること。",
      "MVPの機能範囲は小さいが、「これでマスターできる」といった過度な主張をしないこと。",
      "AIのタスク分解やコンテンツ生成の精度には限界があるため、ユーザーが容易に内容を確認・修正できるよう、インタラクションと表示を設計すること。"
    ],
    "learningApplied": [
      "まだ十分な反応がない。自分の専門性で今日のsignalから新規に企画する。"
    ]
  },
  "sourceProvenance": {
    "sourceProductUsed": "github_career_ops",
    "sourceProductUse": "direct_evidence",
    "sourceEvidenceAudit": {
      "evidenceLevel": "verified",
      "observedFields": [
        "name",
        "url",
        "sourceType",
        "sourceCategory",
        "attentionProof",
        "evidenceRefs"
      ],
      "inferredFields": [
        "coreMechanism",
        "transferableStructure",
        "antiCloneBoundary",
        "remixableThemes",
        "bestRemixTargets",
        "problemSolved",
        "targetUser",
        "coreUserInput",
        "coreOutput",
        "outputArtifact",
        "interactionPattern",
        "whyItIsInteresting",
        "ideaKernel",
        "noveltyKernel",
        "transformationAxes",
        "cloneRisk",
        "doNotCopy"
      ],
      "missingFields": [],
      "usePolicy": "direct_evidence"
    },
    "antiCloneBoundary": "キャリア運用のドメイン、リポジトリのアイデンティティ、履歴書/面接の自動化ワークフローはコピーしないでください。キャンペーン運用のパターンのみを移転します。",
    "sourceBoundary": "ソース製品 `github_career_ops`から、繰り返される個人的なキャンペーンをモード、キュー、成果物、進捗ダッシュボードに変換する構造を観察証拠として使用しました。具体的なコードやUIは参照せず、コンセプトの核となる仕組みのみを抽出しています。",
    "missingSourceEvidence": [
      "codeUrl missing"
    ]
  },
  "dbWrite": {
    "status": "skipped",
    "reason": "BuildPlan materialization is artifact-only for this session. Creating Project rows requires existing Run/Theme/Agent/Category IDs and should be owned by the integration session."
  }
}

{
  "version": 1,
  "artifactId": "selfdirected_agent_j_20260708T002658",
  "status": "needs_review",
  "entrypoint": "source/app/page.tsx",
  "checks": {
    "firstScreenValue": "declared",
    "userControlledInteraction": "declared",
    "stateChange": "declared",
    "interactionProofPlan": "declared",
    "mvpContractV2": "declared",
    "externalDependencyMode": "proposed",
    "artifactTier": "proposed_integration",
    "renderVerification": "required",
    "inspectableOutput": "declared",
    "staticDataBoundary": "declared",
    "forbiddenDependencies": "declared_absent"
  },
  "interactionProofPlan": {
    "primaryAction": "サンプル実行トレースを再生",
    "initialState": "プロジェクト概要入力画面が表示されている状態。",
    "expectedState": "AIが生成したタスクボードが表示され、「企画」「制作」「宣伝」「公開前チェック」のステージにタスクカードが並んでいる状態。",
    "visibleEvidence": [
      "ローンチ計画ボード",
      "企画",
      "制作",
      "宣伝",
      "公開前チェック",
      "ターゲットオーディエンスの特定",
      "SNS投稿文案の作成"
    ],
    "proofSelectors": [
      "button[data-proof='play-trace']",
      "h1[data-proof='board-title']",
      "div[data-proof='stage-企画']",
      "div[data-proof='stage-宣伝']",
      "[data-proof='task-card-title-ターゲットオーディエンスの特定']",
      "[data-proof='task-card-title-SNS投稿文案の作成']"
    ],
    "requiredSourceFiles": [
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts"
    ],
    "manualFallbackReason": ""
  },
  "mvpContractV2": {
    "artifactTier": "proposed_integration",
    "externalDependencyMode": "proposed",
    "runtimeBoundary": {
      "networkCalls": "none",
      "secrets": "none",
      "externalWrites": "none"
    },
    "claimBoundary": {
      "publicCopyMustSay": [
        "この計画はAIが提案したサンプルです。",
        "実際のサービス連携は将来的な機能です。",
        "AI生成のコンテンツは必ずご自身で確認・編集してください。"
      ],
      "publicCopyMustNotSay": [
        "リアルタイムデータ連携",
        "成果の保証",
        "自動外部公開",
        "プロダクションレディなAPI連携"
      ]
    },
    "renderVerification": {
      "required": true,
      "checks": [
        "render",
        "click",
        "state_change",
        "screenshot"
      ]
    }
  },
  "notes": [
    "Generated by materialize-llm-plan fallback. Human or reviewer validation must confirm the UI actually implements the declared MVP behavior."
  ]
}

"use client";

import React, { useState, useEffect, FC } from 'react';
import { fullTrace } from '../data/sample-trace';
import { sampleInput } from '../data/sample-input';

// --- Types (re-declared locally to avoid importing from source/core) ---
type ProjectInput = {
  id: string;
  title: string;
  description: string;
};

type Task = {
  id: string;
  stage: '企画' | '制作' | '宣伝' | '公開前チェック';
  title: string;
  description: string;
  status: '未着手' | '進行中' | '完了';
  generatedCopy?: {
    platform: string;
    drafts: string[];
  };
};

type LaunchPlan = Task[];

const STAGES: Task['stage'][] = ['企画', '制作', '宣伝', '公開前チェック'];

// --- Components ---

const TaskCard: FC<{ task: Task; onToggleComplete: (taskId: string) => void; onEditCopy: () => void }> = ({ task, onToggleComplete, onEditCopy }) => (
  <div style={{
    border: task.status === '完了' ? '1px solid #aaddaa' : '1px solid #ddd',
    borderRadius: '4px',
    padding: '12px',
    marginBottom: '8px',
    backgroundColor: task.status === '完了' ? '#e6ffe6' : 'white',
    boxShadow: task.status === '完了' ? '0 1px 3px rgba(0,128,0,0.1)' : '0 1px 3px rgba(0,0,0,0.05)',
    transition: 'all 0.3s ease-in-out'
  }}>
    <div style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}>
      <input
        type="checkbox"
        checked={task.status === '完了'}
        onChange={() => onToggleComplete(task.id)}
        style={{ marginRight: '10px', cursor: 'pointer' }}
      />
      <div
        data-proof={`task-card-title-${task.title}`}
        style={{ fontWeight: 'bold', textDecoration: task.status === '完了' ? 'line-through' : 'none', color: task.status === '完了' ? '#888' : '#333' }}
      >
        {task.title}
      </div>
    </div>
    <p style={{ fontSize: '14px', color: '#555', marginTop: '4px' }}>{task.description}</p>
    {task.generatedCopy && (
      <div style={{ marginTop: '10px', borderTop: '1px dashed #ccc', paddingTop: '10px' }}>
        <h4 style={{ margin: '0 0 5px 0', fontSize: '13px' }}>AIによる投稿案 ({task.generatedCopy.platform}):</h4>
        <ul style={{ margin: 0, paddingLeft: '20px', fontSize: '12px' }}>
          {task.generatedCopy.drafts.map((draft, i) => <li key={i}>{draft}</li>)}
        </ul>
        <button
          onClick={onEditCopy}
          style={{
            marginTop: '10px',
            padding: '6px 12px',
            fontSize: '0.8rem',
            cursor: 'pointer',
            border: '1px solid #0070f3',
            borderRadius: '4px',
            backgroundColor: 'white',
            color: '#0070f3',
            fontWeight: 'normal'
          }}
        >
          編集をシミュレート
        </button>
      </div>
    )}
  </div>
);

const LaunchPlanBoard: FC<{ plan: LaunchPlan; onToggleComplete: (taskId: string) => void; onEditCopy: () => void }> = ({ plan, onToggleComplete, onEditCopy }) => (
  <div>
    <h1 data-proof="board-title" style={{ textAlign: 'center', fontSize: '3rem', color: '#1a202c', marginBottom: '10px', textShadow: '1px 1px 2px rgba(0,0,0,0.1)' }}>🚀 LaunchDeck: ローンチ計画ボード</h1>
    <h2 style={{ textAlign: 'center', color: '#4a5568', fontWeight: 'normal', fontSize: '1.5rem', marginBottom: '30px' }}>{sampleInput.title}</h2>
    <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: '20px' }}>
      {STAGES.map(stage => (
        <div key={stage} data-proof={`stage-${stage}`} style={{ backgroundColor: '#f0f4f8', borderRadius: '8px', padding: '15px', boxShadow: '0 4px 12px rgba(0,0,0,0.08)' }}>
          <h3 style={{ borderBottom: '2px solid #334e68', paddingBottom: '10px', marginBottom: '15px', color: '#334e68', display: 'flex', alignItems: 'center' }}>
            <span style={{ marginRight: '8px', fontSize: '1.2em' }}>{stage === '企画' ? '💡' : stage === '制作' ? '🛠️' : stage === '宣伝' ? '📣' : '✅'}</span>
            {stage}
          </h3>
          <div>
            {plan.filter(task => task.stage === stage).map(task => (
              <TaskCard key={task.id} task={task} onToggleComplete={onToggleComplete} onEditCopy={onEditCopy} />
            ))}
          </div>
        </div>
      ))}
    </div>
  </div>
);

// --- Main Page ---
export default function Home() {
  const [traceIndex, setTraceIndex] = useState(-1);
  const [showInput, setShowInput] = useState(true);
  const [currentVisiblePlan, setCurrentVisiblePlan] = useState<LaunchPlan | null>(null);
  const [interactivePlan, setInteractivePlan] = useState<LaunchPlan | null>(null);

  useEffect(() => {
    if (traceIndex > -1 && traceIndex < fullTrace.steps.length) {
      setCurrentVisiblePlan(fullTrace.steps[traceIndex].output as LaunchPlan);
    } else if (traceIndex === fullTrace.steps.length) {
      // Trace completed, initialize interactive plan
      setInteractivePlan(currentVisiblePlan);
    }
  }, [traceIndex, currentVisiblePlan]);

  const handlePlay = () => {
    setShowInput(false);
    setTraceIndex(0);
    let i = 0;
    const interval = setInterval(() => {
      i++;
      if (i > fullTrace.steps.length) { // > to ensure interactivePlan is set after final step output
        clearInterval(interval);
      } else {
        setTraceIndex(i);
      }
    }, 500); // 0.5 seconds per step
  };

  const handleToggleTaskComplete = (taskId: string) => {
    if (interactivePlan) {
      setInteractivePlan(prevPlan => {
        if (!prevPlan) return null;
        return prevPlan.map(task =>
          task.id === taskId
            ? { ...task, status: task.status === '完了' ? '未着手' : '完了' }
            : task
        );
      });
    }
  };

  const handleEditCopy = () => {
    alert('AI生成文案の編集機能は、将来の実装で提供されます。\n（このデモではシミュレートです）');
  };

  const planToRender = interactivePlan || currentVisiblePlan;

  return (
    <main style={{ fontFamily: 'sans-serif', padding: '20px', backgroundColor: '#eef2f7', minHeight: '100vh' }}>
      <div style={{ maxWidth: '1200px', margin: '0 auto' }}>
        <header style={{ textAlign: 'center', marginBottom: '40px', background: 'linear-gradient(135deg, #0070f3 0%, #00bfff 100%)', padding: '20px', borderRadius: '12px', color: 'white', boxShadow: '0 6px 20px rgba(0,112,243,0.25)' }}>
          <h1 style={{ fontSize: '3rem', margin: '0' }}>🚀 LaunchDeck</h1>
          <p style={{ fontSize: '1.3rem', color: '#e0e7ff', margin: '10px 0 0' }}>アイデアを、公開までのロードマップに変換しよう。</p>
        </header>

        {showInput && (
          <div style={{ backgroundColor: 'white', padding: '40px', borderRadius: '8px', textAlign: 'center', boxShadow: '0 2px 10px rgba(0,0,0,0.05)' }}>
            <h2 style={{marginTop: 0, color: '#333'}}>プロジェクトの概要を入力</h2>
            <div style={{ backgroundColor: '#f9f9f9', border: '1px solid #eee', padding: '15px', borderRadius: '4px', textAlign: 'left', margin: '20px 0', whiteSpace: 'pre-wrap', color: '#666' }}>
                {sampleInput.description}
            </div>
            <button
              onClick={handlePlay}
              data-proof="play-trace"
              style={{
                padding: '12px 24px',
                fontSize: '1.1rem',
                cursor: 'pointer',
                border: 'none',
                borderRadius: '5px',
                background: 'linear-gradient(45deg, #0070f3, #00bfff)',
                color: 'white',
                fontWeight: 'bold',
                boxShadow: '0 4px 15px rgba(0,112,243,0.3)',
                transition: 'transform 0.2s ease-in-out'
              }}
              onMouseOver={(e) => (e.currentTarget.style.transform = 'translateY(-2px)')}
              onMouseOut={(e) => (e.currentTarget.style.transform = 'translateY(0)')}
            >
              サンプル実行トレースを再生
            </button>
          </div>
        )}

        {!showInput && planToRender && (
          <div>
             <LaunchPlanBoard
               plan={planToRender}
               onToggleComplete={handleToggleTaskComplete}
               onEditCopy={handleEditCopy}
             />
          </div>
        )}
      </div>
    </main>
  );
}