Codexと作る「 漫画でわかるCodex 」〜相談で終わらせないAI活用の伝え方〜

はじめに

こんにちは。グループIT推進本部の鷹雄です。
Codex Ambassadorとして、社内外にCodexの使い方を広げる活動をしています。

Codexをだれかに紹介するとき、エンジニアには「コードを書き、理解し、レビューし、デバッグするエージェント」と説明すると伝わりやすいです。一方で、ビジネス職、デザイナー、PM、管理職に広げようとすると、同じ説明だけでは少し距離があります。

特に伝えたいのは、Codexが単なる「相談相手」ではなく、ファイルを読み、成果物を作り、動かし、確認し、直すための「作業場」になるということです。

〜 ChatGPTで相談。Codexで実行。〜

この一言を機能一覧ではなく物語で伝える為、学習漫画『 AIステップ新入社員コウ 』という企画をCodexと一緒に作りました。
実際に作成した漫画PDF:第1話「もうCodexだよ」24ページ完成版(PDF)(約10.7MB)

 

作ったもの

今回作ったのは、Codex Ambassador活動向けの学習漫画パッケージです。大学時代からCodexを使い倒していた新卒のコウが、5人規模のWeb制作会社に入社し、飲料メーカーの新商品サイト提案コンペをCodexで前に進める、というビジネス漫画です。

  • 24ページの完成版漫画PDF
  • ブラウザで読めるHTMLビューア
  • 各ページのPNG
  • 企画書、50ページネーム、24ページ再構成案
  • キャラクター設定画
  • 画像生成用プロンプト
  • 第1話の教育設計メモ

学習漫画『 AIステップ新入社員コウ 』PDF:第1話「もうCodexだよ」24ページ完成版(PDF)(約10.7MB)

制作物のコンタクトシート。表紙、重要シーン、説明ページを俯瞰して、読み順や見え方を確認しました。

制作者のコンタクトシート:表紙、重要シーン、説明内容を俯瞰し、読み順や見方を確認しました。

途中で作った設定原画

CodexではChatGPTのImageモデルが特に設定なしでそのまま呼び出すことが出来ます。
指示を与えるだけで簡単に設定原画を生成することが可能です。

キャラクター設定は、漫画としての読みやすさに直結します。
AI生成では全員が平均的な美男美女に寄りやすいため、名前、役割、シルエット、弱点、生活感をセットで調整しました。

AI生成では全員が平均的な美男美女に寄りやすいように、《名前・役割・シルエット・弱点・生活感》をセットで調整しました。

設定図:高瀬 功

設定図:藍沢 アイ

設定図:古田 堅吾

設定図:水原 涼介

 

制作フロー

制作は、漫画制作というよりもソフトウェア開発に近い進め方にしました。最初に企画の目的、読者、メッセージ、登場人物を固め、次に50ページのネームを作りました。その後、32ページ版、24ページ版へと圧縮しました。最初の50ページ版は説明したいことが多く、教材寄りでした。24ページ版では、重複した説明をまとめ、中盤以降は「作れる」ことよりも「早く判断できる」ことに価値を寄せました。画像生成は、表紙、キャラクター設定、本文ページに使いました。
本文ページは、完成ページ画像として生成し、その出力をハーネスで確認し、うまくいかなければプロンプトや制約を直して再生成する流れにしました。
画像生成では、表紙・キャラクター設定・本文ページに使いました。

 

使ったプロンプトの考え方

プロンプトは、一発で「漫画を作って」と頼むのではなく、成果物ごとに役割を分けました。

  • 企画・教育設計を作るプロンプト
  • 50ページ/32ページ/24ページのネームを作るプロンプト
  • キャラクター設定画を作るプロンプト
  • 1ページ単位の漫画原稿画像を作るプロンプト

特に画像生成では、判型、コマ構成、登場人物、入れる台詞、避ける表現、チェック観点を明示しました。

Create one complete black-and-white Japanese business manga page
for episode 1 of an educational manga about Codex.

The page must be composed like a standard B4 manga manuscript page
in portrait orientation, close to aspect ratio 257:364,
not a long vertical webtoon page.

Use the supplied Japanese dialogue exactly.
Keep panel order readable, character identities consistent,
and avoid logos, watermarks, broken hands, unreadable UI text,
or expressions that imply AI made the work without human review.

重要なのは、画像生成を一発勝負にしなかった点です。Codexには、ページを生成するだけでなく、出力を確認するハーネスも作らせました。読めるか、話者が合っているか、ページの役割が伝わるか、表現が強すぎないかを確認し、NGなら再生成します。

 

失敗と対応

1. 生成したページをそのまま採用すると品質がばらつく

漫画ページを画像として生成すると、見た目は一気に完成します。一方で、台詞が読みにくい、話者がずれる、コマ順が分かりづらい、キャラクターの顔が前ページと変わる、表現が強すぎる、といった問題が起きます。そこで、画像を生成して終わりにせず、Codex側でハーネス(制約)を作り、ページごとにチェックする流れにしました。チェックでNGになったら、プロンプト、台詞、構図指定、禁止表現を直して再生成します。

