AIとブログ執筆の融合

このブログはClaude Codeを使って記事を作成しています。
Google Photosの共有URLを渡すだけで、画像のダウンロードから記事の執筆、公開まで一貫して行える仕組みを構築しました。
そのシステムの全体像と技術的な詳細を紹介します。

システム概要

このブログ記事作成システムは、以下の要素で構成されています。

  • Claude Code: AI記事執筆エンジン
  • Playwright: Google Photos画像URL抽出（ヘッドレスブラウザ）
  • Python + Jinja2: 静的サイトジェネレーター
  • GitHub Pages: ホスティング

ユーザーが行うのは、Google Photosの共有URLを渡すことと、必要に応じて質問に答えることだけです。

例えば、このような形でClaude Codeに依頼します。

/post https://photos.app.goo.gl/xxxxx またもうみんぴあで魚をつりました
ヨコスジフエダイは初めての魚種です。この魚は南方系だと思うのですが。
ヨコスジフエダイについて調べて記載

→ 作られた記事: うみんぴあ釣行 - 初めてのヨコスジフエダイ

/post https://photos.app.goo.gl/xxxxx 立山へゆきます。 
立山駅から室堂へ行きます。 
ケーブルカーはメンテナンス中で、立山駅から臨時のバスが出ています。
臨時のバスで70分程度で立山駅から室堂へいけます 
今回はあんまり調査していなかったので、とりあえず行けそうな坂をのぼります。
最終的には室堂山の展望台くらいまでいきました。200mくらいの登りでしょうか、
室堂山の中腹で稜線にでて、北アルプスの山々が見えます

→ 作られた記事: 立山室堂山展望台 - 臨時バスで行く初冬の北アルプス絶景ハイク

これだけで、画像のダウンロードから記事の執筆、公開まで自動的に進行します。

Blog作成ワークフロー

AIが行うBlog記事作成は以下の4ステップで進行します。

Step 1: 画像処理・分析

Google Photos共有URLから画像を取得する工程です。

# URL抽出（Playwright版・約25秒で完了）
python scripts/google_photos_extractor_playwright.py "共有URL" \
  --headless --save-file photos --work-dir "記事識別名"

# 画像ダウンロード（EXIF日時自動抽出）
python scripts/download_images_for_review.py \
  --work-dir "記事識別名" --article-title "記事タイトル" --clean

Playwright版のスクリプトは、Selenium版と比較して約6.4倍の高速化を実現しています。
ヘッドレスモードでGoogle Photosページをスクロールし、背景画像URLを直接取得する方式を採用しました。

ダウンロードスクリプトでは、EXIF情報から撮影日時を自動抽出し、記事の推奨日付を決定します。
これにより、写真を撮った日が自動的に記事の日付になります。

Step 2: 画像内容確認

Claude Codeが各画像を読み込み、内容を確認します。
生成された画像分析MDファイルには、各画像のメタ情報と記事用URLが記録されています。

### 画像 1: review_image_01_aeca4bf6.jpg
- **撮影日時**: 2025-12-01 00:42:58
- **画像サイズ**: 1000×545px
- **URL**: `https://lh3.googleusercontent.com/...`
- **内容説明**: [Claude Codeで画像確認後に記入]

Claude Codeは画像をマルチモーダルで認識し、内容説明を記入します。
この情報が後の記事作成で使用されます。

Step 2.5: 体験ヒアリング

画像だけでは把握できない情報を、必要に応じてユーザーに質問します。

質問の観点:
- この日で一番印象に残ったことは？
- 期待通りでしたか？予想外だったことは？
- この記事で一番伝えたいことは？

このステップは任意で、AIが「質問が必要」と判断した場合のみ実行されます。
プロンプトに十分な情報がある場合や、定型的な活動の場合はスキップされます。

Step 3: 記事作成

文体ガイドに従って記事を作成します。ここが本システムの核心部分です。

Step 4: 品質チェック・公開

記事の検証とビルド・公開を実行します。

npm run 検証        # 記事フォーマットの検証
npm run ビルドして公開  # 静的サイト生成 & GitHub Pagesデプロイ

文体ガイドの設計

AIが書く文章は、しばしば大げさになりがちです。
「圧巻の」「感動的な」「一生忘れられない」といった表現が多用されると、読んでいて疲れます。

このシステムでは、文体ガイドを詳細に定義することで、等身大の語りを実現しています。

表現の温度感

