Spec docs/superpowers/specs/2026-10-01-relaunch-design.md (wartet auf Freigabe), Karte aus Natural Earth (gemeinfrei) mit Punkt Falkenstein, 19 Portal-Aufnahmen mit erfundenen Demodaten, Regeln für Cloud-Sitzungen in CLAUDE.md. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
61 lines
4.7 KiB
Markdown
61 lines
4.7 KiB
Markdown
# Material für den Relaunch
|
||
|
||
Dieses Verzeichnis gehört zur Spezifikation `docs/superpowers/specs/2026-10-01-relaunch-design.md`.
|
||
|
||
## Deutschland-Karte
|
||
|
||
- `assets/deutschland-umriss.svg` – Umriss von Deutschland mit rotem Punkt auf dem Serverstandort Falkenstein/Vogtland (Sachsen).
|
||
- Ein `<path>` (nur Linie, `stroke="currentColor"`, `vector-effect="non-scaling-stroke"`) plus ein `<circle>` (`#e5251c`), viewBox `0 0 663 892`, ca. 7 KB.
|
||
- Quelle: **Natural Earth**, „Admin 0 – Countries“, Maßstab 1:10 m. Gemeinfrei (Public Domain): „All versions of Natural Earth raster + vector map data … are in the public domain.“ Ein Quellenhinweis ist nicht nötig („Made with Natural Earth.“ ist freiwillig).
|
||
- Behalten: Festland, Rügen, Usedom, Fehmarn, Sylt, Föhr/Amrum. Vereinfacht (Douglas-Peucker, ca. 0,9 km Toleranz).
|
||
- Projektion: Lambert-Azimutal-flächentreu (wie ETRS89-LAEA), Mitte 10° O / 52° N, Kugelradius 6371 km. 1 Einheit ≈ 1 km. Geprüft: Berlin–München 504 km auf der Karte wie in echt.
|
||
- Punkt Falkenstein (50,477 N, 12,371 O): `cx = 469.6`, `cy = 520.5` (70,8 % von links, 58,4 % von oben; liegt im Festland, 13,9 km von der tschechischen Grenze).
|
||
|
||
**Weitere Punkte setzen** (z. B. Büro Winnweiler, ca. 49,567 N, 7,850 O – Koordinaten vor Einbau prüfen):
|
||
|
||
```js
|
||
const R = 6371, lon0 = 10 * Math.PI / 180, lat0 = 52 * Math.PI / 180;
|
||
// Grad -> SVG-Koordinaten in der viewBox 0 0 663 892
|
||
function project(lon, lat) {
|
||
const l = lon * Math.PI / 180, p = lat * Math.PI / 180;
|
||
const k = Math.sqrt(2 / (1 + Math.sin(lat0) * Math.sin(p) + Math.cos(lat0) * Math.cos(p) * Math.cos(l - lon0)));
|
||
const x = R * k * Math.cos(p) * Math.sin(l - lon0);
|
||
const y = R * k * (Math.cos(lat0) * Math.sin(p) - Math.sin(lat0) * Math.cos(p) * Math.cos(l - lon0));
|
||
return [x + 289.794 + 12, 341.920 - y + 12];
|
||
}
|
||
project(12.371, 50.477); // -> [469.6, 520.5] Falkenstein
|
||
```
|
||
|
||
Für das Zeichnen des Umrisses per `stroke-dasharray` das Attribut `vector-effect="non-scaling-stroke"` entfernen und `pathLength="1"` setzen (sonst stimmen die Strichlängen nicht).
|
||
|
||
## Kundenportal-Screenshots
|
||
|
||
`assets/portal/` – Aufnahmen des echten Kundenportals (project.webklar.com) mit **erfundenen Demodaten** („Bäckerei Sonnenschein“, Rechnungsbeträge, Chatverlauf). Es sind keine echten Kundendaten enthalten. Das Brotfoto ist eine selbst gezeichnete Grafik, die Demo-Website der Bäckerei eine selbst erstellte Seite; beides sind keine Stock- oder KI-Bilder. Aufgenommen am 2026-10-01 mit dem damaligen Stand des Portals.
|
||
|
||
Vor dem Livegang neu aufnehmen (das Aufnahme-Werkzeug liegt intern beim Inhaber): wenn sich das Portal sichtbar ändert, und damit Auftrags-, Rechnungs- und Kundennummern offensichtlich erfunden aussehen (z. B. Auftrag 1001, Rechnung 2026-0001). Die heutigen Nummern sind zwar erfunden, wirken aber wie echte Zählerstände.
|
||
|
||
| Datei | Größe (px) | Inhalt |
|
||
|---|---|---|
|
||
| `00-uebersicht.png` | 2360 × 1229 | Übersicht aller Aufnahmen (nur zur Orientierung, nicht ausliefern) |
|
||
| `desktop-1-projekte.webp` | 2880 × 1800 | Projektübersicht mit Live-Vorschau der Website |
|
||
| `desktop-2-fortschritt.webp` | 2880 × 1800 | „Was wir zuletzt erledigt haben“ – Fortschritt in Klartext |
|
||
| `desktop-3-chat.webp` | 2880 × 1800 | Chat mit Sprachnachricht und Datei |
|
||
| `desktop-3b-chat-foto.webp` | 2880 × 1800 | Chat mit Foto |
|
||
| `desktop-4-rechnungen.webp` | 2880 × 1800 | Rechnungen |
|
||
| `desktop-5-stundenkonto.webp` | 2880 × 1800 | Stundenkonto des Wartungs-Abos (nur nach Freigabe zeigen) |
|
||
| `desktop-6-funktionen.webp` | 2880 × 1800 | Funktionen (Terminplaner/Analyse dort sind Platzhalter – nicht bewerben) |
|
||
| `desktop-7-news-pinnwand.webp` | 2880 × 1800 | News-Pinnwand mit Vorschau |
|
||
| `phone-0-login.webp` | 780 × 1688 | Anmeldung (Handy) |
|
||
| `phone-1-projekte.webp` | 780 × 1688 | Projekte mit Vorschau (Handy-App) |
|
||
| `phone-1b-tabbar.webp` | 780 × 192 | untere Tab-Leiste der Handy-App |
|
||
| `phone-2-projekte-lang.webp` | 780 × 5428 | lange Projektseite zum Durchscrollen im Handy-Rahmen |
|
||
| `phone-3-projektdetails.webp` | 780 × 1688 | Projektdetails mit letzten Änderungen |
|
||
| `phone-4-chat.webp` | 780 × 1688 | Chat |
|
||
| `phone-4b-chat-foto.webp` | 780 × 1688 | Chat mit Foto |
|
||
| `phone-5-rechnungen.webp` | 780 × 1688 | Rechnungen |
|
||
| `phone-6-vertraege.webp` | 780 × 1688 | Verträge (nur nach Freigabe zeigen) |
|
||
| `phone-7-news.webp` | 780 × 1688 | News-Pinnwand bearbeiten |
|
||
| `phone-8-news-vorschau.webp` | 780 × 1688 | News-Pinnwand, Vorschau „So sehen es alle“ |
|
||
|
||
Die Handy-Aufnahmen haben oben 47 px und unten 34 px Rand für Uhrzeit und Home-Leiste (Safe Area). Die Dateien sind Rohexporte in doppelter Auflösung; für die Website verkleinern (Budgets in der Spec, Abschnitt 9.5).
|