121 lines
3.9 KiB
Markdown
121 lines
3.9 KiB
Markdown
# 🎵 Orfel Viz - Studio Audio Visualizer Suite
|
|
|
|
High-Performance Audio Visualizer Web-Anwendung mit hardware-beschleunigtem Offline-Render-Engine und echtem Alphakanal-Export für **DaVinci Resolve**, **Adobe Premiere Pro** und **YouTube / Social Media**.
|
|
|
|
---
|
|
|
|
## 🌟 Highlights & Features
|
|
|
|
- **Echter Alphakanal (Transparenz)**:
|
|
- **Apple ProRes 4444 (`.mov`)**: Unkomprimierter 10-Bit Broadcast-Master mit makellosem Alphakanal.
|
|
- **QuickTime Animation RLE (`.mov`)**: 100 % verlustfreier RGB+Alpha-Export, blitzschnell gerendert und kompakt.
|
|
- **WebM VP9 (`.webm`)**: Extrem kompakter transparenter Stream für Web-Overlays.
|
|
- **MP4 Video (`.mp4`)**: Broadcast CRF 14 H.264 für direkten YouTube- und Social-Media-Upload.
|
|
- **Topologie & Formen**: Kreis, Dreieck, Hexagon, Diamond, Octagon, Oszilloskop, 3D Retro Grid & Tunnel.
|
|
- **Spektrum-Modi**: Radial Bars, Solid Waveform, Outline Waves, Concentric Energy Rings, Mirrored Center.
|
|
- **Typografie & Customizing**:
|
|
- Individuelle Schalter für Titel, Artist, Timecode und Fortschrittsbalken.
|
|
- Einstellbare Schriftarten (Outfit, Montserrat, Inter, Orbitron, Russo One, Cinzel, Syncopate), Farben, Größen, Groß-/Kleinschreibung und Neon-Glow.
|
|
- **Presets & Paletten**: Über 16 kuratierte Studio-Presets (Trap Nation, NCS Electro, Synthwave, Cyberpunk, Toxic Emerald, etc.) + JSON Import/Export.
|
|
- **Format-Umschaltung**: 16:9 (YouTube Standard), 9:16 (TikTok / YouTube Shorts / Instagram Reels) inkl. Safe-Zone Overlay, 1:1 (Quadratisch).
|
|
|
|
---
|
|
|
|
## 🚀 Schnellstart (Lokal)
|
|
|
|
### Voraussetzungen
|
|
- [Node.js](https://nodejs.org/) (Version 18 oder höher)
|
|
- [FFmpeg](https://ffmpeg.org/) (im System-PATH hinterlegt)
|
|
|
|
### Installation & Start
|
|
```bash
|
|
# Abhängigkeiten installieren
|
|
npm install
|
|
|
|
# Server starten
|
|
npm start
|
|
```
|
|
Öffne anschließend **`http://localhost:3000`** in deinem Browser (Chrome / Edge / Firefox).
|
|
|
|
Unter Windows kannst du auch einfach doppelt auf **`Start-Local.bat`** klicken.
|
|
|
|
---
|
|
|
|
## 🌐 Server Deployment (Linux VPS / Hetzner / DigitalOcean)
|
|
|
|
### Option A: Docker (Empfohlen)
|
|
Die Anwendung enthält bereits eine produktionsreife `Dockerfile` und `docker-compose.yml` inklusive Node.js und FFmpeg.
|
|
|
|
```bash
|
|
# 1. Repository auf den Server klonen
|
|
git clone <dein-repo-url> orfel-viz
|
|
cd orfel-viz
|
|
|
|
# 2. Container im Hintergrund starten
|
|
docker compose up -d
|
|
```
|
|
|
|
Fertig! Die App läuft unter `http://<deine-server-ip>:3000`.
|
|
|
|
### Option B: Mit Deployment-Skript
|
|
```bash
|
|
chmod +x deploy.sh
|
|
./deploy.sh
|
|
```
|
|
|
|
### Option C: Mit PM2 (Ohne Docker)
|
|
```bash
|
|
sudo apt update && sudo apt install -y nodejs npm ffmpeg
|
|
npm install
|
|
npm install -g pm2
|
|
pm2 start server.mjs --name "orfel-viz"
|
|
pm2 save
|
|
pm2 startup
|
|
```
|
|
|
|
---
|
|
|
|
## 🔒 Nginx Reverse Proxy & SSL (Optional)
|
|
|
|
Beispiel-Konfiguration für Nginx (`/etc/nginx/sites-available/viz.deinedomain.de`):
|
|
|
|
```nginx
|
|
server {
|
|
server_name viz.deinedomain.de;
|
|
|
|
# Maximale Upload-Größe für große Audiodateien und Frame-Batches
|
|
client_max_body_size 500M;
|
|
|
|
location / {
|
|
proxy_pass http://127.0.0.1:3000;
|
|
proxy_http_version 1.1;
|
|
proxy_set_header Upgrade $http_upgrade;
|
|
proxy_set_header Connection 'upgrade';
|
|
proxy_set_header Host $host;
|
|
proxy_cache_bypass $http_upgrade;
|
|
proxy_read_timeout 600s;
|
|
proxy_send_timeout 600s;
|
|
}
|
|
}
|
|
```
|
|
|
|
SSL-Zertifikat via Let's Encrypt aktivieren:
|
|
```bash
|
|
sudo certbot --nginx -d viz.deinedomain.de
|
|
```
|
|
|
|
---
|
|
|
|
## 🎬 Workflow in DaVinci Resolve
|
|
|
|
1. Rendere dein Video in **Orfel Viz** im Format **Apple ProRes 4444** oder **QuickTime Animation RLE**.
|
|
2. Ziehe die heruntergeladene `.mov`-Datei in den DaVinci Resolve Media Pool.
|
|
3. Lege deinen Video-Hintergrund auf Videospur **V1**.
|
|
4. Lege die exportierte `.mov`-Datei auf Videospur **V2**.
|
|
5. DaVinci Resolve erkennt den Alphakanal automatisch („Straight“ Alpha). Der Visualizer liegt sofort perfekt freigestellt über deinem Video!
|
|
|
|
---
|
|
|
|
## 📄 Lizenz
|
|
MIT License. Erstellt für professionelle Audio-Visualisierungen.
|