Initial commit: Crumbforest Architecture Refinement v1 (Clean)
This commit is contained in:
189
docs/crumbforest/painter_mission.md
Normal file
189
docs/crumbforest/painter_mission.md
Normal file
@@ -0,0 +1,189 @@
|
||||
---
|
||||
|
||||
title: Crumbblocks Painter Missions - Jeder Kruemel zaehlt
|
||||
slug: painter\_missions
|
||||
version: 0.1
|
||||
lang: de
|
||||
tags: \[Crumbblocks, Painter, Bezier, Kids, Senioren, Atem-Pinsel, JSON, PNG, PWA, KruemelLog]
|
||||
summary: 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:
|
||||
|
||||
```json
|
||||
{
|
||||
"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:
|
||||
|
||||
```json
|
||||
{
|
||||
"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)
|
||||
|
||||
```json
|
||||
{
|
||||
"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 (spaeter 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
|
||||
Reference in New Issue
Block a user