本文へ移動
cccskills
無料GitHub で公開

run-dev-graph-render

dev-graph を静的 HTML に可視化したいとき、外部 CDN/npm なしの自己完結 SVG + inline JS 成果物を生成したいときに使う。

インストール方法を見る

含まれるファイル(4)

  • SKILL.md9.6 KB
  • prompts/R1-elicit.md2.4 KB
  • prompts/R2-plan.md2.4 KB
  • prompts/R3-render.md2.8 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

Pre-choice usable artifact execution

Purpose & Output Contractの最小の実成果物をmain contextで作成する。effect別のparse/open・secret・irreversible・corrupt guardだけを実行し、現物path・digest・開き方を提示してからaccept-as-is/light/standard/detailedを記録する。accept-as-isはその場でhandoff完了とし、後続sectionを実行しない。

Post-choice selected improvement execution

以下の既存workflow・goal-seek・評価・修正sectionはlight/standard/detailedが記録されてsemantic_evaluator_startedへ遷移した場合だけ実行する。release/exhaustiveは別の明示eventを必要とする。

run-dev-graph-render

Purpose & Output Contract

  • 入力: C24/C11 検証済み graph/scope、repo 内 output path。
  • 出力: SVG/CSS/JS を inline 化した単一 HTML と node/edge/feature-progress counts、input/output digest を持つ renderer receipt。
  • 完了条件: 外部 runtime 参照0、ブラウザ上で SVG と feature X/Y が表示され、receipt の counts/digests が実体に一致する。
  1. C24/C11 で caller graph と scope を検証する。
  2. 出力は repo 内の指定 path(既定 .dev-graph/render/index.html)に限定する。
  3. render-graph-html.py を呼び、SVG、CSS、JS を単一 HTML に inline 化する。外部 script/link, CDN, npm dependency は禁止。
  4. feature node は parent_feature の task を X/Y で集約し、feature 間 edge と task 内 edge を混同せず表示する。
  5. renderer receipt の node/edge/progress counts と input digest を照合して返す。

graph は read-only。HTML 以外の graph/content を変更しない。

ゴールシーク実行

ゴール (Goal)

タスクグラフ情報から追加ランタイム依存なしでブラウザ表示可能な SVG + インライン JS 可視化済み静的 HTML/CSS が生成された状態になっている

目的・背景 (Why)

グラフ情報を人間が俯瞰するにはゼロ依存の静的可視化が必要で、コミットまたは CI 生成可能な成果物にすることで導入先リポジトリ内で完結させるため。feature ノードは配下task (parent_feature参照) の完了進捗 (X/Y) を集約表示し、機能単位のオーケストレーション状況を俯瞰できるようにする (§8.5・epic投影を持たないlocal_only profileでも実行状況を可視化)

完了チェックリスト

  • input graph/scope が schema PASS で output realpath が caller repo 内にある
  • render model の node/edge/feature progress counts が input graph と一致する
  • 生成 HTML の外部 script/link/CDN/npm reference が0件で SVG と inline JS が実在する
  • renderer receipt の input/output digest と実ファイル digest が一致する
  • ブラウザ live trial で追加 runtime なしに SVG と feature X/Y progress が表示される

ゴールシークループ

