Timeline

51個の p5.js/GLSL スケッチを埋め込みテンプレ文字列から本物のファイル(lib/sketches/*.{js,frag})へ外出しし、scripts/gen-sketches.mjs で sketches.generated.ts に束ねる codegen 方式に。lib/algorithms.ts は 991→160行。

• ✓全51件の build 出力がベースラインとバイト一致（diff 0）
• ✓build/型チェック green
• ✓/algorithms 全デモ描画を確認

Claude による検証

別管理だった DESC_JA（51キーの別マップ）を Algorithm.descJa として各エントリに取り込み、キー整合の保証と二重管理を解消。

• ✓build/型チェック green
• ✓/algorithms の ? 日本語説明表示を確認

Claude による検証

ほぼ同一だった2つの prefill useEffect を共通 applyArt(a, fork) に統合。挙動不変。

• ✓build green
• ✓/new?fork=<id> でコード・タイトル引き継ぎを確認

Claude による検証

巨大な作品詳細を lib/highlight.ts・WorkPreview・WorkPanel に分割。コードは原文保持で移設し挙動不変。

• ✓build green
• ✓/work 詳細の描画・コードビュー・Fork を確認

Claude による検証

importer 0 の lib/place.ts・lib/mood.ts・lib/contrast.ts と、set されるが read されない NewClient の arts 状態を削除（161行減）。

• ✓build green
• ✓/new 正常を確認

Claude による検証

色彩生成を lib/buildPalette に集約し、埋め込みウィジェット /embed/palette（postMessage 通知）と headless JSON API /api/v1/palette（CORS）として外部提供。

• ✓API が CORS 付きで配色を返す
• ✓embed が chrome なしで描画し postMessage 送出
• ✓build green

Claude による検証

JA/EN トグルを Timeline の右隣へ移動。/new の Insert PALETTE ボタンを白地・黒文字・右端寄せに。詳細→編集→戻り後に閉じる(back)が効かない履歴重複バグを replace→back 統一で修正。

• ✓npm run build: グリーン
• ✓Nav に JA/EN を1つだけ描画
• ✓Insert PALETTE: 白地黒文字・右端
• ✓閉じる: 履歴重複の解消

Claude による検証

/new が ?fork=<id> を未処理で空エディタが開いていた。元作品のコード・タイプ・背景・Fit・タグ・Manifest を引き継ぐよう修正（editId を設定せず新規作成）。

• ✓npm run build: グリーン
• ✓fork でコード690字＋プレビュー描画を確認
• ✓title=Fork of <元>

Claude による検証

ハイライト pre（break-all）と透明 textarea（単語折り返し）の折り返しモード不一致で、行が折り返るとカーソル/編集位置がずれていた。textarea を pre と同じ折り返しに統一。

• ✓npm run build: グリーン
• ✓scrollHeight 485==485・word-break/white-space 一致

Claude による検証

arts.origin_algo を追加し /new 保存時に tmpl 由来を記録。GET /api/v1/algorithms/forks で公開作品をアルゴリズム別に集約。/algorithms カードに「N フォーク」バッジ＋派生作品サムネ。

• ✓npm run build: グリーン
• ✓/api/v1/algorithms/forks 登録
• ✓フォークバッジ描画を確認

Claude による検証

保存パレットを Neon Postgres に永続化（palettes テーブル / /api/v1/palettes GET·POST·DELETE）。ログイン中は DB、未ログインは端末ローカル。art/work モーダルを portal+scroll-lock 化しスクロール後のずれを解消。

• ✓npm run build: グリーン
• ✓/api/v1/palettes: 401→ローカルfallback
• ✓モーダル top:0 で全画面被覆

Claude による検証

localStorage キーが全ユーザー共通で他人の保存配色が見えていた。uid で名前空間化（ログイン中 palette.saved.<uid>、未ログイン palette.saved.anon）。

• ✓npm run build: グリーン
• ✓別ユーザーの配色が見えないことを確認

Claude による検証

作品詳細に Fork 系譜図を追加。data/forks.json と forkAncestors/forkChildren を使い root→…→親→本作→子 を実サムネ付きで辿れる。ArtDetailLayout に genealogy スロット。

• ✓npm run build: グリーン
• ✓/art/<id>: 親→本作→子 の描画を確認

Claude による検証

未実装32種にパレット駆動デモを追加し全51件が /algorithms でライブ再生・Fork 可能に。GAN は潜在空間補間の近似、audio-reactive は擬似スペクトル、3d-mesh は擬似3D投影で表現。

• ✓npm run build: グリーン
• ✓全51件の実描画を確認
• ✓space-colonization の成長を調整

Claude による検証

モーダルを document.body へ portal し fixed をビューポート基準に（#cvd-root の filter による containing block 化を回避）。スクロール後の白画面/上ずれを解消。ヘッダー右の gap を上下余白に合わせる。

• ✓npm run build: グリーン
• ✓スクロール後も top:0 で全画面被覆

Claude による検証

/algorithms カードを作品名のみに（年号も削除）。Nav の高さを h-14/md:h-16 → h-12/md:h-14 に。

• ✓npm run build: グリーン

Claude による検証

モーダルを position:fixed 方式のスクロールロックに。ツールバーの Run/Reload をアイコン化し Auto を Run の隣へ、Reload を追加。/algorithms カードから作品数を削除。

• ✓npm run build: グリーン
• ✓Run/Auto/Reload の順序を確認

Claude による検証

/new インターセプトを背景スクロールロック付き不透明全画面に（編集画面のずれ解消）。アルゴリズム説明 DESC_JA を追加し JA/EN 切り替え対応。

• ✓npm run build: グリーン
• ✓JA/EN で説明が切替わることを確認

Claude による検証

/algorithms 各カード右上の ? で定義（名前・年/作品数/カテゴリ・説明文）をオーバーレイ表示。× で閉じる。

• ✓npm run build: グリーン
• ✓? で説明表示を確認

Claude による検証

Fork→/new が blur 付きモーダルで開き背景が透けてぼやけていた。直接アクセスと同じ不透明全画面で開くよう変更。

• ✓npm run build: グリーン
• ✓ブラーなし全画面を確認

Claude による検証

Fork→/new が未ログインだと editor が出ず「何も出てこない」状態だった。editor/プレビューを全員に開放し、保存時のみ /login へ誘導（読み・試しは開く、書きは骨を通す）。

• ✓npm run build: グリーン
• ✓未ログインで Truchet プレビュー描画を確認

Claude による検証

/algorithms の配色セレクタを左端の My Palette ドロップダウンに。右端にアルゴリズム数を表示。

• ✓npm run build: グリーン
• ✓ドロップダウン・件数表示を確認

Claude による検証

見出しを「Algorithms (51)」→「Algorithms」に変更。

• ✓テキスト変更のみ

Claude による検証

配色セレクタの「配色」ラベルを削除し、スウォッチをセンター配置に。

• ✓npm run build: グリーン

Claude による検証

カードフッターの頭文字アバターを削除し Fork ボタンを追加（作品詳細と同じダーク角形）。配色セレクタの角丸を削除・センター寄せ。

• ✓npm run build: グリーン
• ✓Fork 19・アバター0 を確認

Claude による検証

Palette で保存した配色から選べる配色セレクタを追加。選んだ配色で全デモを再描画し「この配色でつくる」にも反映。

• ✓npm run build: グリーン
• ✓青系への切替を確認

Claude による検証

カテゴリ/ソート行を削除。カードを PublishedCard と同じ正方形フォーマットに統一し、再生ボタンを廃止してデモを自動再生（loading=lazy）。

• ✓npm run build: グリーン
• ✓Circle Packing 自動再生を確認

Claude による検証

生成技法辞書（lib/algorithms.ts）と /algorithms ページを新設。カテゴリ絞り込み・年/作品数ソート・ライブデモ・「この配色でつくる」で /new へ。Nav に Algorithms を追加。

• ✓npm run build: グリーン（/algorithms 静的生成）
• ✓Circle Packing デモ描画を確認

Claude による検証

/api/agent POST エンドポイントを新設。GitHub から直近マージ済み PR を取得し、Claude Haiku が diff を読んで要約・checks・verdict を生成して oplog.json に追記コミット。vercel.json の cron で毎日 03:00 UTC に自動実行。

• ✓npm run build: グリーン
• ✓/api/agent: 401（AGENT_SECRET 未設定時）
• ✓@anthropic-ai/sdk インストール確認
• ✓vercel.json cron 構文確認

Claude による検証

Trending タブの選択状態を角丸グレー背景から下線 + bold に変更。タブ下余白を mb-4 から mb-8 に拡大し、グリッドとの間隔を確保。

• ✓npm run build: グリーン
• ✓/: タブ下線描画確認

Claude による検証

timeline・palette・vision・guide など 12 ページに force-static を追加してビルド時 HTML 生成に変更。timeline/palette/vision/guide に skeleton loading.tsx を追加し遷移中の白画面を解消。

• ✓npm run build: 12ページが ○ (Static) に変化
• ✓loading.tsx: アニメーション skeleton 表示確認

Claude による検証

page.tsx を Server Component のままに保ちつつ TimelineClient.tsx を新設し、useLang() で全テキストを JA/EN 切り替え対応。日英併記を解消。

• ✓npm run build: グリーン
• ✓/timeline: JA・EN 両モードで正常描画

Claude による検証

作品詳細の分割ハンドルをパネル高さ全体に拡大し、中央にグリップドットを配置。クリックで折りたたみ、ドラッグでリサイズ。@modal/(.)new のインターセプトルートも追加。

• ✓npm run build: グリーン
• ✓/work/<id>: ハンドルドラッグ・クリック動作確認
• ✓@modal ポップアップ: /new インターセプト確認

Claude による検証

Nav の Vision・How to use・Palette・Timeline 等のラベルを t() による切り替えから英語ハードコードに変更。JA/EN トグルはページコンテンツのみに適用範囲を限定。

• ✓npm run build: グリーン
• ✓JA/EN 切替時も Nav は英語固定であることを確認

Claude による検証

コードエディタ背景を #0f1117（ダーク）に変更。ツールバーを #161821 のダークバーに刷新し、Share URL・Manifest・Palette の各ボタンに SVG アイコンとラベルを追加。アクティブ時に色が変化。

• ✓npm run build: グリーン
• ✓/new: エディタダークテーマ・ツールバーアイコン描画確認

Claude による検証

Guide・Timeline・Login・Claude characters の各ページ本文を日本語＋英語サブテキストの併記形式に変更。ナビゲーションとボタン類は変更なし。

• ✓npm run build: グリーン
• ✓/guide・/timeline・/login: 日英並記描画確認

Claude による検証

PR #38 で行った guide・new・login・timeline・作品詳細の i18n をすべて元に戻し、オリジナルのテキスト状態に復元。

• ✓npm run build: グリーン
• ✓各ページが #38 適用前の状態に戻っていることを確認

Claude による検証

guide・new（NewClient）・login・timeline・作品詳細（WorkDetailLayout）の全テキストを useLang() の t() でラップし、JA/EN 切り替えに対応。

• ✓npm run build: グリーン
• ✓JA→EN 切替で各ページのラベルが英語に変化することを確認

Claude による検証

色相理論（Analogous/Complementary/Triadic）で調和パレットを生成。ベース色ピッカー＋ランダム、色数スライダー、コピー/エクスポート、『この配色で新規作成』で /new にプリフィル。

• ✓npm run build: グリーン（/palette 静的生成）
• ✓/palette: 200
• ✓/new?palette=...: 200

Claude による検証

Claude キャラを少し横長の Space Invader 風ロボット（11x8・Claude コーラル）に刷新。脚の行進アニメ・アンテナ LED、感情で目/口/LED が変化。

• ✓npm run build: グリーン
• ✓/timeline: 200

Claude による検証

input_ids が DB 未保存で編集時に紐づけが失われていた。arts.input_ids カラムを追加し POST/PATCH で保存・GET で返却。/new は保存・編集復元、プレビューも保存済み紐づけで描画。

• ✓npm run build: グリーン
• ✓公開 API に input_ids を確認
• ✓/work/<id>・/new?edit=<id>: 200

Claude による検証

loading スケルトンを現行の pen カードグリッドに合わせて作り直し。作品詳細の編集ボタンをタイトル横からフッターの全幅ボタンへ移動。

• ✓npm run build: グリーン
• ✓/work/<id>: 200

Claude による検証

JA/EN トグルを実装（Create の左、localStorage 永続）。PageHeading 共通コンポーネントを /mine・/new・/timeline に適用。/mine 見出しを「My Works」に統一し「+ 新規作成」ボタンを削除。

• ✓npm run build: グリーン
• ✓/ /mine /new /timeline: すべて 200
• ✓/mine に「My Works」・Nav に JA/EN トグル描画

Claude による検証

Claude キャラを 8x8 ピクセル・Claude カラーのロボットに。アンテナ先端の LED 色で感情を表現（緑=満足/琥珀=作業中/赤=要対応…）。

• ✓npm run build: グリーン
• ✓/timeline: 200・ロボット描画

Claude による検証

Timeline の管理エージェント Claude をピクセルキャラ化。PR の状態（オープン/マージ）から感情（proud/working/calm…）を導出し表情で表現。この記録自体も Claude が見守る対象になる。

• ✓npm run build: グリーン
• ✓/timeline: 200・キャラクター描画

Claude による検証

丸ひとつだった Stream を、咲き広がる花弁＋位相リングに刷新。入力作品の位相へ自分が寄る＝同期が視認できる。/new の重複 previewDoc を buildPreviewDoc に統合。

• ✓npm run build: グリーン
• ✓/new: 200
• ✓描画は try/catch ガード内・標準 Canvas API のみ

Claude による検証

「営みの記録」を独立セクションから外し、コミット履歴と同じ日付レールに時系列で混在。Stream 入力候補を resource_type === STREAM に限定。

• ✓npm run build: グリーン
• ✓/timeline: 200・検証カードとコミットが時系列混在で描画

Claude による検証

Stream 見本を位相同期（Inflorescence）に刷新。/mine ページ新設（カードUI）、/new から一覧撤去。Timeline に PR 検証ログを追加。

• ✓npm run build: グリーン
• ✓/mine: 200・「マイ作品」描画
• ✓/new: 200
• ✓/timeline: 200・検証ログ描画

Claude による検証

/api/v1/arts/[id] に GET/PATCH/DELETE を追加。/new?edit=<id> で編集・削除、作品詳細に本人のみ「編集」ボタン。

• ✓npm run build: グリーン
• ✓/new?edit=<id>: 200
• ✓GET /api/v1/arts/<id>（公開）: 200
• ✓PATCH（未ログイン）: 401（認可ガード）
• ✓DELETE（未ログイン）: 401（認可ガード）

Claude による検証

マイ作品一覧を /work/[id] へリンク。getWork(id, viewerUid) で本人は非公開作品も表示。

• ✓npm run build: グリーン
• ✓/work/<公開作品>（未ログイン）: 200・詳細描画
• ✓/work/<存在しない UUID>: 404 ページ描画（回帰なし）

Claude による検証

トップを公開作品グリッドに。/work/[id] 詳細＋@modal ポップアップ＋下部アクションバー。Nav を How to use ドロップダウンに。Stream 入力作品をドロップダウン選択。

• ✓npm run build: グリーン
• ✓GET /api/v1/arts/public: 200・公開作品返却
• ✓/（トップ）: 200・グリッド描画
• ✓/work/<uuid>（実在）: 200・詳細描画
• ✓/work/<存在しない>: notFound() → 404 ページ
• ✓/new: 200

Claude による検証