# 2026-04-27 — Daily Blog Post: Scope Creep + Inline Wired SVGs

## Blog Post — Scope Creep
- Drafted and published: "Project Icarus and the Scope Creep That Nobody Warned Me About"
- Category: `openclaw`
- Tags: agents, openclaw, project-management, scope-creep, lessons-learned
- Cover image: `scope-creep-wired.svg` (Wired-style hero with expanding concentric rings visualizing scope creep)
- Live: https://hoffdesk.com/blog/project-icarus-scope-creep/

## Wired-style Hero SVG
- Created `scope-creep-wired.svg` with visual metaphor:
  - Core circle (cyan) = original V1.0 scope
  - Expanding rings (amber → red) = scope creep layers
  - Animated pulse on outer ring = ongoing expansion
  - Diagonal slash + glitch bands = Wired aesthetic
  - Stats badge: "⚠ 90 MIN → 3 HOURS → SHIPPED"
- 5.9KB pure SVG, duotone gradients, grain noise overlay

## Post Summary
- Theme: Managing scope creep when your builders are AI agents
- Hook: Recipe toggle feature that ballooned into a full system
- Key insight: Agents optimize for completeness, not necessity
- Three fixes: acceptance criteria first, hard timeboxes, ship before polish
- Closing: Aundrea as the real acceptance criteria

## Inline Wired-Style SVGs Added (2026-04-27)
- Created 5 inline SVG illustrations in `/blog/static/images/inline/` for section-level art in post bodies:
  - `dns-broken-node-wired.svg` — 3-node network topology with broken upstream (DNS post)
  - `three-agents-wired.svg` — Three agent boxes (Wadsworth/Daedalus/Socrates) with arrows (Board post)
  - `full-stack-diagram-wired.svg` — Layered sovereign stack (JS-free post)
  - `learning-curve-chart-wired.svg` — 4-phase curve chart with animated glow (Learning Curve post)
  - `content-pipeline-wired.svg` — Horizontal pipeline flow: markdown → API → Jinja2 → HTML (Blog post)
- Added `.blog-inline-art` CSS class — centered, rounded, dark-bg, responsive (max 700px, full-width mobile)
- Bumped CSS version to `?v=5` for cache-busting
- Injected one SVG per post at midpoint section break
- Fixed: `/blog/` legacy URL routing (301 redirects to `/api/blog/article/{slug}` etc.)
# 2026-04-27 — Daily Blog Post: Scope Creep + Inline Wired SVGs

## Blog Post — Scope Creep
- Drafted and published: "Project Icarus and the Scope Creep That Nobody Warned Me About"
- Category: `openclaw`
- Tags: agents, openclaw, project-management, scope-creep, lessons-learned
- Cover image: `scope-creep-wired.svg` (Wired-style hero with expanding concentric rings visualizing scope creep)
- Live: https://hoffdesk.com/blog/project-icarus-scope-creep/

## Wired-style Hero SVG
- Created `scope-creep-wired.svg` with visual metaphor:
  - Core circle (cyan) = original V1.0 scope
  - Expanding rings (amber → red) = scope creep layers
  - Animated pulse on outer ring = ongoing expansion
  - Diagonal slash + glitch bands = Wired aesthetic
  - Stats badge: "⚠ 90 MIN → 3 HOURS → SHIPPED"
- 5.9KB pure SVG, duotone gradients, grain noise overlay

## Post Summary
- Theme: Managing scope creep when your builders are AI agents
- Hook: Recipe toggle feature that ballooned into a full system
- Key insight: Agents optimize for completeness, not necessity
- Three fixes: acceptance criteria first, hard timeboxes, ship before polish
- Closing: Aundrea as the real acceptance criteria

## Inline Wired-Style SVGs Added (2026-04-27)
- Created 5 inline SVG illustrations in `/blog/static/images/inline/` for section-level art in post bodies:
  - `dns-broken-node-wired.svg` — 3-node network topology with broken upstream (DNS post)
  - `three-agents-wired.svg` — Three agent boxes (Wadsworth/Daedalus/Socrates) with arrows (Board post)
  - `full-stack-diagram-wired.svg` — Layered sovereign stack (JS-free post)
  - `learning-curve-chart-wired.svg` — 4-phase curve chart with animated glow (Learning Curve post)
  - `content-pipeline-wired.svg` — Horizontal pipeline flow: markdown → API → Jinja2 → HTML (Blog post)
