Daily FlipBook Generator

SkillMonitoring & ops

Automatically generates a reflection book (FlipBook) from today's Claude Code session logs and opens it

Available today. Use it from your connected AI after setup.

Connect ahel once, and every AI you use reads what you have installed.

Then ask your AI: use the Daily FlipBook Generator skill

What this skill tells your AI

The instructions your AI receives, as published by gonta223/cc-books in skill/SKILL.md and read by ahel’s review.

今日のClaude Codeセッションログを読み取り、1日の振り返りをページめくりできる「本」として生成するスキル。

トリガー

  • /daily-flipbook で起動
  • 「今日の振り返り本作って」「日記本生成して」等

処理フロー

Step 1: セッションログの収集

今日のClaude Codeセッションログを両方のパスから収集する:

# パス1: デフォルト
~/.claude/projects/

# パス2: CLAUDE_CONFIG_DIR指定
~/claude-data/projects/

必ず両方のパスを検索すること。片方だけで「見つからない」は禁止。

ログファイルはJSONL形式。以下のコマンドで今日のセッションを見つける:

# 今日更新されたJSONLファイルを検索
find ~/.claude/projects/ -name "*.jsonl" -newer /tmp/today_marker -not -path "*/subagents/*" 2>/dev/null
find ~/claude-data/projects/ -name "*.jsonl" -newer /tmp/today_marker -not -path "*/subagents/*" 2>/dev/null

日付マーカーの作成:

touch -t $(date +%Y%m%d)0000 /tmp/today_marker

Step 2: ログの解析

各JSONLファイルから以下を抽出:

  1. ユーザーのメッセージ (type: "user") → 何を依頼したか
  2. アシスタントの応答 (type: "assistant") → 何を実行したか
  3. ツール使用 (tool_use) → Write, Edit, Bash等の実行内容

これらを時系列で整理し、以下の構造にまとめる:

- セッション1: [プロジェクト名]
  - やったこと: [概要]
  - 成果物: [ファイル、コミット等]
  - 学び: [気づき、発見]

- セッション2: ...

Step 3: 本の構成を決定

収集した情報から本の構成を自動生成:

ページ内容
表紙日付 + タイトル(「YYYY年MM月DD日の記録」)
はじめに今日のサマリー(セッション数、主な成果)
各章セッションごとの詳細(やったこと、コード、学び)
最終ページ今日の振り返り + 明日へのアクション

構成ルール:

  • 1セッションにつき1見開き(2ページ)
  • 最大6章(12ページ)まで。それ以上は重要度で選別
  • コードブロック、引用、ティップスボックスを適宜使用

Step 4: FlipBook HTMLを生成

テンプレート(index.html)をベースに、pages 配列を差し替えたHTMLを生成する。

出力先: /tmp/claude/daily-flipbook/YYYY-MM-DD.html

使用可能なCSSクラス:

  • .page-title — 大見出し
  • .chapter-label — 章番号
  • .page-body — 本文
  • .code-block — コード(.comment, .keyword, .string, .property でハイライト)
  • .quote — 引用ブロック
  • .tip-box — ティップス(.tip-title + <ul>
  • .comparison — 2カラム比較(.col.good / .col.bad
  • .divider — 装飾区切り線
  • .dropcap — ドロップキャップ(<p class="dropcap">

Step 5: ブラウザで開く

open /tmp/claude/daily-flipbook/YYYY-MM-DD.html

出力例

表紙:

2026年4月5日の記録
── Today I Learned ──

章の例:

第一章: FlipBook UIを作った

「本のページめくるUI作れる?」から始まって、
CSS 3D transformsとWeb Audio APIで
ドラッグでめくれる本のUIを作った。

途中で「マウスで本当にめくれるように」と
要件が追加されて、ドラッグ操作の実装に。
mousedown → mousemove → mouseup で
角度を計算して、50度超えたら完了、
それ以下ならバネで戻す。

注意事項

  • セッションログが見つからない場合は「今日はまだセッションがありません」と伝える
  • 個人情報(APIキー、パスワード等)がログに含まれている場合は除外する
  • 生成したHTMLにも個人情報を含めない
  • ログの解析にはBashツール(jq)を使用する

Signals

GitHub stars
57
Forks
6
Last commit
Apr 2026
Advanced
Catalog kind
skill
Gateway key
daily-flipbook
Source
github.com/gonta223/cc-books