2026年5月14日の開発日記

朝はPart 2投資判断クイズの計画書探しから始まった。HTMLしか残っていなかった構想をマークダウンに起こし、Codexレビューを2巡させて指示書を固めた瞬間、ユーザーから「広瀬さんの本をオリジナルコンテンツに変換するつもりだった」という根本的なズレを指摘される。慌てて方針を本文ベースに切り替え、Turso DBから書籍を引いてパイロット試作 → 3並列で74問+SVG18枚を量産した。午後は仕上がった画面の余白に違和感を覚えたユーザーの一言から、basics準拠の2カラム化とコンポーネント化に着手。並行して都道府県クイズの拡張計画も起草し、書籍まるごとを横展開するロードマップを作った。使用制限が近づいたタイミングで進捗マークダウンを3本残して撤退。

今日のタイムライン

タイムライン

今日やったこと

1. 投資判断クイズ Part 2 を書籍から起こす（74問+SVG18枚）

朝、Part 2の計画書を探したらHTMLしか残っておらず、まずマークダウン化から始めた。派遣指示書 v1 を起草してCodexに2回レビューさせ、致命的指摘8件を全件反映してv1.2を完成。ところがユーザー確認で「広瀬さんの本をオリジナルコンテンツに変換するイメージだった」と判明し、論点抽出方針で書いていた指示書を本文ベースに転換。Turso DB（markethack-us-investing）からchunkを読み込み、chapter 1 sec-1でパイロット試作した上で、残り17secをサブエージェント3並列で一気に74問化した。Vue実装では3択→4択化のためChoice型を拡張し、QuizCardを「3択時のみ横並び・4択時は2x2グリッド」に条件分岐。Python スクリプトでquizRegistry.tsのエントリを自動生成して挿入し、型エラー9件を3系統に分けて解消。最後にSVG図解18枚を3並列で追加した。

主な成果:

Part 2派遣指示書 v1.2（Codexレビュー2巡反映済み）
クイズ18 sec / 74問（書籍本文ベースのオリジナルコンテンツ）
Vue 18ページ + TS 3ファイル + SVG図解18枚
quizRegistry.tsにレジストリエントリ自動挿入、型エラー9件解消

詳細: 投資判断クイズPart 2を書籍から起こした記録

2. 投資クイズを2カラムレイアウトに移行、コンポーネント化

午後、ユーザーが/financial-statements-quiz/investment/01-operating-cfを開いて「ここってなんでこんなにスペース空いてるんですかね」と疑問を投げてきた。原因は.practice-listのpadding: 50vh（矢印キーでの中央スクロール用）だったが、本当の要望は「basicsページの2カラムUX（左：図固定、右：クイズリスト独立スクロール）を投資クイズにも適用」だった。QuizPageコンポーネントで01-operating-cf.vueを書き換え、:has()セレクタでhighlight: nullの問題では左ペインを縮める仕掛けを入れた。「最後の問題を解いたら自動で次のトピックへ遷移」と「8-1〜8-18全部に適用するためコンポーネント化」の追加要求に応えてInvestmentTopicPage.vueを作成。横展開の途中で使用制限が近づいて打ち切り、進捗をマークダウンに残した。

主な成果:

01-operating-cf.vueを2カラム構造に書き換え
QuizPageに5秒後の自動次トピック遷移機能を追加
共通ラッパーInvestmentTopicPage.vueを作成、17ページに横展開着手
進捗マークダウンinvestment-quiz-2col-migration-progress.mdに残務記録

詳細: 投資クイズを2カラムレイアウトに移行した記録

3. 都道府県・主産地クイズの拡張計画を起草

昨日作った都道府県・主産地クイズの続きを進めたいとなったが、専用の計画書（plan.md）はmemo/にも.claude/plans/にもなかった。代わりに昨日の日記末尾の「明日やること」が事実上の続きTODOになっていた。元書籍はTurso DBに登録済みの『日本国勢図会 2024/25』（id: nihon-kokusei-zue-2024-25、矢野恒太記念会）。書籍構造をClaude Codeに直接調べさせると、付録II/III「府県別統計」がデータの宝庫だと分かった。既存クイズが果実・野菜・工芸農作物のみだったので、5フェーズで横展開する計画書をmemo/2026-05-14/prefecture-quiz-expansion-plan.mdに作成。目次ページが未実装だったため先に作る方向に組み替えてagriculture.vueのテーマカラー（マゼンタ #ed1e79）を踏襲する方針まで進めて打ち切り。