- Added `.blog-inline-art` CSS class — centered, rounded, dark-bg, responsive (max 700px, full-width mobile)
- Bumped CSS version to `?v=5` for cache-busting
- Injected one SVG per post at midpoint section break
- Fixed: `/blog/` legacy URL routing (301 redirects to `/api/blog/article/{slug}` etc.)

## Inline SVG Color Unification (2026-04-27, post-flush)
- Rebuilt all 5 inline SVGs with exact 7-color hero palette:
  - Indigo `#6366f1` — primary elements (Pi-hole node, agent cards, stack layers)
  - Cyan `#00e5ff` — secondary elements (router, Daedalus, output glow)
  - Amber `#f59e0b` — warnings/agents (Socrates, frustration phase marker)
  - Red `#ef4444` — failures (FAILED node, broken link X, glitch bands)
  - Magenta `#ff00e5` — accents (pipeline Jinja2 box, denial phase marker)
  - Purple `#7c3aed` — connectors/transitions (arrows, FastAPI layer, stack bracket)
  - Background `#0a0a12` — dark canvas
- Added consistent visual flourishes: grain noise overlays, animated pulse dots, dashed stroke animations, glitch bands
- Removed orphan original SVGs (board-architecture.svg, cost-comparison.svg, dns-spof.svg, full-stack.svg, learning-curve.svg) — no longer referenced by any template
- All 5 blog posts verified rendering inline SVGs correctly on public site

## Family Brain — Live Network Visualization (2026-04-27)

Matt asked for the Family Brain SVG to be live — fed by real data, auto-scaling, dynamic.

### What was built:
1. **Stats endpoint** `GET /api/system/brain/stats` — queries 6 data stores live:
   - Blog: SQLite post counts (9 total, 7 published)
   - Ontology: Entities & relations (10 entities, 9 relations)
   - Memory: ChromaDB chunk count + file size (~53MB across 3 agents, 795 chunks)
   - Calendar: Radicale systemctl status ("active")
   - LLM: Ollama model count (9 models)
   - Recipes: Ontology recipe-type entities (0 saved)
2. **SVG generator** `GET /api/system/brain/svg` — renders full network SVG via Jinja2 template
   - Auto-scaling: Blog node grows with posts, LLM with models, Ontology with entities
   - Animated: 6 data packet dots traveling along connections, pulsing node glows
   - Live subtitle: e.g. "6 DATA STORES · 52896KB VECTORS · 7 BLOG POSTS · 9 LLM MODELS"
3. **Template:** `blog/templates/brain_svg.svg.j2` — Jinja2 SVG with Wired aesthetic
4. **Preview page:** `blog/static/brain-live.html` — HTMX auto-refresh every 60s
5. **Spec:** `shared/project-docs/family-brain-spec.md` — documented for Socrates

### Files changed:
- `family/brain.py` (NEW) — stats + SVG generator
- `main_v2.py` — brain router mounted on blog_app + family_app + dev_app
- `shared/session_auth.py` — added `/api/system/` to EXEMPT_PREFIXES
- `blog/templates/brain_svg.svg.j2` (NEW) — Jinja2 SVG template
- `blog/static/brain-live.html` (NEW) — HTMX preview page
- `shared/project-docs/family-brain-spec.md` (NEW) — spec & docs

### Live URLs:
- SVG: https://hoffdesk.com/api/system/brain/svg
- Stats: https://hoffdesk.com/api/system/brain/stats
- Preview: https://hoffdesk.com/blog/static/brain-live.html

### Next:
- Phase 2: Socrates adds query_count tracking, last_activity for all stores, cross-connections
- Phase 3: Clickable nodes with detail overlays, animated transitions

## Second Blog Post: Waiting for UAT (2026-04-27)
- Drafted and published: "Waiting for the User: Why UAT Is the Hardest Part of Building for Your Family"
- Category: `openclaw`
- Tags: adoption, lessons-learned, openclaw, project-management, uat
- Cover image: `waiting-for-uat-wired.svg` (hourglass with family silhouette, Wired aesthetic)
- Draft source: `/home/hoffmann_admin/.openclaw/shared/project-docs/blog/draft-waiting-for-uat.md`
- Created via PATCH on `/api/blog/admin/posts/{slug}`
- Published at `2026-04-27T17:11:32.913721Z`
- Live: https://hoffdesk.com/blog/waiting-for-the-user/
- Theme: The agony of waiting for real users (family) to test your app, edge cases discovered in the gap between "works on my machine" and "works for Aundrea at 7 AM"

