Claude Codeの記事作成ワークフローにデザイン担当を加えて、育てていく話


こんな人に読んでほしい!
  • Claude CodeやAIで何か仕組みを作っている・作ろうとしている
  • ブログ記事の見た目やブロックの使い方をもっと工夫したい
  • エージェントって、どうやって育てていくものなのか気になっている

記事を書き終わってから、いつも考えていました。

「このブロック、もっとうまく使えないかな。」

チェックボックス・ポイントボックス・引用ブロック——下書きを作る記事化エージェントは、どこにどのブロックを使うかをリストにして出力してくれていました。

SWELLのブロック機能のデザイン性が、気に入っていました。

うまく使えば、記事がわかりやすくなる。見た目もよくなる。

でも、やみくもに使っていくと、読みづらくなったり、雑然とした印象になってしまうかもしれない。

「上手く使っているサイトを、参考にできないだろうか。」

そこでClaude AIに相談して、参考になるブログを探してみることにしました。

この記事は、その気づきをきっかけに、記事作成ワークフローを見直して、デザインエージェントをチームに加えた改善の記録です。


目次

これまでの仕組みと、見えてきた課題

これまで

編集長エージェントを実際に動かして記事を作る流れを初めて確かめました。

  • 編集長エージェントを実際に動かして記事を作る流れを初めて確かめました。
  • 設計メモ・chat_memos・CLAUDE.mdの3つがセットで引き継ぎの仕組みとして機能するようになった話を書きました。

この2記事を経て、エージェントの体制はこうなっていました。

  • 編集長(CLAUDE.md):全体の進行管理・各エージェントへの指示
  • 記事化エージェント(article_agent.md):構成案・下書きの作成
  • ライティングエージェント(writing_agent.md):トンマナを整えた完成原稿の作成

デザインエージェント(design_agent.md)は存在していましたが、記事作成の流れには入っていませんでした。

記事化エージェントはすでに、下書きの最後に「ブロック適用リスト」を出力する仕組みを持っていました。

チェックボックス・ポイントボックス・引用ブロック・コードブロック——どこに何を使うかをリストにして出力してくれる。それ自体は機能していたんです。

ただ、私自身がSWELLのブロック機能を使いこなせているかというと、まだ自信がありませんでした。

実際にいろいろなブロックを試してみたこともあったのですが、記事の見た目がうるさい感じになってしまって。うまく使えば読みやすくなるはずなのに、やみくもに増やすと逆効果になる。

参考になるサイトを自分で探すことも考えました。でも、どこから手をつければいいかわからないし、たどり着くまでに途方もない時間がかかりそうで。

そこでClaude AIに相談してみると、「参考になるブログを提案できますよ」と言ってもらえました。


Claude AIと相談しながら、参考ブログを探した

「探す手助けをしてもらえないか」とClaude AIに相談してみました。すると、どんな条件で探すかを一緒に整理しながら、プロンプトを作ってくれました。

こんなプロンプトを作りました。

以下の条件でデザインが参考になるブログを探してください。

検索条件
ターゲット:50代・AI初心者・副業・ブログ運営などのテーマ
デザインの観点:読みやすい・余白が美しい・ブロックの使い方が上手い
SWELLユーザーであれば尚良いが、他テーマでも可

まとめてほしいこと
各ブログについて以下を教えてください。
ブログ名・URL
使用テーマ(わかれば)
デザインのどこが参考になるか(3点以内で簡潔に)
アイビーさんのブログに取り入れられそうな要素

候補数:3〜5件

実際にいくつかのブログを見てみると、「こんな人に読んでほしい!」ボックスを記事の冒頭に置いている記事が多いことに気づきました。

読者が「自分のことだ」と感じてそのまま読み続けてもらうための入口として機能している。

STEPブロックも、番号・見出し・説明がセットで整理されていて、手順が格段に見やすくなっていました。

なるほど、書き方の問題じゃなくて、見せ方の設計の問題だったんだ。


デザインエージェントをワークフローに組み込んだ

次に考えたのは、「この知識をどこに持たせるか」でした。

