Files
tibi-docs/plans/t-shots-arbeitsauftrag.md
T
apairon 1897bb50d9
Deploy tibi-docs / build-and-deploy (push) Failing after 38s
Doku-Vollausbau: 62 Seiten (Projekt/Admin/Anwender/Referenz), Hook-Referenz mit Signaturen, Corporate-Screenshots, Coverage-Inventar
- Einstieg: Schnellstart + Neues Projekt aus Starter-Skill, Was-ist-Tibi mit Backend/Website-Trennung
- Projekt: Sammlungen, Felder, Abfragen, Rechte, Hooks, Dateien, i18n, Suche, SSR, Pagebuilder, Jobs, Audit, Deploy, LLM, MCP
- Hook-Referenz: 66 Symbole mit Signatur + Beispiel + Fehlerfall (5 Kapitel)
- Admin: Ansichten, Editor, Medien, Exporte, Aktionen, Rechte, KI, Setup, Customizing
- Anwender: 11 Anleitungen im professionellen Du-Ton, 30 Corporate-Screenshots
- Referenz: Schemas, Token-Köpfe, Fehlerbilder, Shortcuts, OpenAPI-Platzhalter
- ADR-0001 bis 0003, Coverage-Skript (282 Items) + Map, Plan-Dateien
2026-10-16 22:49:07 +00:00

3.0 KiB
Raw Blame History

T-SHOTS Arbeitsauftrag: Screenshots für die Anwender-Doku

Verbindlich für den Agenten, der T-SHOTS ausführt. Stand: 2026-10-16.

Eiserne Regeln

  • Mock-Projekt: corporate (Corporate Website). NIEMALS t1 (Test Core — Playwright-Minimalprojekt mit Quatsch-Daten) oder andere Test-Namespaces.
  • Anmeldung im Mock-Admin: admin / admin (siehe frontend/assets/mock/login.json).
  • Admin im Mock-Modus starten (siehe tibi-admin-nova/README.md, Docker-Stack mit Mock-Profil). Kein echter Server nötig.
  • Bilder nach tibi-docs/src/assets/anwender/, max 200 KB pro Datei (komprimieren, z. B. cwebp/pngquant), deutsche Alt-Texte direkt im Markdown (![Alt-Text](...)).
  • 1 Bild pro 3–4 Klicks, exakt an der Stelle des HTML-Kommentars <!-- Screenshot (T-SHOTS): ... --> in der jeweiligen Seite einfügen (Kommentar dabei entfernen).
  • Danach npm run build in tibi-docs — muss grün bleiben.

Warum corporate

frontend/assets/mock/project.json: corporate → „Corporate Website — Hauptwebsite der Firma mit Blog, Team-Seite und Kontaktformular". Sammlungen (_config/corporate/collections/): pages (mit Pagebuilder!), blog, team, navigation, medialib, downloads, redirects, settings. Eigene Block-Registry (corporate-blocks/registry.js + blocks.css) — echte Vorschaubilder statt Platzhalter.

Shot-Liste (je Anwender-Seite)

Seite Motive (in dieser Reihenfolge aufnehmen)
anmelden Login-Formular (leer) → Fehler nach falschem Passwort → eingeloggter Start (Corporate-Projekt sichtbar)
orientierung Start mit Projekt-Übersicht → geöffnetes Corporate-Projekt mit Menü → Schnellsuche (/) mit Ergebnis
lesen-suchen-filtern Corporate-Liste (Tabelle) → Suche mit Treffer → Filter-Popover offen → Karten-Ansicht
eintrag-bearbeiten Neu-Formular (Corporate-Blog) → ausgefülltes Formular → Speicher-Bestätigung → Pflichtfeld-Fehler (Stern)
medien Medien-Raster (Corporate-Bilder) → „Dateien hinzufügen"-Dialog → Upload-Fortschritt → Bildeditor
seiten-bauen Pagebuilder mit Corporate-Blöcken → Block-Auswahl → Vorschau (RowPreview) → veröffentlichte Seite
benutzer-teams „Mein Profil" mit Rolle → Benutzerverwaltung (falls Rolle es zeigt) → Team-Ansicht
exportieren Export-Dialog mit Formatwahl → Spaltenauswahl → fertige Datei
sichern Snapshot-Ansicht (Reiter Snapshots) → Details → Statistik
hilfe Keine Pflicht-Screenshots — nur wo sinnvoll (z. B. echte Fehlermeldung „Keine Berechtigung für diese Aktion")

Ablauf

  1. Mock-Admin starten, als admin/admin anmelden, Projekt Corporate Website wählen.
  2. Motive der Reihe nach aufnehmen (Browser-Screenshots, Desktop-Breite 1440, gleiche Fenstergröße für alle).
  3. Zuschneiden auf Inhalt (keine Browser-Chrome-Ränder außer wo nötig), komprimieren (<200 KB).
  4. In die Seiten einsetzen (Kommentar ersetzen), Alt-Texte deutsch („Anmeldemaske von tibi-admin mit ...").
  5. npm run build prüfen. Abnahme: Testleser erkennt jeden Schritt am Bild wieder.