Generate page image
  -> Check dialogue readability
  -> Check speaker / character consistency
  -> Check panel order and page role
  -> Check risky wording, logos, rights, and overclaims
  -> If NG, revise constraints and regenerate
2. 漫画の読み順が不安定になる

同僚に完成品をレビューしてもらったときに、同じ段のコマが日本の漫画らしい右から左の流れではなく、逆に見える箇所があると指摘されました。対応として、P1の再生成では「B4漫画原稿」「縦長Webtoonではない」「conventional magazine manga page layout」「Panel 1 / Panel 2 …」のように、判型とコマ順を明示しました。AIだけにまかせず、人の目でチェックした際にその解決策をCodexの制約に追加します。

3. キャラクターが全員きれいに寄りすぎる

AI生成のキャラクター設定画は、油断すると全員が平均的な美男美女になります。
そこで、上司の古田さんには「少し疲れている」「紙資料とコンビニコーヒーを持っている」「シャツが少しシワ」「イケオジにしすぎない」といった弱点や生活感を入れました。一方で、ヒロインのアイ先輩は魅力を強めつつ、過度な性的表現には寄せないように、fully clothed office casualno fanserviceno exposed cleavage のような禁止条件も入れました。

4. 説明が多すぎて漫画として重くなる

ここら辺もいきなりAI任せにすると起こりがちです。人間の感覚的な物はAIがいきなり解決出来る物では無いため、盛り込みたいコンテンツを現行に入れるとかなりボリュームが大きくなり説明が増えてしまいます。最初の50ページ版は、資料整理、ハーネス、検証ループ、Drive連携、スキル、画像生成、スライド、Web試作、クライアント提案、チーム展開まで入っていました。教材としては良くても、漫画としてのテンポが落ちます。

そこで、32ページ版を経て24ページ版に再構成しました。一部コンテンツから削ったり、重複していた説明を統合しました。

Codexを使って良かったところ

今回の制作で一番良かったのは、Codexが「会話」ではなく「作業フォルダ」を中心に進められることでした。漫画制作では、企画書、ネーム、ページ画像、キャラクター設定、プロンプト、HTMLビューア、PDFなど、成果物がどんどん増えます。通常のチャットだけで進めると、どれが最新版か、どの前提で作ったかが散らばりがちです。

  • docs/01_concept.md: 企画書
  • docs/02_50_page_name.md: 50ページネーム
  • docs/05_episode1_educational_version.md: 第1話の教育設計
  • episode1_name_24p/docs/24p_recut_plan.md: 24ページ再構成案
  • assets/characters/: キャラクター設定画とプロンプト
  • pages/: 生成した各ページ画像

この構造があると、「前回の案を踏まえて短くする」「このキャラクター設定を維持して表紙を作る」「チェック結果をもとにプロンプトを直して再生成する」といった反復がやりやすくなります。

社内外レビューで分かったこと

作った漫画は、まずSlackで共有しました。すると部署の広報担当チームのメンバーがPDF化や告知文面の作成まで進めてくれました。この反応から分かったのは、完成物そのものだけでなく、漫画を書いたことがない人間が、制約をかけながらCodexを数時間回してここまで作れたという制作過程自体が、Codexの価値を伝える材料になるということです。

  • PDFとして読みやすい形にする
  • 告知文面では「素人がCodexでマンガを作ってみた」とした方が伝わりやすい
  • 同じ段のコマの読み順に違和感がある箇所がある
  • タイトルの「異世界転生」要素は、文脈が伝わりづらければ外した方がよい
  • 第2話以降では、デザインレビューやプラグインの話も入れられそう

公開前に気をつけたいこと

  • 生成画像に含まれる文字、UI、ブランド表現
  • 特定の漫画家、出版社、作品を想起させない表現
  • 社内資料や実在案件に見える情報が入っていないか
  • AI生成画像を使う範囲と注記
  • 「AIでコストが下がる」などの表現が過剰でないか

漫画は親しみやすい一方で、誤解も広がりやすいメディアです。
「AIが勝手に全部やった」ではなく、「人間が目的、制約、確認方法を持ち、Codexで作業を進めた」という形で伝えることが大事だと思っています。

まとめ

今回の漫画は、原稿、プロット、作画、校閲、そしてこのブログ記事のドラフトまで、制作工程のほぼすべてにCodexを使って作りました。もちろん、最後の判断や公開可否は人間が確認します。ですが、目的、制約、素材、確認方法を渡せる業務であれば、Codexは「考える」だけでなく、作り、直し、検証し、共有できる形にするところまで一緒に進められます。

Codexは ” 仕事を速くするだけでなく、仕事の進め方そのものをアップデートする作業場 “ です。

この漫画制作そのものが、その実例になったと思っています。次は、この漫画を使ったCodexハンズオンや、営業資料作成編、デザインレビュー編などにも展開していきたいです。

アバター画像
2011年にCyberAgent America, Inc.へ中途入社。フルスタックエンジニアとしてサンフランシスコに3年間駐在。帰国後は約5年間、広告事業に従事したのち、現部署に異動しDX推進を担当。現在は、AI活用を牽引するデータエンジニアとして、従業員の生産性向上、コスト最適化、ガバナンス強化などを推進。