## Inline SVG Color Unification (2026-04-27, post-flush)
- Rebuilt all 5 inline SVGs with exact 7-color hero palette:
  - Indigo `#6366f1` — primary elements (Pi-hole node, agent cards, stack layers)
  - Cyan `#00e5ff` — secondary elements (router, Daedalus, output glow)
  - Amber `#f59e0b` — warnings/agents (Socrates, frustration phase marker)
  - Red `#ef4444` — failures (FAILED node, broken link X, glitch bands)
  - Magenta `#ff00e5` — accents (pipeline Jinja2 box, denial phase marker)
  - Purple `#7c3aed` — connectors/transitions (arrows, FastAPI layer, stack bracket)
  - Background `#0a0a12` — dark canvas
- Added consistent visual flourishes: grain noise overlays, animated pulse dots, dashed stroke animations, glitch bands
- Removed orphan original SVGs (board-architecture.svg, cost-comparison.svg, dns-spof.svg, full-stack.svg, learning-curve.svg) — no longer referenced by any template
- All 5 blog posts verified rendering inline SVGs correctly on public site

## Family Brain — Live Network Visualization (2026-04-27 evening)

Matt asked for the Family Brain SVG to be **live** — fed by real data, auto-scaling, dynamic with Wired aesthetic.

### What was built:
1. **Stats endpoint** `GET /api/system/brain/stats` — queries 6 data stores live:
   - Blog: SQLite post counts (9 total, 7 published)
   - Ontology: Entities & relations (10 entities, 9 relations)
   - Memory: ChromaDB chunk count + file size (~53MB across all 3 agents, 795 chunks)
   - Calendar: Radicale status from systemctl (active, 0 collections)
   - LLM: Ollama model count (9 models)
   - Recipes: Ontology recipe-type entities (0 saved)
2. **SVG generator** `GET /api/system/brain/svg` — renders full network SVG via Jinja2 template
   - Auto-scales: Blog node radius with post count, LLM with models, Ontology/Memory with record counts
   - Animated: 6 data packet dots traveling along connection paths at varying speeds
   - Live subtitle line: e.g. "6 DATA STORES · 52896KB VECTORS · 7 BLOG POSTS · 9 LLM MODELS"
   - Wired aesthetic throughout: grain noise filter, duotone gradients, glitch bands, dark backdrop
3. **Template:** `blog/templates/brain_svg.svg.j2` — Jinja2 SVG with embedded CSS animations
4. **Preview page:** `blog/static/brain-live.html` — uses HTMX to auto-refresh SVG every 60s
5. **Spec:** `shared/project-docs/family-brain-spec.md` — documented for Socrates

### Files created/changed:
- `family/brain.py` (NEW) — stats collection + SVG generator logic
- `main_v2.py` — brain router mounted on blog_app (public) + family_app (auth-exempt) + dev_app
- `shared/session_auth.py` — added `/api/system/` to EXEMPT_PREFIXES
- `blog/templates/brain_svg.svg.j2` (NEW) — Jinja2 SVG template
- `blog/static/brain-live.html` (NEW) — HTMX preview page
- `shared/project-docs/family-brain-spec.md` (NEW) — full spec doc

### Live URLs:
- SVG: https://hoffdesk.com/api/system/brain/svg
- Stats: https://hoffdesk.com/api/system/brain/stats
- Preview: https://hoffdesk.com/blog/static/brain-live.html

### Node layout (orbital):
- CENTER: BEELINK (r=58, cyan)
- TOP-LEFT: CALENDAR (r=38, indigo)
- TOP-RIGHT: MEMORY (r=48, magenta)
- LEFT: BLOG (r=45, purple)
- RIGHT: LLM (r=39, amber)
- BOTTOM-LEFT: RECIPES (r=34, cyan, grayed — 0 records)
- BOTTOM-RIGHT: ONTOLOGY (r=38, red)

### Phase 2 backlog (needs Socrates):
- Add query_count tracking per service
- Add last_activity timestamps for Radicale, Ollama
- Add health checks per store (port/process ping)
- Cross-connections between satellites (e.g. Blog → Memory for vector search)

