메뉴
アルゴリズムや仕組みを、単一 HTML のインタラクティブ／アニメーション付きページで説明する。文章だけでは腑に落ちないときの認知的負債の返済に使う。
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
compound engineering のステップ。ひとつの作業のあとに短く振り返り、学んだことを CLAUDE.md・スキル・hoard に畳み込む。意味のある作業の終わりごとに使う。
実機をシリアル越しに操作して挙動を確認する。tools/deck.py で JSON Lines を投げ、人間にしかできない確認は手順書にして渡す。ビルドが通ったあと、動いたと言い切る前に使う。
arduino-cli でファームをビルド／書き込みする。ボード設定、ライブラリのバージョン固定、書き込み時の注意をまとめてある。ファームを触ったあと、実機で確かめる前に使う。
git の混乱を収拾し、履歴を手術する。コミットの取り消し・書き換え、conflict の解消、reflog からの復旧、git bisect による退行の特定。
新しく分かった小技を、動く最小例として hoard/ に保存する。非自明なことを初めて解決したあとに使う。
自動テストの外側で実物を動かして確かめ、結果を notes/ に記録する。ホスト側は使い捨てプログラム、実機はシリアル、web はブラウザ自動化。テストが通ったあと、完了と言う前に使う。
| name | interactive-explanation |
| description | アルゴリズムや仕組みを、単一 HTML のインタラクティブ／アニメーション付きページで説明する。文章だけでは腑に落ちないときの認知的負債の返済に使う。 |
ウォークスルーを読んでもまだブラックボックスに感じる仕組みは、アニメーションする 単一 HTML ページにして理解する。
このプロジェクトなら例えば: HID レポートのビット構成、BLE の接続・切断の状態遷移、 マクロのステップ実行とタイミング、タッチ座標からボタンインデックスへの写像、 起動時のストレージのフォールバック。
walkthrough があればそこから始める。notes/explanations/ に自己完結した単一 HTML を置き、段階的にアニメーション
させる。中間状態と分岐（試した候補、比較、巻き戻し）を見せる。
最終結果だけでは腑に落ちない。#fragment に
持たせるとリンクを共有できる）。* { box-sizing: border-box; } から始める。<script type="module">、インデント 2 スペース。