仕様通り動くの先へ。Claude Codeで「使える」を検証する

Claude Code Meetup Japan #4での発表資料。「仕様通りに動く」と「ユーザーが使える」の間にあるギャップを、Claude Code の自律ハーネスと uxaudit で埋める方法を紹介する。cc-sdd v3.0による長時間自律実装、Planner / Builder / Evaluator / UX Reviewer のシンプルなハーネス設計、Credo (5 原則) の Skill 注入、Computer Use による画面操作評価、uxaudit のジャーニー自動評価と iteration 比較 dashboardまで、実装から検証の一気通貫をカバーしている。実プロジェクトの dashboard、スクショを交えた実務者向けの内容。Claude Code でプロダクト開発を回している人、UX評価の自動化に関心がある人向け。

UXAudit(https://github.com/gotalab/uxaudit)

Transcript

1. 仕様通り動くの先へ。Claude Codeで「使える」を検証する Claude Code Meetup gota / 2026.04.10
2. gota @gota_bara / GitHub: @gotalab 仕事 AI エージェント開発 / データプロダクト 作ってる cc-sdd (3,000+ ⭐) / skillport 好きなこと 散歩 / キャンプ / 葬送のフリーレン 最近の悩み 昼夜逆転（気づいたら朝 8 時）/ 睡眠不足 自己紹介 2
3. spec を適切に切って承認したら、あとは長時間自律で実装する 境界を first class に /kiro-discovery で spec 間の 境界と依存を定義。チーム間 の分業が自然にできる Skills として配布 Claude Code / Codex / Cursor / GitHub Copilot 含む 全 8 エージェント対応 長時間の自律実装 /kiro-impl で hooks なしに自 律で回り続ける まず宣伝: cc-sdd v3.0 本日アップデート 3
4. タスクごとに TDD、独立レビュー、詰まったら auto-debug ループの中身 1 タスクごとに fresh な implementer TDD (RED → GREEN) 独立 reviewer が別コンテキストでレビ ュー reviewer が 2 回 reject したら auto- debug で原因調査 学習は tasks.md の Implementation Notes で次タスクに伝搬 運用上のうれしさ タスクごとにコミットされる 途中で止まっても安全に再開 hooks なしで自律で回り続ける コンテキストが膨れない /kiro-impl で長時間の自律実装 hooks なしで自律：タスクの状態遷移を工夫することで実現。シンプルで誰でも変更できる構造を優先 4
5. モデルの進化とともに少しずつ解けつつある問題 揃えるもの 実行可能な粒度まで落とした plan 明確なアーキテクチャと境界設計 実行可能な制約 (CLAUDE.md / hooks / subagents) 検証環境 (lint / test / E2E) 使える道具 Plan Mode (Explore first, then plan, then code) UltraPlan plugins: Superpowers / Compound Engineering / feature-dev (Anthropic 公式) 仕様通り作れる時代 Explore first, then plan, then code: Anthropic, Claude Code Best Practices 5
6. 仕事をしながらでも、2 週間くらいでこれくらい作れる Local Notion clone + CLI ローカルで動く Notion 風エディタと操作 CLI symphony clone OpenAI の symphony orchestrator の clone イベント駆動開発ハーネス 各種コーディングエージェントの CLI をタス クに応じて割り当てるオーケストレーション multi-agent orchestrator OpenClaw 的なエージェントの遊び場 imgx / Linear CLI 画像処理・PDF 分割 / Linear 操作の CLI ツー ル色々 推し活アプリ 完全趣味、でも動く 最近遊びで作ったもの 6
7. 動く テストが通る 仕様を満たす デモできる CI が green 使える 触って目的が達成できる コアの体験がはっきりしている 次の行動が選べる 初見で始められる 動くと使えるは別の話 7
8. Anthropic 社内でも出荷物の 7 割以上は PRD なし ドキュメントを積むより、先にプロト タイプを触って次を判断する 2 週間以内のプロジェクトは PM を置 かない（エンジニアが PM 兼任） 火消しで仕様書を書く暇がなく、書 いている間にモデル進化で前提がズ レる 使えるかは触るまで分からない Amol Avasare (Head of Growth, Anthropic) / Lenny's Podcast, 2026-04-05 8
9. Claude Code でそのまま作ると、手戻りの多い「動くもの」ができる ① 伝わらない 操作は通るが、成功したフィードバックが ない ② ぼやける 16 機能あるが、コアの体験がぼやける ③ 見つからない ボタンは DOM にあるが、画面で見つけられ ない ④ 始まらない フォーム送信はできるが、初見で始められ ない 「動くけど使えない」の 4 例 9
10. 速度 × 品質 × 量、人手ではどれか必ず落ちる 前提は毎週変わる。仕様を書ききる前にモデルが進化する → 速度が命 動くだけでは判断できない。質が低いと選べない → 品質も落とせない 1 個に人手を挟むと、量も速度も止まる → 人手を極限まで減らして、使えるものを速く出す仕組みが要る ほぼ自律で使えるプロトタイプを速く回す 10
11. ⾳声で話す → ⾃律実⾏ 1〜3 時間 → 使えるプロトタイプが出る Planner Opus / Read + WebSearch WHAT だけ書く HOW は Builder に任せる Builder Opus / 全ツール Vertical Slice 先⾏ 環境 NG で強制 STOP Evaluator Opus / Playwright MCP 機能検証 / 4 軸スコア 各軸 7/10 で pass UX Reviewer Opus / Computer Use 体験検証 / 3 軸スコア 各軸 7/10 で pass スコア < 7 なら再ビルド 使えない → Builder に戻す Claude Code の Stop hook / SubagentStop hook でタスクが終わるまで⾃律実⾏ そのための自律ハーネス 設計思想は Anthropic Engineering: Harness design for long-running apps と近い 11 Planner は WHAT だけ、Builder がイテレーションで HOW を発見
12. Claude Code の skill で全 subagent が同じ 5 原則を参照する 1. Core First, Polish Later: 洗練された 1 フローは、浅い 10 機能に勝つ 2. Wire Before You Decorate: 部品は動くが繋ぐと壊れるの典型失敗を潰す 3. No Dead Code: 作ったなら動くこと。壊れた機能は嘘 4. The Spec Is Law: AI は統計的平均に収束する。魂は意図的な制約に宿る 5. Built to Grow: 退屈で読めるコードが、美しく不透明な抽象に勝つ こだわり① Credo を Skill として全 subagent に注入 12
13. シナリオは先に全部切る、観測環境を整えて縦に一本通す Planner が検証シナリオを先切り 正常系 + 異常系 + エッジを全部 Core / Stretch 分類 手順ではなく ゴール形式で書く Evaluator と UX Reviewer が同じシナリ オを独立に走らせる 「少ない = バグ見逃し」と明示 Builder は観測環境を整えて縦に通す lint / type / dev server / logs を最初に繋 ぐ。詰まれば強制 STOP 観測できる状態でコアフローを縦に一本 通す 通らなければ前提がおかしい。戻って 探索 横に広げ → 深掘り、phase ごと smoke test こだわり② 手戻りを先に潰す 13
14. Claude Code でも Computer Use が普通に呼べる。 触って確かめる仕組みに組み込める DOM を直接叩けば動作検証はできる でも「画面から見つけられるか」 「次の行動を選べるか」は DOM では検出できない Computer Use はスクショ + マウス / キーボードで操作する Claude Code の subagent / tool から呼べるので、自律ハーネスの UX Reviewer にそのま ま組み込める こだわり③ Claude Code から Computer Use で触らせる Anthropic, Computer Use 14
15. 遅い: 並列負荷ではない スクショ取得 → 座標特定 → 操作の直列ループ。認識待ちが毎回入る シナリオが並列化できない Computer Use セッションは 1 本ずつ。シナリオ数ぶん合計時間が伸びる 評価用途と自律性が合わない 直列 × 長時間 × シナリオ数 = 気軽に回せない。結局手動で回す羽目に それでも UX Reviewer は回りきらない 15 Computer Use ベースの UX Reviewer が回りきらない理由
16. ユーザージャーニーを 自動で測定できるようにする Claude Code Plugin uxaudit
17. 全体の概要と、優先度付きの改善提案がまとまる Dashboard 全景 優先度付きの提案 uxaudit を走らせるとこんな dashboard が出る 17
18. 共通ルールと プロジェクト固有のジャーニー を自動評価する Claude Code Plugin /uxaudit:uxaudit my-app --lang ja 評価する対象は 2 種類 全アプリ共通の不備 (34 項目): a11y / AI slop / Nielsen 原則など、床を揃える そのプロジェクトのジャーニー: Scout がジャーニーを洗い出し、4 軸で判定 判定はスクショだけ見る（コードも spec も見ない） 初回で作った基準で、以降の iteration を regression として比較できる uxaudit でアプリを評価できる状態にする 18
19. 早いチェックから順に⾛らせて、原因でまとめて提案する アプリを理解する README / spec / 画⾯から、どんなジャーニーを評価すべきか洗い出す 早い → 重い の順でチェックを⾛らせる 静的スキャン CSS / HTML を regex で ミリ秒 ブラウザ計測 Playwright で a11y / DOM 秒 画像判定 1 枚のスクショを LLM で 数⼗秒 ジャーニー判定 連続スクショを 4 軸で 分 原因でまとめて、提案を束ねる 重複を潰し、優先度付きの提案を 2〜3 個 に絞る dashboard.html UX issues ／ UI risks ／ 優先度付き提案 uxaudit の仕組み 19
20. レイヤー 問い 代表ツール Unit 部品は仕様通りに動くか Jest / Vitest / pytest Property-based 不変条件はどんな⼊⼒でも成り⽴つか fast-check / Hypothesis Integration 組み合わせても壊れないか Jest / pytest E2E ユーザーフローは最後まで完⾛できるか Playwright / Cypress Visual / A11y checks ⾒た⽬や操作可能性に重⼤な破綻はないか Percy / Chromatic / axe / Playwright ↑ CI で検出できる領域   ↓ 触らないと分からない領域 UX Audit 理解し、判断し、達成し、回復できるか uxaudit Manual QA / dogfooding 総合的に違和感はないか humans 触って初めて分かる層を uxaudit で埋める 20 CI を green にできる領域の先に触らないと分からない層がある
21. 1 軸でも落ちたら ジャーニー全体を不合格 21 4 軸を evidence-only で判定、落ちた理由まで narrative で出る
22. iteration を並べて何が直ったかを一目で見る 22 同じ基準で何度でも測れる。iteration-1 から iteration-7 まで、diff が残る
23. チェックごとに iteration の推移が追える 23 どの iteration で直ったか / 壊れたかが判定理由ごとに追える
24. 1 動くは解けつつある モデルの進化 + Claude Code で仕様通りに作れる時代 2 使えるかの評価を自動化した ハーネス + uxaudit で人間の介入を最小限にしながら iteration を回す 3 使い続けるかは次の壁 実ユーザーのログとオブザーバビリティが要る まとめ 24 仮説生成から検証まで、 プロダクト開発全体のループを高速で回せるようにしたい
25. Thank You! cc-sdd github: gotalab/cc-sdd uxaudit github: gotalab/uxaudit X: @gota_bara