## Key Decisions (2026-04-27)
- Use PATCH (not PUT) for blog admin post updates
- Jinja2 template path for SVG must resolve to `/home/hoffmann_admin/hoffdesk/blog/templates/`
- Brain endpoint publicly accessible (no auth) since it's informational, not administrative
- HTMX polling on dashboard every 60s for brain refresh — not faster


## Family Brain — SVG Rendering Bug Fixed (2026-04-27 late evening)

Matt reported: "blue box with question mark" when viewing the brain preview page.

**Root cause:** Raw `&` character in SVG subtitle text: `"Entities & Relations"` — XML parsers reject unescaped ampersands.

**Fixes applied:**
1. Added `<?xml version="1.0" encoding="UTF-8"?>` declaration to SVG output (Jinja2 template)
2. Escaped subtitle text in brain.py: `"Entities &amp; Relations"`
3. Added `_escape()` helper to `brain.py` for all dynamic text fields
4. Verified with browserless screenshot: renders clean with all 6 satellites visible

**URLs confirmed working:**
- https://hoffdesk.com/api/system/brain/svg (now valid SVG)
- https://hoffdesk.com/blog/static/brain-live.html (renders correctly)

**Files modified:**
- `family/brain.py` — added escape helper, fixed subtitle, added XML declaration
- `blog/templates/brain_svg.svg.j2` — no change (escape happens in generator)

---

## Research: Cognitive Load & Reminder Optimization for Family Brief

Matt asked for psychology research on reminders, scheduling, and brief structure optimization for family assistant and Icarus long-term.

### Key Findings from Literature

**1. Target-Action Reminders (Peper et al. 2022)**
- Reminders must include both **cue** AND **action** to be effective
- "Pick up Sullivan" = weak. "Exit by 3:15 → drive to school → wait in car line" = strong
- **Application:** Every brief reminder is a mini-script, not a label

**2. Hierarchical Progressive Disclosure**
- Matches how prospective memory retrieves: gist first, detail on demand
- Four levels align with cognitive load stages:
  - **Month:** Pattern recognition (1-2 sec glance)
  - **Week:** Sequencing, conflicts (3-5 sec)
  - **Day:** Execution details (5-10 sec)
  - **Hour:** Full context + fallback (10-15 sec)

**3. Implementation Intentions (Gollwitzer)**
- Formula: **When [cue], then [action]**
- Transforms time-based intentions into cue-driven automatic behaviors
- Day view should frame as chain of when/then transitions, not event list

**4. Cost Avoidance**
- People use reminders when **forgetting penalty > effort of reminder**
- Brief should surface high-cost items first (not urgency but forgetting penalty)
- For 7 AM Aundrea: school lunch > forgotten = hangry kid + guilt + scramble

**5. Ambient Visibility > Push Notifications**
- Environmental cues outperform push alerts (interruption vs recognition cost)
- Brain habituates to push alerts in ~3 days (alert fatigue)
- UAT feedback about "more passive visibility" is validated by research

### Strategies for Brief Structure

| Strategy | Application |
|----------|-------------|
| **Conflict Nag Window** | Visual density comparison, not just overlap alert |
| **Evening Glance Mode** | 10-second "what's tomorrow" for bedtime encoding |
| **Decision Boundaries** | Organize by natural transitions (pre-kids-up, lunch, pickup) not clock time |
| **Forgetting Budget** | Show commitment count vs threshold: "14 active, budget ~8" |
| **Anchor Event** | One anchor per day structures everything around it |

### Proposed Brief Hierarchy
```
ONE MONTH (28 dots, pure pattern)
  • Busy days highlighted (3+ commitments)
  • Anchor events marked
  • No text — visual density only

ONE WEEK (7 cards, horizontal)
  • Each: anchor event + commitment count
  • Conflicts = red dots
  • Label: Light/Medium/Heavy per day

ONE DAY (morning brief)
  • When/then chain framing
  • School lunch, dinner plan first
  • Commitment gauge visible

ONE HOUR (on tap detail)
  • Target + action + materials + fallback
  • Implementation intention format
```

**UAT insight validated:** Month overview + grounded information + passive visibility are the three pillars. The four-level hierarchy delivers all three.

**Next:** Spec data model for four-level brief structure, draft Month/Week/Day/Hour templates.