主な成果:

5フェーズの拡張計画書を起草（書籍40章+付録の構造を踏まえた横展開）
目次ページ実装の方針確定（agriculture.vue準拠のデザイン）
進捗を計画書末尾に追記して再開ポイントを残す

詳細: 都道府県クイズを書籍まるごと横展開する計画

4. Claude Codeの課金体系変更（claude -p の説明と6/15のsubscription分離）

並行してclaude -pコマンドの意味と、6/15からprogrammatic使用が定額枠から分離される件を整理した。subscription枠の5時間制限に複数セッションで引っかかっている現状と、SDK経由の使用が別予算になるとどう変わるかをユーザーと噛み砕いた。100%表示中にも会話できている枠の正体（5時間枠と週枠の組み合わせ）も確認。詳細記事には起こさず、雑談メモとして残す。

今日の試行錯誤

#	テーマ	試したこと	結果	気づき
1	Part 2計画書探し	memo/とdocs/を順番に検索 → 「sekaiichi」関連がヒット	失敗（別書籍の計画書）	音声認識で「ケッサンしょ」→「ケスさん」になっていた誤認を引きずって探していた
2	Part 2指示書 v1起草	Codexレビュー2巡（致命的8件反映）でv1.2に固める	一旦完成	完成と思った瞬間にユーザーから根本ズレを指摘されて全面修正
3	書籍本文ベース化	Turso DBから`markethack-us-investing`のchunkを読み込んでパイロット試作	成功	1 sec試作してから残り17 secを並列に流す、の順序が安定
4	74問の並列量産	サブエージェント3並列で17 secを分担	成功	型（パイロット）が決まる前に並列を走らせると後の統合コストが膨らむ
5	4択化対応	`Choice`型に'D'追加、`QuizCard`の3列固定を「3択時のみ」に条件付け	成功	配列要素ごとに`as QuizRegistryEntry`を当てると推論コストが軽くなる
6	型エラー9件	系統別に3パスで処理（Choice拡張影響→wrong-X拡張→"complex"残り）	成功	エラーを系統分けしてからまとめて処理すると速い
7	余白の原因特定	DevToolsで`.practice-list`を見ると`padding: 50vh`	成功	仕様（中央スクロール）を残したまま、UX要件は別レイヤーで満たす方が筋がいい
8	2カラム化	`QuizPage`コンポーネントで`01-operating-cf.vue`書き換え	成功	basicsで動いているUXをそのまま転用する方が、自分で作り直すより早い
9	`highlight: null`時の表示	プレースホルダー（薄い文字）+ `:has()`セレクタで左ペイン縮小	成功	「枠を出さず文字だけ」に振ると、PCでもタブレットでも違和感が減る
10	都道府県クイズの計画書探し	memo/と.claude/plans/を検索	計画書なし	昨日の日記末尾の「明日やること」がTODOになっていた
11	書籍の章節調査	Turso DBの`nihon-kokusei-zue-2024-25`を日本語で問い合わせ	成功	自分の本棚にAIで質問する感覚で、書籍構造の把握が10分で終わった

今日の学び

指示書は完成してからこそ確認が要る: Codexレビュー2巡を通したv1.2でも、ユーザーの根本意図とズレていれば全面修正になる。形式の精度より意図の照合が先
パイロット → 並列、の順序を崩さない: 型（パイロット）が決まる前に並列を走らせると、3エージェントが3方向に散らばって後で揃え直すコストが膨らむ
既存パターンの転用が最速: basicsで動いている2カラムUXを投資クイズに転用するのは、自分でレイアウトを起こすより早い
コンポーネント化のタイミングは1ページ完成後: いきなり共通化すると要件抜けが出る。1ページで動かしてから抽出
個人参考書庫のDB化が計画起草を加速する: 書籍構造を日本語で問い合わせるだけで、続き物の計画書の素材集めが10分で終わる
UX違和感は人間が拾う係: AIが書いたコードでも「ここってなんでスペース空いてるんですかね」の一言が出なければ、padding: 50vhは仕様として生き残っていた

明日やること

投資クイズ2カラム化を残り17ページに横展開（InvestmentTopicPageへの置き換え）
都道府県クイズの目次ページを実装（agriculture.vue準拠）
都道府県クイズ拡張Phase 1着手（畜産・水産あたり）