✅ 目指す温度感:
- 「なかなか良かったです」「期待以上でした」
- 「正直、ちょっと疲れました」「これは想定外でした」

❌ 避ける温度感:
- 過剰: 「圧巻の」「感動的な」「一生忘れられない」
- 無機質: 「〇〇がある。〇〇を見た。〇〇を食べた」の羅列

読者との対話感

体験記の魅力は「一緒に旅している感覚」を作れることです。
文体ガイドでは、シーン別の語りかけパターンを定義しています。

【導入・冒頭】— 読者を引き込む
- 「〜という場所、ご存知でしょうか」
- 「〜って、意外と知られていないかもしれません」

【予想外・困難】— 共感を誘う
- 「これは想定外でした」
- 「旅にはこういうこともありますよね」

【まとめ・結び】— 余韻を残す
- 「次は〜も試してみたいと思います」
- 「〜が気になる方は、検討してみてください」

語りかけの頻度は「1セクションに0〜1回」と制限しています。全ての段落に入れると「くどく」なるためです。

文章のリズム

同じ構造の文が続くと単調になります。
文の長さを意識的に変えることで、読みやすさを作ります。

❌ 単調な例:
市場に到着しました。テントが張られていました。
バイクがたくさん停まっていました。

✅ リズムのある例:
市場に着きました。
青や赤のテントの下で、人々が声を張り上げて何かを売っています。
バイクがずらりと並び、近づくと香辛料の匂いが鼻をつきました。

技術的な実装詳細

スラッシュコマンド

Claude Codeでは、カスタムスラッシュコマンドを定義できます。このブログでは /post コマンドを用意しています。

# .claude/commands/post.md

/post 写真URLや記事の内容に関する情報

このコマンドはdocs/ARTICLE_WORKFLOW.mdの4ステップワークフローに
従って記事作成を実行します。

/post https://photos.app.goo.gl/xxx 旅行記事 と入力するだけで、ワークフロー全体が起動します。

CLAUDE.mdによるコンテキスト共有

リポジトリのルートにある CLAUDE.md ファイルで、プロジェクト固有のルールをAIに伝えています。

# CLAUDE.md の主要な内容

- 記事作成ワークフローへの参照
- Python仮想環境の設定
- 7カテゴリの定義
- 日本語でのレスポンス指示

このファイルがあることで、Claude Codeは毎回コンテキストを把握した状態で作業を開始できます。

画像処理の自動化

Google Photosからの画像取得は、Playwrightを使ったスクレイピングで実現しています。

# google_photos_extractor_playwright.py の概要

1. ヘッドレスChromiumでGoogle Photos共有ページにアクセス
2. 自動スクロールで全画像を読み込み
3. 背景画像URLを正規表現で抽出
4. URLリストをファイルに保存

Selenium版からPlaywright版への移行で、処理時間が2分40秒から25秒に短縮されました。

EXIF情報の活用

ダウンロードした画像からEXIF情報を抽出し、撮影日時を取得しています。
これにより、記事の日付を自動決定できます。

# exiftoolによるEXIF情報取得
exiftool -DateTimeOriginal image.jpg

複数画像がある場合は、最も早い撮影日時を記事日付として推奨します。

ディレクトリ構成

blog/
├── .claude/
│   └── commands/
│       └── post.md          # スラッシュコマンド定義
├── docs/
│   ├── ARTICLE_WORKFLOW.md  # 記事作成ワークフロー
│   └── CATEGORY_GUIDE.md    # カテゴリ管理ガイド
├── posts/                    # 記事Markdownファイル
├── scripts/
│   ├── google_photos_extractor_playwright.py
│   ├── download_images_for_review.py
│   ├── build.py
│   └── deploy.py
├── templates/                # Jinja2テンプレート
├── CLAUDE.md                 # AIへの指示書
└── requirements.txt

まとめ

このシステムで実現していることをまとめます。

  • Google Photos URLを渡すだけで記事作成が開始される
  • 画像のEXIF情報から記事日付を自動決定
  • 文体ガイドにより、等身大の語りを維持
  • 体験ヒアリングで、AIだけでは把握できない情報を補完
  • 4ステップのワークフローで品質を担保

AIと人間の協働という観点では、AIが得意な「大量の情報処理」と「ルールに従った文章生成」を担当し、人間が「体験の共有」と「最終判断」を担当する形になっています。

このシステムを参考にしたい方は、GitHubリポジトリの docs/ARTICLE_WORKFLOW.md と .claude/commands/post.md を参照してください。