Crumb-Core-v.1/docs/crumbforest/painter_mission.md

title, slug, version, lang, tags, summary

title	slug	version	lang	tags	summary
Crumbblocks Painter Missions - Jeder Kruemel zaehlt	painter_missions	0.1	de	[Crumbblocks, Painter, Bezier, Kids, Senioren, Atem-Pinsel, JSON, PNG, PWA, KruemelLog]	Drei Mini-Missionen fuer Kids und Senioren mit Crumbblocks (Painter, Lines, Bezier, Stream). ASCII-clean, JSON-Format fuer Replay, Atem-Pinsel-Vorgabe und KruemelLog-Schema.

Crumbblocks Painter Missions - Jeder Kruemel zaehlt

Leitmotiv: Ein kleiner Mut, der gemeinsam waechst. Ziel: Malen und Erinnern zusammenbringen. Alles offline-faehig, ruhig, klar, ohne Angst.

0) Quickstart (30 Sekunden)

• Oeffne: painter.html, painter_lines.html, bezier.html oder bezier_stream.html.
• Nutze grosse Buttons im Senior-Modus (max 3 Tools).
• Speichere PNG und JSON (Replay).
• Logge den Moment in den KruemelLog.

1) Drei Mini-Missionen (Kinder x Senioren)

Mission A: Omis Weg zum See (Lines)

• Zeit: 10 min.
• Senior zeichnet aus der Erinnerung den Weg zum See als Linien.
• Kinder fahren den Weg mit dem Cursor nach (kleines Icon).
• Abschluss: PNG sichern + 1 Satz Zitat speichern.

Akzeptanz

• 1 fertige Linienkarte, 1 Zitat, 1 Eintrag im KruemelLog.

Mission B: Walzer-Kurve (Bezier)

• Zeit: 10 min.
• Gemeinsam eine geschwungene Bezier-Linie im 3/4-Gefuehl anlegen.
• FunkFox spielt einen leisen Groove (optional).
• Abschluss: PNG sichern + JSON Replay exportieren.

Akzeptanz

• 1 Bezier-Kurve, JSON vorhanden, 1 Eintrag im KruemelLog.

Mission C: Atem-Bild (Stream)

• Zeit: 2 min Atem + 3 min Abschluss.
• Atem-Pinsel: Strichbreite pulst nach 4-4-6-5 Atemmuster (siehe Preset unten).
• Senior atmet mit, Kind fuehrt den Stift.
• Abschluss: PNG + Zitat, JSON exportieren.

Akzeptanz

• PNG, JSON, Zitat gespeichert, 1 Eintrag im KruemelLog.

2) Senior- und Kid-Modus

• Senior-Modus: 3 Tools sichtbar (Pen, Radierer, Farbe), grosse UI, hoher Kontrast.
• Kid-Modus: zusaetzlich Bezier, Undo/Redo, Farbeimer, Dicke-Regler.
• Schalter: url-param ?mode=senior oder ?mode=kid (optional), sonst Button in der UI.

3) Speichern und Teilen

• PNG sichern: Canvas nach PNG exportieren; Dateiname mit Zeitstempel crumb_paint_YYYY-MM-DD_HH-MM-SS.png.
• JSON Replay: Alle Striche als JSON speichern; Import ermoeglicht exaktes Nachzeichnen.

4) Stroke-JSON (Replay-Format)

Minimalformat fuer einen Stroke:

{
  "tool": "pen",
  "color": "#000000",
  "size": 3,
  "points": [
    {"x": 120.5, "y": 80.0, "t": 1724438400000},
    {"x": 121.3, "y": 81.2, "t": 1724438400050}
  ],
  "meta": {
    "mission_id": "mission-c-atem-bild",
    "room_id": "ozm-insel-2"
  }
}

Replay-Datei:

{
  "strokes": [
    {"tool":"pen","color":"#000","size":3,"points":[{"x":1,"y":1,"t":1},{"x":2,"y":2,"t":20}]}
  ],
  "canvas": {"w": 1024, "h": 768, "dpr": 2}
}

5) KruemelLog-Schema (Momente statt Score)

{
  "ts": "2025-08-23T16:30:00+02:00",
  "emoji": ":sparkles:",
  "msg": "Walzer-Kurve fertig, Omi nennt ihr Lied.",
  "quelle": "Crumbblocks",
  "ref_png": "crumb_paint_2025-08-23_16-29-50.png",
  "ref_json": "crumb_paint_strokes_2025-08-23_16-29-50.json",
  "mission_id": "mission-b-walzer-kurve",
  "room_id": "ozm-insel-2"
}

6) Atem-Pinsel Preset (4-4-6-5)

Ziel: Strichbreite moduliert sich ueber Zeit in einem Atemzyklus. Muster: ein 4 Takte ein, 4 Takte halten, 6 Takte aus, 5 Takte Pause. Skala: size(t) = base + amp * f(phase).

Pseudo-Formel:

cycle = 4 + 4 + 6 + 5 = 19 Einheiten
phase = (time_ms % (19 * unit_ms)) / unit_ms  # 0..19
if phase < 4:          # Einatmen
    w = base + amp * (phase/4)
elif phase < 8:        # Halten
    w = base + amp
elif phase < 14:       # Ausatmen
    w = base + amp * (1 - (phase-8)/6)
else:                  # Pause
    w = base

Parameter:

• unit_ms: 500 (Beispiel).
• base: 2..4 px.
• amp: 2..6 px.
• Begrenzung: w_min = 1, w_max = 20.

Hinweis: LED kann synchron sanft pulsen (keine Stroboskop-Effekte).

7) A11y und Kiosk

• Pointer Events fuer Touch und Stylus, HiDPI-Scaling mit DPR.
• Kontraste hoch, Fokus-Ringe an, Undo per Taste Z.
• Kiosk: Vollbild, grosse Buttons, klare Labels.
• Senior-Schutz: keine ueberfrachteten Menues.

8) Offline und PWA

• Manifest + Service Worker erlauben Offline-Nutzung.
• Speicherort: Download-Ordner oder Nextcloud-Pfad /media/crumbblocks/.
• Import: JSON kann spaeter geladen und als Replay gezeichnet werden.

9) FAQ (Kurz, Retrieval-Form)

Q: Was ist der Atem-Pinsel? A: Ein Pinsel, dessen Strichbreite einem Atemmuster folgt (4-4-6-5). Das beruhigt und macht Tempo sichtbar.

Q: Wie sichere ich meine Zeichnung? A: PNG-Button fuer Bilder, JSON-Button fuer Strichdaten (spae­ter Replay moeglich).

Q: Was passiert bei Tablet-Lags? A: Reduziere live-Filter, senke DPR bei extrem alten Geraeten, nutze Senior-Modus (weniger Tools).

Q: Wie kommen Senior:innen und Kids zusammen? A: Waehl eine Mission (A, B, C). Senior gibt den Impuls (Weg, Walzer, Atem). Kids bauen das Echo (PNG, JSON, Zitat).

Q: Muss ich online sein? A: Nein. Alles funktioniert offline. Optional kann in eine lokale Nextcloud gespeichert werden.

10) Checkliste fuer OZM-Demo

• Tablet im Kiosk, Lautstaerke leise, Senior-Modus aktiv.
• PNG- und JSON-Buttons sichtbar.
• Atem-Pinsel getestet (Mission C).
• KruemelLog-Testeintrag erstellt.
• Ein Zitat vorbereitet (z. B. Sommer am See).

11) Vector-Hinweis

• ASCII only, keine typografischen Sonderzeichen.
• YAML-Front-Matter korrekt begrenzen (--- oben und unten).
• Kurze Abschnitte, erkennbare Ueberschriften, FAQ-Block fuer bessere Treffer.

Ende