---
title: "How we Claude Code"
source: https://www.youtube.com/watch?v=IlqJqcl8ONE
plattform: youtube
channel: claude
duration_seconds: 1903
thema: claude-code-workflows
nutzen: "Aria lernt Interview-Mode + HTML-Specs + DOM-Contract-Verification fuer robustere, agent-native KADi-Frontend-Workflows."
umsetzungsidee: "Neuen Skill '.claude/skills/claude-code-interview-spec-verify/' anlegen mit drei Sections: (1) Interview-Prompt-Pattern (AskUserQuestion-Tool explizit, Domain-statt-Outcome), (2) HTML-Multi-Variant-Spec-Generation als Alternative zu Markdown-Specs bei UI-lastigen Tasks, (3) DOM-Contract-Pattern fuer testbare React-Components (data-verify-state, data-verify-schema, Probes). Zusaetzlich Aria-Default-Settings dokumentieren: auto-mode, effort=high, fast-mode-Use-Cases."
prioritaet: P1
klassifikation: Skill
confidence: 0.82
status: aktiv
tags: [claude-code, prompting, html-specs, verification, dom-contracts, playwright-mcp, agent-native, kadi-frontend, akp, video, auto-ingested]
date: 2026-05-24
akp_run: kar-74
---

# How we Claude Code

**Channel:** claude · **Dauer:** 31 min · **URL:** https://www.youtube.com/watch?v=IlqJqcl8ONE

## Kernaussage
Anthropic-Architekt Ara zeigt drei Workflows fuer Claude Code: (1) Claude via 'ask user question' Tool das Requirements-Interview fuehren lassen, (2) Specs/Designs als HTML statt Markdown rendern, (3) Verifikation agent-nativ ins Artefakt einbetten via DOM-Contracts, Probes und Playwright MCP — inkl. aufgezeichneter Verifizierungsclips als Proof.

## 7-Punkt Praxisanalyse
### 1. Was koennen wir lernen?
Drei konkrete Techniken: (a) Prompts so formulieren, dass Claude proaktiv Rueckfragen stellt (Tool 'AskUserQuestion' explizit referenzieren, Domaenen statt Outcomes vorgeben). (b) Mehrere HTML-Design-Varianten parallel generieren lassen statt Markdown-Spec — fuer richer human review. (c) Verifikation als 3-Surface-Architektur: human-readable Dashboard, agent-readable DOM-Contracts (data-attributes mit Schema/Fixtures/Invariants/Probes), CI-runnable (bun verify). Zusaetzlich: Auto-Modus + Fast-Mode + Effort-Param X-High, Opus 4.7 fuer Vision, Screenshots als Feedback-Kanal.

### 2. Wie koennen wir es einsetzen?
Fuer KADi-Frontend (Dashboards, Issue-Views): Vor Implementierung 3-4 HTML-Mockups generieren lassen. Fuer KAR-Backlog-Issues: 'AskUserQuestion'-Pattern in Triage-Prompts einbauen, damit Aria bei vagen Issues nachfragt statt halluziniert. Fuer Aria-Tests: DOM-Contracts via data-verify-*-Attribute in KADi-Components einbauen, damit Playwright-MCP-basierte E2E-Checks ohne fragiles Selector-Hopping laufen.

### 3. Konkreter Vorteil fuer Aria / KADi / Supplier Pulse / Workflow / Tools?
Aria gewinnt Token-Effizienz langfristig (weniger Re-Iteration durch bessere Specs). KADi gewinnt testbare UI-Komponenten ohne Test-Code-Duplikation — Component published State im DOM, Agent + Human + CI lesen denselben Contract. Dashboard-Probes ermoeglichen 'evidence packages' fuer PRs (Video-Recordings statt nur Screenshots).

### 4. Was koennen wir dadurch besser machen?
Aria-Prompts ergaenzen um explizites 'frag mich erst' Pattern bei P1/P2-Issues. Aktuell ist KAR-Triage stark output-orientiert — hier waere Interview-Phase wertvoll bei mehrdeutigen Video-Insights. HTML-Spec-Pattern fuer KAR-Issue-Bodies pruefen (statt nur Markdown).

### 5. Lohnt sich die Umsetzung — warum?
Ja, P1. Die DOM-Contract-Idee ist neu und KADi-relevant. HTML-statt-Markdown ist konzeptionell stark, aber fuer KAR-Backlog (Plaintext-First) nur teilweise uebertragbar. Auto/Fast-Mode und Effort-Params sind direkte Quick-Wins fuer Aria-Operator-Setup.

### 6. Naechste Schritte
1) Skill 'claude-code-interview-mode' anlegen mit AskUserQuestion-Pattern. 2) Spike: DOM-Contract-Pattern fuer KADi-React-Components evaluieren. 3) Effort/Fast-Mode-Settings in Aria-Defaults pruefen. 4) Repo cwc-workshops klonen + Verifikations-Demo durchspielen.

## Kritik (Pflichtfeld)
Workshop-Format ist sehr werblich (Opus 4.7, Anthropic-Stack). HTML-Spec-Argument wird behauptet aber nicht mit Daten belegt ('in der Regel nein' bei Token-Effizienz-Frage = Bauchgefuehl). Verifikations-Demo ist fuer eine Toy-ToDo-App — Skalierbarkeit auf echte Apps offen. Ueberlappung zu bereits vorhandenem Wissen (Maven-Lessons, Cole-Medin): Multi-Agent-Patterns, Subagents werden hier gar nicht behandelt — der Workshop ist enger fokussiert. 'Bitter Lesson'-Framing ist Buzzword-Dropping. Aufnahmen-auf-S3 ist nett, aber operativ unklar wie das in Standard-CI integriert.

## Multi-Level-Challenge (inline, KAR-72)
**Devils-Advocate:** Der Workshop ist Anthropic-Marketing fuer Opus 4.7 und neue Modi. DOM-Contracts erzeugen Boilerplate in jeder Component — bei KADi (kleine Codebasis, wenige UI-Surfaces) ist der Overhead vermutlich groesser als der Nutzen. Interview-Mode kann auch bremsen wenn Aria autonom triagieren soll.

**Steel-Man:** Die Trennung 'human-surface / agent-surface / CI-surface' via einheitlichem DOM-Contract ist genuin neu und loest das Selector-Brittleness-Problem von Playwright-Tests. Interview-Mode reduziert genau die Halluzinations-Klasse, die Aria bei vagen Video-Insights heute zeigt.

**Synthese:** Promote als Skill mit Refine-Schritt: Interview-Pattern + Aria-Defaults sofort dokumentieren (P1), DOM-Contract-Teil zunaechst als Spike fuer KADi pruefen bevor flaechig ausgerollt. HTML-Multi-Variant-Specs nur dort wo UI-Komponenten betroffen sind — nicht fuer Backlog/Plaintext-Workflows.

## Cross-Reference (Brain-Match)
- [[2026-05-15-colemedin-how-to-properly-use-claude-code-agent-te]] (score 66.575)
- [[cae43f--claude-code--a-practitioner-s-guide-to-building-multi-agents]] (score 60.076)
- [[eabcfb--mastering-80--of-claude-code--cowork---codex-in-90-minutes]] (score 57.057)

## Klassifikation: **Skill** · Prioritaet **P1** · Confidence **0.82**

---
*Auto-generated by aria-akp-deep.py · cost $0.4146 · 2026-05-24T04:07:40.537072+00:00*