134 lines
5.6 KiB
Markdown
134 lines
5.6 KiB
Markdown
# Melo 1.0 – Code-Audit & Design-Review
|
||
**Datum:** 26.07.2026
|
||
**Repo:** `/home/dustin/git/melo_app/` (27 Dart-Dateien, v2.7 laut Logger)
|
||
|
||
---
|
||
|
||
## 🔴 TOTE BUTTONS (führen zu nichts oder zum falschen Ziel)
|
||
|
||
### 1. BottomNavigationBar – 3 von 5 Tabs defekt!
|
||
**Datei:** `lib/screens/home_screen.dart` Zeile 367–371
|
||
|
||
| Tab | Label | Was passiert | Sollte passieren |
|
||
|-----|-------|-------------|------------------|
|
||
| 🎵 Musik | Index 0 | ✅ Home-Screen | ✅ richtig |
|
||
| ⬇ Downloads | Index 1 | ✅ DownloadScreen | ✅ richtig |
|
||
| 🏷️ Tags | Index 2 | ❌ öffnet **PlaylistSheet**! | Sollte nach Tags filtern o. Tag-Manager zeigen |
|
||
| ❤️ Favoriten | Index 3 | ❌ öffnet **PlaylistSheet**! | Sollte favorisierte Songs filtern |
|
||
| ⚙️ Einstellungen | Index 4 | ❌ **KEIN Handler** – tut gar nichts! | Sollte Einstellungen-Seite zeigen |
|
||
|
||
```dart
|
||
// Aktueller Code (defekt):
|
||
onTap: (i) {
|
||
setState(() => _aktiverTab = i);
|
||
if (i == 2) _zeigePlaylistSheet(); // FALSCH: Tags → Playlists
|
||
if (i == 3) _zeigePlaylistSheet(); // FALSCH: Favoriten → Playlists
|
||
// i == 4 → KEIN Code! Einstellungen-Tab tot.
|
||
},
|
||
```
|
||
|
||
### 2. Auskommentierte Widgets (Features existieren, sind aber deaktiviert)
|
||
**Datei:** `lib/screens/home_screen.dart` Zeile 272–291
|
||
|
||
- **RecentWidget** (Zeile 273): `// RecentWidget(songs: _vm.letzteSongs, onPlay: _vm.spieleSong),`
|
||
- Zeigt "Zuletzt gehört" – Code existiert in `lib/widgets/recent_widget.dart`, korrekt implementiert
|
||
|
||
- **TagStatsWidget** (Zeile 290): `// TagStatsWidget(tagCounts: _vm.tagCounts),`
|
||
- Zeigt Tag-Häufigkeiten farbcodiert – Code existiert in `lib/widgets/tag_stats_widget.dart`, korrekt implementiert
|
||
|
||
### 3. Alle anderen Buttons ✅ intakt
|
||
- MeloHeader (Cloud/Suche/Download): alle 3 funktional
|
||
- SongTile (Edit/Favorit/Playlist/Play): alle funktional
|
||
- MiniPlayer (Play/Pause/Skip): alle funktional
|
||
- DownloadScreen (Ordner/Download/Abbrechen): alle funktional
|
||
- PlaylistSheet (Neu/Öffnen/Löschen): alle funktional
|
||
- NavidromeBrowser (Verbinden/Alben/Stream/Download): alle funktional
|
||
|
||
---
|
||
|
||
## 🎨 DESIGN-ANALYSE & VERSCHÖNERUNGSVORSCHLÄGE
|
||
|
||
### Aktuelles Design (Bestandsaufnahme)
|
||
- **Farbschema:** Dark Theme – Schwarz `#0D0D0D`, Dunkelgrau `#1A1A1A`/`#2A2A2A`, Rot `#CC0000` als Akzent
|
||
- **Typografie:** System-Standardschrift, keine Custom-Font. Nur Größen-Variation (9-28px).
|
||
- **Layout:** Standard-Material mit BottomNavigationBar, ListView, Cards
|
||
- **Rundungen:** Konsistent 8-14px Border-Radius
|
||
- **Icons:** Material Icons, teils mit Emoji (♪, 💿, 🎵, 💌)
|
||
- **Animationen:** Nur implizit (FAB, BottomSheet); keine expliziten
|
||
|
||
### 🔥 Top 10 Verschönerungs-Maßnahmen (priorisiert)
|
||
|
||
#### 1. **Custom-Schriftart** – Höchste Wirkung, geringer Aufwand
|
||
- Schriftart wie **Inter** oder **Poppins** via `google_fonts` einbinden
|
||
- Sofort moderneres, hochwertigeres Look & Feel
|
||
- `pubspec.yaml` → `google_fonts: ^6.1.0`
|
||
|
||
#### 2. **Glassmorphism-Effekte**
|
||
- MiniPlayer + StatistikCard mit `BackdropFilter` + `blur`
|
||
- Transparenter, schwebender Look statt flache Container
|
||
- `ClipRRect` mit `BackdropFilter(brightness: 0.2, saturation: 0.3)`
|
||
|
||
#### 3. **Subtiler Hintergrund-Gradient**
|
||
- Statt `MeloTheme.schwarz` ein radialer Gradient von `#1A0505` nach `#0D0D0D`
|
||
- Gibt Tiefe, wirkt weniger "flach"
|
||
|
||
#### 4. **Song-Tiles mit Swipe-Gesten**
|
||
- Swipe links → Favorit toggeln
|
||
- Swipe rechts → Zur Playlist hinzufügen
|
||
- `flutter_slidable` Package
|
||
|
||
#### 5. **Skeleton-Loader / Shimmer**
|
||
- Statt `CircularProgressIndicator` beim Laden
|
||
- Placeholder-Karten mit `shimmer`-Animation
|
||
- Wirkt professioneller, weniger "Lade-Unterbrechung"
|
||
|
||
#### 6. **Hero-Animationen**
|
||
- MiniPlayer → Vollbild-Player mit fließendem Übergang
|
||
- Album-Cover als Hero-Widget
|
||
|
||
#### 7. **Leere-Zustände mit Icons/Illustration**
|
||
- "Noch keine Playlists" → mit großer Illustration + CTA-Button
|
||
- "Keine Treffer" → Such-Illustration
|
||
- Statt reinem Text
|
||
|
||
#### 8. **Animierte Tab-Indikatoren**
|
||
- BottomNavBar mit animiertem Indikator-Balken oder Dot
|
||
- Sanfte Farbverläufe beim Wechseln
|
||
|
||
#### 9. **Pull-to-Refresh** auf Song-Liste
|
||
- `RefreshIndicator` um die ListView
|
||
- Neu-Scannen per Wischgeste
|
||
|
||
#### 10. **Farbcodierte Fortschrittsbalken**
|
||
- Fortschritt farblich codieren (grau→gelb→grün bei Download-Fortschritt)
|
||
- Statt einfachem roten Balken
|
||
|
||
### Farbpaletten-Erweiterung (Vorschlag)
|
||
```dart
|
||
// Zusätzlich zu bestehenden Farben:
|
||
static const Color rotGlow = Color(0x40CC0000); // für Glow-Effekte
|
||
static const Color surfaceHell = Color(0xFF252525); // für Hover/Active
|
||
static const Color erfolg = Color(0xFF4CAF50); // Grün-Akzent
|
||
static const Color warnung = Color(0xFFFFC107); // Gelb-Akzent
|
||
```
|
||
|
||
### Auch interessant (niedrigere Priorität)
|
||
- **Waveform-Animation** im MiniPlayer (statt statischem Balken)
|
||
- **Konfetti-Effekt** nach erfolgreichem Download
|
||
- **Haptisches Feedback** bei Button-Taps (`HapticFeedback.lightImpact()`)
|
||
- **Dark-Mode-Only** mit OLED-optimiertem `#000000` für echte Schwarztöne
|
||
- **BottomSheet mit Drag-Handle** schon vorhanden → schön!
|
||
|
||
---
|
||
|
||
## 📊 Zusammenfassung
|
||
|
||
| Kategorie | Befund |
|
||
|-----------|--------|
|
||
| Tote Buttons | **3 von 5 Tabs defekt** – Tags/Favoriten öffnen Playlists, Einstellungen tut nichts |
|
||
| Deaktivierte Widgets | RecentWidget + TagStatsWidget auskommentiert, Code intakt |
|
||
| Sonstige Buttons | Alle intakt ✅ |
|
||
| Design-Level | Solide Basis, Material 3 Dark Theme, konsistent |
|
||
| Größtes Manko | Keine Custom-Schriftart, flache Container, keine Animationen |
|
||
| Schnellster Gewinn | Custom Font + Glassmorphism + Gradient-Hintergrund |
|