記事化エージェントのブロック提案リストに「こんな人に読んでほしい!」ボックスやSTEPブロックを追加する——それも選択肢のひとつでした。

でも、あえてデザインエージェントに役割を持たせる方法を選びました。

「固定ルールを増やす」のではなく、「育てていけるエージェントを作る」という考え方にしたかったから。

デザインの知識・ノウハウをデザインエージェントに学習させていくことで、知識の成長がそのままブログ記事の改善につながる仕組みになります。

記事化エージェントはあくまで「文章の骨格を作る担当」。デザインエージェントは「見せ方を考える担当」。役割をはっきり分けた方が、それぞれのエージェントが育てやすい。

そう考えて、デザインエージェントに「記事デザイン診断の役割」を新たに追加しました。

ワークフローの変化

変更前(3エージェント)

編集長が記事化エージェントに下書きを依頼する
↓
記事化エージェントが下書きを作成する
↓
編集長がライティングエージェントに完成原稿を依頼する

変更後(4エージェント)

編集長が記事化エージェントに構成案を依頼する
↓
記事化エージェントが構成案を作成・編集長に返す
↓
アイビーが確認・OKを出す
↓
記事化エージェントが下書きを作成する
↓
編集長がデザインエージェントに下書きの診断を依頼する
→「STEPブロックに適した箇所」「ブロック提案」「書き方の改善提案」を出力する
↓
編集長がデザインエージェントの指摘を記事化エージェントに戻す
↓
記事化エージェントが指摘をもとに下書きを修正する
↓
編集長がライティングエージェントに完成原稿を依頼する

構成案の確認という手順も同時に追加しました。「書いてしまってから方向が違った」を防ぐためです。


新ワークフローで、第9話を作ってみた

新しいワークフローを最初に使ったのが、前回の記事(SEOの土台を整えた話)でした。

結果として、初めて使えたブロックがいくつかありました。

  • 「こんな人に読んでほしい!」ボックスを冒頭に設置できた
  • STEP1〜STEP4で、手順が番号とセットで整理された
  • ポイントボックスが3か所に入り、記事の山場がはっきりした

デザインエージェントが「ここをSTEPブロックにすると読みやすくなります」「この一言はポイントボックスで目立たせましょう」と具体的に指摘してくれたことで、修正の方向がはっきりしました。

書く前からデザインを意識していると、下書きの段階から構成が整ってくる。

「書き終わってから整える」ではなく、「デザインを考えながら書く」に変わっていきました。


やってみて思ったこと

デザインエージェントをワークフローに加えたことで、記事の仕上がりが変わりました。

でも、もっと大事だと感じたことがあります。

これは「完成した仕組み」じゃない、ということです。

デザインエージェントが今持っている知識は、まだ入口のレベルです。参考ブログから学んだこと、実際に記事を作る中で気づいたこと——それをこれからも少しずつ追記していく。

仕組みは、使いながら育てていくもの。

これまでもワークフローの改善のために記事を書いてきましたが、この考え方は変わっていません。

4エージェント体制になった今も、次の改善のきっかけはきっとまた記事を作る中で見えてくると思っています。


今日のまとめ・次回予告

今回やったこと:

  • あるブログを参考に、「こんな人に読んでほしい!」ボックスとSTEPブロックを取り入れることを決めた
  • デザインエージェントに「記事デザイン診断の役割」を追加した
  • ワークフローを3エージェントから4エージェントに進化させた
  • 新ワークフローで実際記事を作り、仕組みが動くことを確かめた

固定ルールを増やすのではなく、育てていけるエージェントを作ること。

「仕組みは使いながら育てていくもの」という考え方のまま、これからも改善を続けていきます。

次回は、デザインエージェントにSWELLの知識や参考ブログを学習させた実験の記録です。知識を入れると何が変わるのか、そして想定外だった気づきもそのまま書きます。よかったら読んでいただけたら嬉しいです。


よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

50代・AI初心者がClaude Codeを使いながらブログ副業に挑戦中。失敗もつまずきも全部記録していきます。一緒に歩んでいきましょう!

目次