|
|
# Design
|
|
|
|
|
|
Musubi gehört zur Familie von apps.zielke.studio (Patchcord, drop.two, drop.look): gleiche Typografie, gleiche Tonalität, gleiche Zurückhaltung – aber eine **eigene Farbwelt**. Die Farben kommen aus dem japanischen Färbehandwerk (Indigo/Ai-zome), passend zum Namen.
|
|
|
|
|
|
> Hinweis: Die Farben der anderen Apps ließen sich von der Website nicht automatisch auslesen. Vor dem Festlegen einmal nebeneinanderlegen und prüfen, dass Indigo sich klar abhebt.
|
|
|
|
|
|
## Leitidee
|
|
|
|
|
|
Ein Knoten verbindet Fäden. In Musubi werden Quellen und Ausgänge **geknüpft**: Die zentrale Ansicht zeigt links die Quellen, rechts Bildschirme und Kanäle, dazwischen Schnüre. Eine aktive Verbindung ist eine Indigo-Schnur mit kleinem Knoten an der Stelle, wo sie anliegt. Das ist das eine wiedererkennbare Element; alles andere bleibt ruhig.
|
|
|
|
|
|
## Farben
|
|
|
|
|
|
Regie-Räume sind dunkel. **Dunkel ist Standard**, hell ist unterstützt.
|
|
|
|
|
|
| Name | Rolle | Dunkel | Hell |
|
|
|
|---|---|---|---|
|
|
|
| Sumi (Tusche) | Hintergrund | `#14151B` | `#F4F4F6` |
|
|
|
| Kasumi (Dunst) | Flächen, Karten | `#1E2029` | `#FFFFFF` |
|
|
|
| Usuzumi (verdünnte Tusche) | Linien, Rahmen, gehobene Flächen | `#2B2E3A` | `#DADBE2` |
|
|
|
| Washi (Papier) | Text | `#ECE9E2` | `#16171D` |
|
|
|
| Nezumi (Mausgrau) | gedämpfter Text, Beschriftungen | `#8E8C96` | `#6A6974` |
|
|
|
| **Ai (Indigo)** | **einzige Markenfarbe**: aktive Schnüre, Auswahl, Hauptaktion | `#8A99F2` | `#4F63D9` |
|
|
|
|
|
|
### Signalfarben – nur für Zustände, nie als Deko
|
|
|
|
|
|
| Name | Bedeutung | Wert |
|
|
|
|---|---|---|
|
|
|
| Shu (Zinnober) | Tally PGM / „auf Sendung“, Sprechtaste aktiv | `#E5484D` |
|
|
|
| Moegi (Frühlingsgrün) | Tally Vorschau, Verbindung gut | `#3DBE7A` |
|
|
|
| Kohaku (Bernstein) | Warnung: Frames verloren, Pegel nah an 0 dBFS | `#E8A23A` |
|
|
|
|
|
|
Rot und Grün tauchen ausschließlich in diesen Bedeutungen auf. So bleibt Tally auf einen Blick lesbar.
|
|
|
|
|
|
## Typografie
|
|
|
|
|
|
| Einsatz | Schrift |
|
|
|
|---|---|
|
|
|
| App-Oberfläche | SF Pro (System) – Titel 600, Text 400 |
|
|
|
| Zahlen: Pegel, IP-Adressen, Latenz, Frames | SF Mono, tabellarische Ziffern |
|
|
|
| Website, Onboarding, App-Store-Bilder | Kanit 600 für Überschriften, Kanit 400 für Text |
|
|
|
| Ein hervorgehobenes Wort pro Überschrift | Instrument Serif *italic*, gleiche Größe wie Kanit |
|
|
|
|
|
|
Beispiel-Hero (Website): „Ein Kabel. Alle *Signale*.“
|
|
|
|
|
|
## Formen und Abstände
|
|
|
|
|
|
- Abstände in 8er-Schritten, innerhalb von Karten 16.
|
|
|
- Ecken: Karten 12, Schaltflächen 8, Chips 6.
|
|
|
- Linien 1 pt in Usuzumi. Keine Schatten, keine Verläufe.
|
|
|
- Schnüre in der Knoten-Ansicht: 2 pt, inaktiv Usuzumi, aktiv Ai; Knoten = gefüllter Kreis 6 pt.
|
|
|
|
|
|
## Texte
|
|
|
|
|
|
Stil wie auf apps.zielke.studio: kurz, konkret, Du-Form.
|
|
|
|
|
|
- Untertitel: **„NDI rein. Bild, Ton und Stimme raus.“**
|
|
|
- Begriffe durchgängig: *Quelle, Bildschirm, Kanal, Szene, Regie, Knoten, Sprechtaste, Vorschau, Sendung*.
|
|
|
- Schaltflächen sagen, was passiert: „Szene laden“, „Mit Knoten verbinden“, „Sprechen“.
|
|
|
- Fehler erklären Ursache und Ausweg:
|
|
|
- „Keine NDI-Quellen gefunden. Prüfe, ob das Technik-Netz an `en7` hängt.“
|
|
|
- „ZowieBox PGM antwortet nicht mehr. Neuer Versuch in 3 s.“
|
|
|
- Leere Zustände laden zum Handeln ein: „Noch keine Szene. Zieh eine Quelle auf einen Bildschirm.“
|
|
|
|
|
|
## Bildschirme (Version 1)
|
|
|
|
|
|
1. **Knoten-Ansicht** (Hauptfenster): Quellen links, Ausgänge rechts, Schnüre dazwischen; oben Szenenname, rechts oben Status (Netz, Knoten verbunden, Ruhezustand blockiert).
|
|
|
2. **Ausgabe-Fenster:** randloses Vollbild je Bildschirm; optional dezente Statuszeile nur für die Regie.
|
|
|
3. **Ton:** Kanalzüge je Ausgangskanal mit Pegel, Gain, Mute; Sprechtaste groß unten rechts.
|
|
|
4. **Einstellungen:** Schnittstellen (Technik/Klinik), Audio-Gerät, Startverhalten.
|
|
|
|
|
|
## App-Icon (Idee)
|
|
|
|
|
|
Eine Indigo-Schnur, die einen einfachen Knoten um ein kleines, abgerundetes Bildschirm-Rechteck bildet, auf Sumi-Grund. Kein Text.
|