frontmatter の goal_seek.engine: inline / fork: subagent / max_loops: 5 を実行契約とする。固定手順は使わず、未達 checklist と担当 prompts/*.md からその周回の操作を都度生成する。各周回で inner criterion を検証し、完了後は outer criterion の live trial/content review を最大 feedback_contract.max_iterations=3 周で評価する。

ゴールシーク配線

  • 開始時に C24 resolve-repo-context.py --mode read の JSON receipt を得て、repo_root が content_roots.repository の realpath と一致する場合だけ DEV_GRAPH_ROOT=<receipt.repo_root> に固定する。cwd から再解決しない。
  • 元のゴールを $DEV_GRAPH_ROOT/eval-log/run-dev-graph-render-goal-spec.json へ、各 checklist の status/evidence を $DEV_GRAPH_ROOT/eval-log/run-dev-graph-render-progress.json へ記録する。
  • 未達 responsibility を担当する prompts/<R-id>.md を読み、Agent で分離 context に fork する。ユーザー判断が必要な境界だけ AskUserQuestion を使う。
  • 各周回末に $DEV_GRAPH_ROOT/eval-log/run-dev-graph-render-intermediate.jsonl へ original_goal、original_goal_hash、current_goal_snapshot、delta_from_original、merged_directive_for_next、drift_signal を append-only で記録する。次周回は直前の merged_directive_for_next を必須入力にする。
  • 5周到達時に未達が残れば完了扱いせず、progress と blocker を親へ handoff する。全 checklist と feedback_contract.criteria が PASS のときだけ完了する。

ゴールシーク検証

各周回後に次の検査を実行し、中間成果物の欠落・goal drift・hash 不一致を fail-closed にする。

python3 - "$DEV_GRAPH_ROOT/eval-log/run-dev-graph-render-goal-spec.json" "$DEV_GRAPH_ROOT/eval-log/run-dev-graph-render-intermediate.jsonl" <<'PY'
import hashlib, json, sys
goal = json.load(open(sys.argv[1], encoding='utf-8'))
rows = [json.loads(line) for line in open(sys.argv[2], encoding='utf-8') if line.strip()]
required_keys = {'original_goal','original_goal_hash','current_goal_snapshot','delta_from_original','merged_directive_for_next','drift_signal'}
expected = hashlib.sha256(goal['original_goal'].encode('utf-8')).hexdigest()
assert rows, 'intermediate.jsonl is empty'
for row in rows:
    assert required_keys <= row.keys(), required_keys - row.keys()
    assert row['original_goal'] == goal['original_goal']
    assert row['original_goal_hash'] == expected
PY

Criteria acceptance

  • criteria:IN1: output HTMLの外部script/link参照が0件でゼロ依存である。
  • criteria:OUT1: 生成HTML/CSSをブラウザで開き、追加ランタイム依存なくSVGグラフとfeatureごとの子task進捗X/Yが表示され、registration receiptのapplied_count/expected_countとsource_digestが表示内容に一致する。

Gotchas

  • CDN、npm bundle、外部 script/link を単一 HTML に混入させない。
  • feature progress は parent_feature の task 実数から導出し、手入力値を表示しない。
  • browser 表示だけで PASS にせず、receipt count と input/output digest も照合する。
  • render は read-only graph から生成し、graph/content 本体を変更しない。

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

app-excellence

無料日本語概要

アプリ・Webサービス・業務ツールの制作を、証拠分析→確定的な初稿→要件定義→体験設計→機能分解→実装→品質ゲート→リリース判定の手順ゲート制で進めるスキル。質問で要件を埋めるのではなく、依頼文・既存コード・資料・ログから最有力案を選び、動く成果物を先に出して差分で改善する。ユーザーが「アプリを作りたい」「ツールを作って」「〜を自動化したい」「システム化したい」「要件定義」「仕様を決めたい」「UI/UXを設計して」「体験を良くしたい」「機能を洗い出して」「MVPを決めたい」「品質チェック」「リリースしていいか判断して」などと言ったら必ず使用する。外部データの取込・マスタ・締め処理を伴う業務システムでは references/data-lifecycle.md も併用する。新規・既存を問わずアプリの制作・改善・リニューアルで使用する。

daishiman/harness-dev102026年10月10日 更新

app-orchestrator

無料日本語概要

Webアプリの準備→要件定義→設計→実装→公開→品質ゲートを実行する内部オーケストレーター。Claude Codeの /build-app /improve-app、Codexの $build-app / $improve-app から明示的に委譲された場合、custom agent起動時、または利用者が $app-orchestrator を明示した場合だけ使用する。一般のアプリ相談から暗黙起動しない。

daishiman/harness-dev102026年10月10日 更新

run-extract-blueprint が生成した章別ブループリントの忠実性を独立 context で評価したいとき、事実/推測区別と粒度と被覆を検証し draft_hash に束縛した PASS/FAIL verdict をローカル品質ゲート (C01 の周回内の受入判定・差し戻し) へ渡したいときに使う。

daishiman/harness-dev102026年10月10日 更新

assign-briefing-evaluator

無料日本語概要

確認点で利用者が見る深さを選んだあと打ち合わせ資料を作り手とは別の目で確かめたいとき、正確さ・言葉・見た目・シンプルさの指摘を資料の編集なしで受け取りたいときに使う。

daishiman/harness-dev102026年10月10日 更新

生成した handout 資料が初心者に伝わるか読みやすさレビューを依頼したいとき、独立 context のレビュアーから指摘と根拠つきの verdict を回収したいときに使う。

daishiman/harness-dev102026年10月10日 更新

Notion ページを描画する直前に粒度を検証したいとき、info-collector-agent ページと同等の section 充足度を section_canonical_map 基準で機械検証したいときに使う。

daishiman/harness-dev102026年10月10日 更新

daishiman のスキルをすべて見る

このスキルの問題を報告する