update

design.md

@@ -0,0 +1,92 @@
+# Design von Dinger
+
+Stand: September 2026. Kein Enddesign, sondern die Richtung mit umgesetztem Entwurf.
+
+## Woran wir uns orientieren
+
+- **Hearthstone** – Kosten und Werte springen aus dem Kartenrahmen (Kristall oben links, Angriff
+  und Leben in Kreisen unten), der Name liegt auf einem Band über die volle Breite, Text bleibt
+  kurz. Auf dem Brett: eigene Seite unten, Gegner oben, Verlauf links, Zug beenden rechts, Wesen
+  als kompakte Kacheln statt voller Karten. Zugbeginn und Kartenzüge werden angesagt.
+- **Teamfight Tactics** – der Laden ist eine Reihe von fünf großen Karten unten, Neuwürfeln steht
+  mit seinem Preis direkt daneben, die Bank (bei uns die Hand) liegt als schmale Reihe darüber.
+  Der Laden zeigt an, was zum eigenen Brett passt (bei uns: „+n“ und die Feldkombo).
+- **Pokémon TCG** – Seltenheit ist Optik: Folienglanz, Funkeln, Schillern. Werte und Symbole
+  statt Sätze.
+- **Allgemeine Regeln für Kartenspiel-Oberflächen** (GDKeys, Medium): klar getrennte Zonen,
+  Lesefluss von links (Vergangenheit) über die Mitte (Spiel) nach rechts (Zukunft), die eigene
+  Seite größer als die der Gegner, Zahlen groß, Text klein, Symbole statt Wörter, und Rückmeldung
+  für jede Aktion (Bewegung, Ton, kurzes Zittern).
+
+## Karte
+
+- Kostenkristall oben links, Bild (Elementsymbol) oben, Namensband auf 36 % Höhe, darunter
+  Schlüsselwörter als Symbole (Mauer = Wächter, Schild, Doppelpfeil = Flink, gekreuzte Klingen =
+  Doppelschlag), dann der Effekttext ohne Einleitung, unten Angriff (gelb) und Leben (rot) als
+  Kreise, dazwischen der Edelstein der Stufe.
+- Große Karten (Vorschau, Sammlung, Booster) schreiben das Wort neben das Symbol und die
+  Überschrift „Beim Ausspielen“ über den Effekt. Kleine Karten zeigen nur Symbole.
+- Handkacheln (96×62) sind flach: Kosten, Name, Werte, Symbole oder das Kombo-Schild. Details
+  kommen aus der schwebenden Vorschau.
+- Seltenheit: gewöhnlich schlicht; selten Rahmen, Schein, Edelstein, stehender Lichtstreifen;
+  episch wandernder Lichtstreifen; legendär Funkeln; mythisch schillernde Farben.
+- Der Kartentext in Daten und Sammlungssuche bleibt vollständig (`Card.text()`), die Karte
+  zeichnet nur `effect_text()`.
+
+## Kampfbildschirm (1280×800)
+
+Nur, was gerade zählt, ist zu sehen. Von unten nach oben:
+
+- **Laden** als fünf große Karten, links daneben „Neu würfeln“ mit Preis, rechts „Zug beenden“.
+- **Hand** als flache Kacheln (die Bank), für andere verdeckt.
+- **Eigenes Brett** mit fünf sichtbaren Plätzen, färbt sich mit dem aktiven Feld; links daneben
+  die eigene Leiste (Leben, Mana, Einkommen, Zug), rechts „Verschmelzen“ und „Rückgängig“, nur
+  wenn sie gerade möglich sind.
+- **Feldband** mit vier Ladepunkten je Element.
+- **Gegner** oben in der Mitte mit seinem Brett in voller Größe. Das Spiel ist ein Duell wie
+  Hearthstone: mehr als zwei Bretter passen nicht lesbar auf einen Bildschirm, und ein Gegner
+  macht Ziele, Texte und Balance eindeutig.
+- **Vorschau** schwebt neben der Karte, auf die man zeigt (über Ladenkarten), mit Resonanz, Feld
+  und Feldkombo darunter.
+- **Verlauf** und **Aufgeben** als kleine Knöpfe oben links; der Verlauf öffnet als Überlagerung.
+- Hand- und Ladenkarten tragen „+n“ (Bonus auf dem Brett) und das Kombo-Schild; beim Zeigen ist
+  der Partner auf dem Brett markiert; beim Angreifen steht der Elementkonter (+1/−1) am Ziel.
+- Wesen mit gleichem Element sind unter der Reihe verbunden (Resonanz).
+
+## Bewegung und Ton
+
+- Zugbeginn: Band „Dein Zug“ quer über die Mitte, Laden wird ausgeteilt, Ton.
+- Kaufen: die Karte fliegt aus dem Laden auf die Hand, Münzton.
+- Ausspielen: die Kachel fliegt von der Hand auf ihren Platz und federt ein.
+- Angriff: Ausfallschritt, roter Rahmen am Ziel, kurzes Zittern des Bretts, Schadenszahl.
+- Feldwechsel: Band in Elementfarbe, das Brett färbt sich.
+- Karten heben sich beim Zeigen an, Knöpfe federn beim Drücken, Bildschirme blenden ein.
+- Booster: Karten drehen sich auf, seltene Stufen blitzen in ihrer Farbe auf.
+- Alles hängt an der Einstellung „Animationen“.
+
+## Menüs
+
+- Hauptmenü: Titel und drei Spielarten links, darunter Booster, Sammlung, Einstellungen,
+  Beenden; rechts drei Karten der Sammlung (höchste Stufen zuerst) als Schaufenster; Münzen und
+  Staub oben rechts.
+- Unterbildschirme: Titel links oben, „Zurück“ rechts oben, Inhalt darunter.
+- Kampagne als Pfad mit zehn Stationen je Kapitel, die nächste pulsiert; darunter die gewählte
+  Stufe mit Gegner, Leben, Belohnung und Merkmalen. Die Bosse werden über Leben und Merkmale
+  stärker, nicht über Begleiter.
+- Sammlung: sechs Spalten, aufgewertete Karten zuerst, rechts die große Vorschau.
+
+## Offen
+
+- Bilder statt Elementsymbolen, wenn es einmal Kartenkunst gibt.
+- Hero-Porträts für Kampagnenbosse.
+- Ein Tisch mit mehreren Spielern ließe sich als TFT-Rotation obendrauf setzen: jede Runde ein
+  anderer Gegner, das Brett bleibt.
+
+## Quellen
+
+- https://hearthstone.wiki.gg/wiki/Battlefield
+- https://hearthstone.fandom.com/wiki/Card
+- https://moirao.me/home/tft-ui
+- https://gdkeys.com/the-card-games-ui-design-of-fairtravel-battle/
+- https://medium.com/@acbassettone/5-ux-ui-lessons-from-designing-a-card-game
+- https://hackread.com/the-juice-factor-designing-game-feel/