Vibe Coder Bootcamp ランディングページ

7 つの構成セクション、図解、カリキュラムカード、ポートレート、CTA ブロックを備えた、プレミアムな日本語 AI コーディングブートキャンプ用ランディングページを生成するための詳細なプロンプト。

プロンプト

ゴール: Vibe Coder Bootcamp のための、縦長の日本語ランディングページモックアップを作成してください。プレミアムで重厚、かつ少し哲学的なトーンでありながら、明確な実用的メリットを提示する AI コーディング / AI エージェントブートキャンプの紹介ページです。キャンバス: 縦長のモバイルウェブランディングページのスクリーンショット、アスペクト比は約 9:16。白を基調としたページ本体に、ダークでシネマティックなヒーローセクションと、ページ中盤のダークな写真帯を配置してください。洗練されたスタートアップ / 教育系ランディングページのスタイル、高精細、シャープなタイポグラフィ、クリーンな余白を意識してください。ビジュアルスタイル: オレンジのアクセントタイポグラフィ、深いネイビー / ブラックの背景、白いコンテンツカード、細いグレーの区切り線、パープルのハイライト、シンプルなラインアイコン、ドキュメンタリー風のポートレートを組み合わせた、日本のプレミアムなビジネスデザイン。日本語の見出しにはセリフ体に近い書体を、UI テキストにはモダンなサンセリフ体を使用してください。実際の LP デザインコンペのように、密度が高く、かつ読みやすいレイアウトにしてください。レイアウトとセクション: No.01 から No.07 まで、正確に 7 つの番号付きセクションを含めてください。ヒーローセクション: 上部にダークでシネマティックなバナー。左側に大きなオレンジ色の英語タイトル「Vibe Coder Bootcamp」、日本語サブタイトル「AI を完全に味方につける、1.5 ヶ月。」、および小さな日本語コピー「1 回 2.5 時間×全 5 回＋Demo Day。アプリも資料も動画も、あらゆるアウトプットを AI で」を配置。オレンジ色の角丸 CTA ボタン「資料請求・お問い合わせ」を設置してください。右側には、夜の薄暗いオフィス / 図書館で、街の明かり、コンピュータモニター、本棚、温かみのあるデスクランプに囲まれ、思案にふける黒いスーツを着た日本人男性を配置してください。 No.01 セクション: 白背景にオレンジ色の「No.01」と小さなラベル「課題」。大きな日本語見出し：「AI は、もう十分に賢い。足りないのは、あなたの入力。」サポートライン：「入力の質＝出力の質。」右側に「BEFORE / AFTER」の 2 枚のカード図解を表示：BEFORE カードには「あいまいな入力」から「あいまいな出力」へ向かう乱雑な落書きアイコン、AFTER カードには「構造化された入力」から「価値の高い出力」へ向かうパープルのターゲットアイコンを配置。2 枚のカードの間に小さな矢印を置いてください。 No.02 セクション: 白背景にオレンジ色の「No.02」とラベル「解決＝コンテクストコントロール」。メイン見出し：「コンテクストコントロール。AI エージェント時代の、基礎力。」大きなグラデーションのフレーズ「まわせ Vibes Output Loop」を追加。右側に、曲線矢印でつながれた 3 つのループステップを表示：STEP1「与える (GIVE)」(ドキュメント / 人物アイコン、必要な背景・目的・制約・カード情報の提供に関する説明)、STEP2「蓄積する (ACCUMULATE)」(チャット吹き出しアイコン、日々のチャットを通じた業務・アイデア・全社的なコンテクストの蓄積に関する説明)、STEP3「循環させる (LOOP)」(オレンジ色のループ矢印、ツール・ドキュメント・動画・アプリを通じてコンテクストを繰り返し循環させることに関する説明)。 No.03 セクション: 白背景にオレンジ色の「No.03」とラベル「カリキュラム」。見出し：「SNS アプリ開発を“通じて”コンテクストコントロールを体得する。SNS を作るのが目的ではない。」パープルのヘッダーを持つ 6 つの横並びカリキュラムカード：WEEK01「企画・要件定義」、WEEK02「UI/UX・設計」、WEEK03「実装・DB 設計」、WEEK04「認証・セキュリティ」、WEEK05「デプロイ・運用」、DEMO DAY「成果発表・講評」。その下に、アイコン付きの 4 つの機能カード：「企画・UI/UX」(オレンジ色のワイヤーフレームアイコン)、「動くアプリ (DB・デプロイ)」(パープルのデータベースアイコン)、「セキュリティ」(ダークな盾アイコン)、「API・エージェント基盤」(パープルの接続ノードアイコン)。 No.04 セクション: 白背景にオレンジ色の「No.04」とラベル「卒業後にできること」。サムネイルイラスト付きの 4 つの能力カードを横並びで表示：「アプリ・サービス」(アプリダッシュボードのスクリーンショット)、「資料・ドキュメント」(チャート / レポートページ)、「画像・動画」(動画 / 画像エディターのサムネイルと再生ボタン)、「業務の自動化」(自動化フローチャートアイコン)。各カードのタイトル下に短い日本語の説明文を添えてください。 No.05 セクション: 全幅のダークでシネマティックな帯。左側にオレンジ色の「No.05」とラベル「相棒すなわち AI」。大きな白い見出し：「一人で、会社を回す。」サポートコピー：「AI エージェントに仕事をさせ続ける人になる。」右側には、デスクで手を組み、複数の透過した分析 / UI 画面、チャート、コード、夜のオフィス街の雰囲気、温かいランプと地球儀のディテールに囲まれた、同じ真剣な表情の日本人ビジネスマンを配置。 No.06 セクション: ダークグレーのポートレート帯。左側にオレンジ色の「No.06」とラベル「講師」。見出し：「教えるのは、日本でただ一人。泉水亮介」と、リベラルアーツ、起業、大学での教鞭、Vibe Coding に関する小さな日本語の経歴。右側に泉水亮介のリアルなプロフェッショナルポートレート（日本人男性、黒いジャケット、落ち着いた表情、コンクリート壁の背景）。一番右に、日本の賞のような小さな金色の月桂樹バッジを 3 つ追加してください。 No.07 セクション: 白背景の最終 CTA ストリップ。左ラベルにオレンジ色の「No.07」と「実績・CTA」。3 つの指標カード：「開発アプリ 120+」、「満足度 98%」、「業務 9 割を AI で」(それぞれ小さなアイコン付き)。右側に、封筒アイコン付きの大きなオレンジ色の角丸ボタン「資料請求・お問い合わせ」と、小さなテキスト「お気軽にご相談ください」。Vibe Coder Bootcamp と AI エージェント時代のスキルに言及した小さな日本語テキストを含む細いフッターラインを追加してください。制約事項: 指定された箇所のテキストはすべて日本語で記述し、7 つの番号付きセクション、6 つのカリキュラムカード、4 つの機能カード、4 つの能力カード、3 つのループステップ、3 つの最終指標を正確に維持してください。余分なセクション、透かし、ブラウザのクローム、無関係なロゴは追加しないでください。最終的な結果は、個別の Slides ではなく、単一の連続したランディングページのスクリーンショットのように見える必要があります。