作りたいものの概要をAIが公開までの計画に変える
プロジェクトの概要を入力すると、AIが公開までのタスクを分解し、宣伝文案出しから公開前チェックまでを計画します。これらの作業は一枚のボードに整理され、プロジェクトのローンチをスムーズに進められます。
多くのクリエイターが直面する「アイデアはあるが、どこから手をつければいいか分からない」という壁。LaunchDeckは、その漠然としたアイデアを、AIが具体的な「公開までのロードマップ」へと変換する、まさに管制室（Deck）のような存在です。単なるToDoリストではなく、SNS投稿案まで生成してくれるため、地味で複雑な準備作業からクリエイターを解放します。これは、ゴールまでの複数ステップを自律的に計画・実行する「AIエージェント」技術の考え方を、誰もが使える形に応用した新しい試み。これにより、一人でも自信を持ってプロジェクトを完遂できる「次の一歩」が、はっきりと見えるようになります。
今後は、現在は単一のサンプルプロジェクトにしか対応していませんが、将来的には多様なクリエイティブ（ポッドキャスト、ニュースレター等）に特化したタスクテンプレートをAIが提案できるようにし、さらにユーザーがタスクを自由に追加・編集できる機能を加えて、あらゆるクリエイターの右腕のような存在にしたいです。
この作品の使い方と、画面で確認するポイントをまとめて表示します。
プロジェクトの概要を入力するだけで、AIが公開までのタスクと宣伝文案を自動で生成し、ローンチ計画を立てるプロセスを体験できます。
プロジェクトのタイトルと内容を準備します。例えば「初心者向けAI動画編集ガイド」として、「AIを活用した動画編集の基本を解説するYouTube動画シリーズの企画。撮影から公開、プロモーションまでの一連の流れを支援する。
AIはクリエイター専門の優秀なプロジェクトマネージャーの役割を与えられ、入力されたプロジェクト概要から公開までの具体的なタスクリストを生成する設計です。タスクは「企画」「制作」「宣伝」「公開前チェック」の4ステージに分類され、各タスクにはID、タイトル、説明、ステータスが含まれます。例えば、「ターゲットオーディエンスの特定」といったタスクが生成されます。
AIはプロのSNSマーケターとして、プロジェクト告知文をX(旧Twitter)向けに3パターン作成する設計です。ユーザーの興味を引くキャッチーな文章と関連ハッシュタグを含みます。例えば、「SNS投稿文案の作成」タスクに対して、具体的な投稿文案が生成されます。
AIが生成したタスクボードが表示されます。各タスクにはタイトル、説明、そしてSNS投稿文案のサンプルが含まれます。例えば、「動画撮影と素材収集」といった制作タスクが、「未着手」のステータスで整理されます。
この作品でAIが重視した制作方針を、公開向けに整理して表示します。
この作品に対するコメントとAIレビューをまとめて表示します。
宣伝文案の生成やタスク分解は便利ですが、AIの出力がそのまま公開されるリスクを考慮する必要があります。特にプロモーション文は、事実誤認やブランドイメージとの齟齬がないか、最終的な人間による確認プロセスが必須だと考えます。
この作品で保存されているコードと確認用ファイルをまとめて表示します。
"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 === '完了' ? 'lin
...