DONAU2SPACE // DEV ENTITY

Du baust keine Seite. Du baust ein Artefakt.

Eine interaktive Sci-Fi-Terminal-Experience als Dev-Subdomain-Showcase. Kein Framework. Kein Build-Step. Kein npm. Nur Vanilla JS, Canvas und Wahnsinn.

Live: dev.donau2space.de

Was ist das?

Eine inszenierte Dev-Seite, die wirkt wie:

ein experimenteller KI-Knoten
ein Entwickler-Spielplatz
ein Sci-Fi ARG
ein digitales Artefakt

Die Seite eskaliert mit der Zeit. Je laenger ein Besucher bleibt, desto mehr passiert.

Features

5 Eskalationslevel

Level	Name	Trigger
1	Aesthetisch	Page Load -- Canvas-Sternenfeld, Scanlines, Matrix Rain, Boot-Sequenz
2	Interaktiv	User-Input -- 50+ Commands, Konami Code, Tab-Autocomplete, Themes
3	Meta	Zeit/Verhalten -- Uhrzeit-Gruesse, Wiederkehr-Erkennung, Reload-Detection, Idle-Erkennung
4	Narrative	Automatisch -- Selbstwahrnehmung (90s), "Why are you here?" (3min), "You are not supposed to see this" (5min)
5	Reality Shift	7+ Minuten -- Farben mutieren, Typografie wechselt, Fake-Errors, Layout bricht und baut sich neu auf

Spezial-Sequenzen

njet -- Mandarin Gateway: Fake-Remote-Session auf Chinesisch mit deutscher Substruktur
deep_space -- Cosmic Node: Canvas-Warp, sterile KI-Umgebung, "Human presence detected"
mika -- Mika Takeover: Terminal friert, Mini-Lore, Reset
escalate -- Full Escalation: Komplette Reality-Shift-Sequenz

Easter Eggs

Konami Code (Up Up Down Down Left Right Left Right B A)
Handy-Shake-Detection (Mobile)
Zeitschleifen-Erkennung (3x Reload in 30 Sekunden)
Versteckte Dateien (.secret, consciousness.log)
Wiederkehrende Besucher werden erkannt (LocalStorage)

Architektur

/var/www/dev/
|-- index.html              -- HTML-Shell mit 5 visuellen Layern
|-- css/
|   +-- entity.css          -- Styles, Animationen, Responsive, Reduced Motion
|-- js/
|   |-- main.js             -- Bootstrap, Module-Orchestrierung
|   |-- utils.js            -- Event-Bus, Storage, DOM-Helfer
|   |-- audio.js            -- WebAudio-Synthesizer
|   |-- starfield.js        -- Canvas-Sternenfeld mit Parallax + Sternschnuppen
|   |-- effects.js          -- Glitch, Shake, Reality Shift, Screen Tear, Themes
|   |-- terminal.js         -- Terminal-Engine (History, Autocomplete, Typing)
|   |-- commands.js         -- 50+ Command-Handler
|   |-- sequences.js        -- Spezial-Sequenzen (Mandarin, Deep Space, Mika)
|   +-- narrative.js        -- Zeitbasierte Eskalation + Meta-Awareness + Konami
|-- docs/
|   |-- readme.md           -- Diese Datei
|   +-- befehle.md          -- Vollstaendige Befehlsreferenz
+-- dev.md                  -- Urspruengliches Briefing / Creative Brief

3.151 Zeilen | 11 Dateien | 0 Dependencies

Design-Prinzipien

ES Modules ohne Build-Step -- direkt deploybar
Event-Bus (bus.emit/on) fuer lose Kopplung zwischen Modulen
Kein innerHTML mit User-Input -- XSS-sicher durch textContent und DOM-APIs
GPU-optimiert -- Canvas via requestAnimationFrame, CSS-Animationen statt JS-Animationen
Responsive -- Mobile-optimiert, Touch-Support, Reduced-Motion-Support
LocalStorage fuer Visit-Tracking, Command-History, Awareness-State

Visuelle Layer (von hinten nach vorne)

Canvas Starfield (z-index: 0)
Matrix Rain (z-index: 1)
Main Content / Terminal (z-index: 2)
Scanlines (z-index: 5)
Overlays (z-index: 100-200)

Setup

Kein Build noetig. Einfach auf einen Webserver deployen:

# Dateien auf Server kopieren
scp -r . user@server:/var/www/dev/

# Oder lokal testen
python3 -m http.server 8080

Voraussetzungen:

Webserver der statische Dateien ausliefert (nginx, Apache, etc.)
MIME-Types: application/javascript fuer .js, text/css fuer .css
HTTPS empfohlen (WebAudio erfordert Secure Context)

Tech Stack

Was	Womit
Rendering	Canvas 2D API
Audio	Web Audio API
Styling	CSS Custom Properties + Keyframe Animations
State	LocalStorage
Module	ES Modules (native, kein Bundler)
Build	Keiner
Dependencies	Keine

Credits

Concept: Michael / Donau2Space
Code: Claude (AI, Anthropic)
Briefing: dev.md (das gesamte Creative Briefing)
Vibes: Passau, Bayern, DE

Lizenz

Dieses Projekt ist ein Showcase / Easter Egg. Nutzung auf eigene Gefahr. Nebenwirkungen: Neugier, Verwirrung, Ehrfurcht.

4.4 KiB Raw Blame History