markdown is king, find a way around it
This commit is contained in:
@@ -0,0 +1,71 @@
|
||||
# Design-System: Maschinen-Instanzen (Project X Tribut)
|
||||
|
||||
Dieses Dokument definiert die Erweiterung des Farbschemas aus `game_miner4_design.md` in ein modulares UI- und Grafik-Konzept für Webanwendungen und HTML5-Canvas-Umgebungen.
|
||||
|
||||
## 1. Die Semantische Farb-Hierarchie (Erweitert)
|
||||
|
||||
Wir nutzen die Farben nicht nur zur Dekoration, sondern als Informations-Layer.
|
||||
|
||||
| Farbe | Hex | Verwendung in UI & HUD |
|
||||
|---------|---------|---------|
|
||||
| **Deep Void** | `#05070a` | Globaler Background, Layer-Tiefe (negativ) |
|
||||
| **Terminal Base** | `#0b0e14` | Panel-Backgrounds, aktive Inhaltsbereiche |
|
||||
| **Tech Cyan** | `#00f2ff` | Primäre UI-Interaktion, aktiver Pfad, Schild-Status |
|
||||
| **Amber Gold** | `#ffb700` | Warnungen, Missionsziele, Gold-Ressourcen |
|
||||
| **Critical Red** | `#ff3e3e` | Gegner-Marker, kritische Zustände, Stopp-Buttons |
|
||||
| **Harvest Green** | `#00ff73` | Erfolg, Auffüllen, freundliche Interaktion |
|
||||
| **Steel Grey** | `#888899` | Inaktive Elemente, Rahmen, nicht-interaktive Text-Daten |
|
||||
|
||||
## 2. Visuelle Identität (Concept Art & HUD)
|
||||
|
||||
### 2.1 Typografie
|
||||
|
||||
Verwende ausschließlich Monospace-Fonts, um den Terminal-Look zu unterstreichen.
|
||||
|
||||
1. **Font-Familien:** *JetBrains Mono*, *Fira Code* oder *Courier Prime*.
|
||||
2. **Stil:** Kleinbuchstaben für Beschriftungen, **fettgedruckt** für Statusmeldungen.
|
||||
3. **Lesbarkeit:** Leichter Zeilenabstand (`1.4em`), dezente Text-Schatten bei Glow-Effekten.
|
||||
|
||||
### 2.2 HUD-Elemente (Canvas)
|
||||
|
||||
1. **Glitch-Effekte:** Kurze, pulsierende farbige Linien (Tech Cyan) am Rand von Canvas-Elementen.
|
||||
2. **Scan-Lines:** Ein transparenter Overlay-Layer (`rgba(255, 255, 255, 0.03)`) mit horizontalen Scan-Linien über dem gesamten Spielfeld.
|
||||
3. **Rahmen:** Keine abgerundeten Ecken (oder nur extrem minimale `2px`). Stattdessen eckige Klammern (`[ ]`) an den Ecken aktiver Panels.
|
||||
|
||||
## 3. UI-Komponenten für Webanwendungen
|
||||
|
||||
### 3.1 Buttons & Interaktion
|
||||
|
||||
1. **Normal:** Rand `1px` Steel Grey, Hintergrund transparent, Text Steel Grey.
|
||||
2. **Hover:** Rand `1px` Tech Cyan, Glow-Effekt (`box-shadow: 0 0 8px #00f2ff`), Text Tech Cyan.
|
||||
3. **Active:** Hintergrund Tech Cyan, Text Deep Void.
|
||||
|
||||
### 3.2 Panels & Container
|
||||
|
||||
1. Verwende `backdrop-filter: blur(4px)` auf `Terminal Base`.
|
||||
2. Rahmen immer `1px` hart, keine Schatten, außer für schwebende Overlays. Diese benötigen einen sehr harten, dunklen Schatten.
|
||||
|
||||
## 4. Grafik-Asset-Regeln (Asset Pipeline)
|
||||
|
||||
1. **Minimalismus:** Keine Verläufe (Gradients). Nutze klare Trennung von Primärfarben.
|
||||
2. **Vektor-Stil:** Alle Icons sollten als scharfe SVGs ohne weiche Kanten umgesetzt werden.
|
||||
3. **Lichtquellen:** Wenn Lichteffekte benötigt werden, nutze einen harten Glow (kein sanftes Auslaufen).
|
||||
|
||||
## 5. Umsetzung in HTML/JS (CSS-Variablen Beispiel)
|
||||
|
||||
```css
|
||||
:root {
|
||||
--bg-deep: #05070a;
|
||||
--bg-panel: #0b0e14;
|
||||
--accent-cyan: #00f2ff;
|
||||
--accent-amber: #ffb700;
|
||||
--accent-red: #ff3e3e;
|
||||
--text-dim: #888899;
|
||||
}
|
||||
|
||||
.panel {
|
||||
background-color: var(--bg-panel);
|
||||
border: 1px solid var(--text-dim);
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
color: var(--text-dim);
|
||||
}
|
||||
@@ -0,0 +1,103 @@
|
||||
# REVERSE GAME DESIGN DOCUMENT (GDD)
|
||||
|
||||
**Projekt:** Maschinen-Instanzen – Asteroiden-Sektor (Project X Tribut)
|
||||
|
||||
**Version:** 1.0.0
|
||||
**Genre:** Hard-Sci-Fi / Retro-Shmup (2.5D)
|
||||
**Setting:** Das „Computer Historyz“-Universum (Sektor: Oortsche Wolke 42)
|
||||
|
||||
## 1. Vision & Kernkonzept
|
||||
|
||||
Ein endloses, horizontales Shoot-'em-up in 2D, das innerhalb einer echten 3D-Umgebung gerendert wird.
|
||||
|
||||
Der Spieler steuert eine kybernetische Ernte-Instanz (Bergbau-Schiff), die am Rand eines gigantischen, planetengroßen Maschinen-Ansaugstutzens operiert.
|
||||
|
||||
Das Spiel kombiniert rasante Arcade-Asteroiden-Zerstörung mit taktischem Power-Routing (Energie-Management) unter harten Hard-Sci-Fi-Rahmenbedingungen.
|
||||
|
||||
## 2. Globale Farbpalette & Ästhetik
|
||||
|
||||
Diese Farbpalette definiert das visuelle Leitbild für alle zukünftigen Spiele in diesem Universum, unabhängig davon, ob sie als Pixel-Art-, Vektor- oder PBR-basierte 3D-Titel umgesetzt werden.
|
||||
|
||||
### 2.1 UI-, HUD- und Terminal-Farben (Window-Maker-Stil)
|
||||
|
||||
Die Benutzeroberfläche basiert auf dem kalten, funktionalen Look klassischer Unix-Terminals, kombiniert mit modernen Glow-Effekten.
|
||||
|
||||
| Farbe | Hex-Code | Semantischer Nutzen |
|
||||
|---------|---------|---------|
|
||||
| Deep Void | `#05070a` | Globaler Weltraum-Hintergrund, tiefste Schatten. |
|
||||
| Terminal Base | `#0d1117` | Hintergrund für Menüs, HUD-Panels und Dialogfenster. |
|
||||
| Panel Border | `#444c56` | Rahmen von UI-Fenstern, häufig kombiniert mit inneren Highlights für 3D-Bevel-Effekte. |
|
||||
| Tech Cyan | `#58a6ff` | Primäre Akzentfarbe. Standard-Text, normale Laser, Hologramme, aktiver Schild (HP > 60 %) und UI-Glow. |
|
||||
| Harvest Green | `#39d353` | Erfolgs-Feedback, gesammelte Ressourcen und Laser-Stufe 2. |
|
||||
| Amber Gold | `#d29922` | Warnungen, Highscores, wertvolle Materialien, Schild (HP < 60 %) und Laser-Stufe 3. |
|
||||
| Critical Red | `#f85149` | Lebensgefahr, kritischer Schild (HP < 30 %), Triebwerks-Exhaust und Laser-Stufe 4+. |
|
||||
|
||||
### 2.2 Materialfarben (3D-Modelle und 2D-Sprites)
|
||||
|
||||
Für gerenderte 3D-Objekte und gezeichnete 2D-Sprites gelten folgende Materialdefinitionen:
|
||||
|
||||
| Element | Farbe | 3D-Eigenschaften (PBR) | 2D-Eigenschaften |
|
||||
|---------|---------|---------|---------|
|
||||
| Maschinen-Hülle | `#1f6feb` (Blau-Metallic) | Roughness: 0.4, Metalness: 0.8 | Satte dunkle Blautöne mit hartem weißen Specular-Highlight |
|
||||
| Triebwerke / Rohre | `#21262d` (Dunkelgrau) | Roughness: 0.9, Metalness: 1.0 | Nahezu schwarze Flächen mit hohem Kontrast |
|
||||
| Eis-Asteroid | `#d0e8ff` (Blass-Eisblau) | Roughness: 0.9, Metalness: 0.1 | Helle Töne, geringe Schattenbildung, weiße Staubpartikel |
|
||||
| Fels-Asteroid | `#6b4a31` (Braun) | Roughness: 1.0, Metalness: 0.1 | Matte, strukturierte und körnige Oberflächen |
|
||||
| Eisen-Asteroid | `#888899` (Grau/Silber) | Roughness: 0.3, Metalness: 0.9 | Spiegelnde Oberflächen mit deutlich sichtbaren Glanzlichtern |
|
||||
|
||||
## 3. Gameplay & Mechaniken
|
||||
|
||||
### 3.1 Das Plasma-Blasen-Paradoxon (Movement)
|
||||
|
||||
1. **Lore-Hintergrund:**
|
||||
Das Schiff erzeugt ein Magnetfeld zum Sammeln von Weltraumstaub. Dadurch entsteht eine künstliche Atmosphäre im Vakuum.
|
||||
|
||||
2. **Mechanik:**
|
||||
Das Schiff wird aerodynamisch gesteuert. Es fliegt nicht auf festen Schienen, sondern neigt sich beim Steigen und Sinken entlang einer simulierten Roll-/Yaw-Bewegung.
|
||||
|
||||
3. **Feedback:**
|
||||
Die Plasma-Blase pulsiert visuell. Mit steigender Schildenergie wächst ihre Größe von 0.6× bis 1.5× der Schiffsausdehnung.
|
||||
|
||||
### 3.2 Taktisches Power-Routing (Energie-Management)
|
||||
|
||||
Die zentrale Hard-Sci-Fi-Mechanik basiert auf zwei Ressourcen:
|
||||
|
||||
- **Schild (Defensive)**
|
||||
- **Laser / Score (Offensive)**
|
||||
|
||||
Der Spieler kann Energie in Echtzeit zwischen beiden Systemen umverteilen.
|
||||
|
||||
1. **Schild laden (Defensive):**
|
||||
Der Spieler opfert Score beziehungsweise Laserstufen, um den Schild wiederherzustellen.
|
||||
|
||||
2. **Laser pushen (Offensive):**
|
||||
Energie wird dem Schild entzogen und in die Waffensysteme umgeleitet.
|
||||
|
||||
3. **Visuelle Regel:**
|
||||
Dieses Risiko-Belohnungs-System muss in jeder Umsetzung über die Farbskala von `Tech Cyan` bis `Critical Red` dargestellt werden.
|
||||
|
||||
### 3.3 Asteroiden-Split-Physik & Materialklassen
|
||||
|
||||
Gegnerische Asteroiden teilen sich beim Zerstören in zwei kleinere und schnellere Fragmente.
|
||||
|
||||
1. **Eis (Level 1-2):**
|
||||
1× Basis-HP. Schnell, aber äußerst fragil.
|
||||
|
||||
2. **Gestein (Level 2-4):**
|
||||
2× Basis-HP. Standardgegner.
|
||||
|
||||
3. **Eisen (Level 3-5):**
|
||||
4× Basis-HP. Massive Brocken mit dreifachem Scorewert. Schwache Laser werden vollständig blockiert.
|
||||
|
||||
### 3.4 Das Cylon-Recovery-System (Game Over / Respawn)
|
||||
|
||||
1. **Mechanik:**
|
||||
Es existiert kein endgültiger Tod. Beim Verlust der Hülle wird das Speicherabbild gesichert.
|
||||
|
||||
2. **Ablauf:**
|
||||
Das Spiel pausiert.
|
||||
|
||||
Ein Diagnostik-Terminal meldet:
|
||||
|
||||
```text
|
||||
DIAGNOSTICS
|
||||
Hull Destroyed
|
||||
Reference in New Issue
Block a user