yvg/pounce
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Update architecture documentation

Browse Source
This commit is contained in:
yves.gugger
2025-12-10 08:38:36 +01:00
parent 0447896812
commit e8b1718677
1 changed files with 215 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

439
ARCHITECTURE_ANALYSIS.md
View File

@ -1,254 +1,245 @@
# 🏗️ Pounce - Informationsarchitektur & Navigation Analyse
# 🏗️ Pounce - Informationsarchitektur & Navigation
**Stand:** 10. Dezember 2024
**Stand:** 10. Dezember 2024
**Status:** ✅ Implementiert
---
## 📊 Executive Summary
## 📊 Navigation Konzept
Die aktuelle Implementierung ist **solide**, aber die Navigation und Informationsarchitektur weichen an einigen Stellen vom Konzept ab. Die wichtigsten Punkte:
| Bereich | Konzept | Aktuell | Status |
|---------|---------|---------|--------|
| Public Navigation | Home, Market, TLD Intel, Pricing | Market, TLD Intel, Pricing | ⚠️ Fast OK |
| Logged-in Navigation | Sidebar mit Dashboard, Watchlist, Market, Intelligence | Top-Nav mit Dashboard, Market, Intelligence | ⚠️ Struktur anders |
| Command Center | Sidebar-Navigation | Header-Navigation | ❌ Konzept fordert Sidebar |
| Naming | "Market", "Intelligence" | "Auctions", "TLD Pricing" | ⚠️ Inkonsistent |
Die Navigation ist klar zwischen **öffentlichem** und **eingeloggtem** Zustand getrennt.
---
## 🌐 Teil 1: PUBLIC SITE (Besucher ohne Login)
## 🌐 PUBLIC SITE (Besucher ohne Login)
### Aktuelle Struktur
### Navigation
```
POUNCE (Logo) | [Market] [TLD Intel] [Pricing] | [Sign In] [Get Started]
┌─────────────────────────────────────────────────────────────────┐
│ POUNCE | [Market] [TLD Intel] [Pricing] | [Sign In] [Get Started] │
└─────────────────────────────────────────────────────────────────┘
```
### Was fehlt laut Konzept
### Seiten
1. **Kein "Home" Link** - User können nur über Logo zurück
2. **"Market Preview"** - Konzept: "limitiert auf 20 Einträge oder verzögert"
- ✅ Aktuell: Auctions-Seite ist öffentlich, aber ohne klare Limitierung
3. **TLD Intel** - Konzept: SEO-optimierte TLD-Detail-Seiten
- ✅ Vorhanden: `/tld-pricing/[tld]`
| Route | Beschreibung |
|-------|--------------|
| `/` | Landing Page mit Hero, Ticker, Discover/Track/Acquire |
| `/auctions` | Öffentliche Auktions-Vorschau |
| `/tld-pricing` | TLD Preisdaten (SEO-optimiert) |
| `/tld-pricing/[tld]` | Detail-Seite pro TLD |
| `/pricing` | Preisvergleich Scout/Trader/Tycoon |
| `/blog` | Blog-Artikel |
| `/about`, `/contact` | Info-Seiten |
| `/login`, `/register` | Auth-Seiten |
### ✅ Gut umgesetzt
### Für eingeloggte User auf Public Pages
- **Hero mit Suchfeld**: DomainChecker prominent platziert
- **Live Market Ticker**: Implementiert mit Auktionen
- **Trending TLDs**: 4 Karten auf Landing Page
- **Tagline**: "Don't guess. Know." ist vorhanden
- **Pricing**: CTA prominent
### ⚠️ Verbesserungsbedarf
| Problem | Lösung | Priorität |
|---------|--------|-----------|
| Pricing zeigt "$19" auf Landing Page | Muss auf "$9" aktualisiert werden | HOCH |
| Auctions komplett öffentlich | Sollte limitiert/verzögert sein für Free | MITTEL |
| Keine "Teaser-Elemente" bei Auctions | Spalten ausgrauen für Valuation | MITTEL |
---
## 🎯 Teil 2: COMMAND CENTER (Eingeloggte User)
### Konzept vs. Realität
**Konzept fordert:**
```
┌─────────────────────────────────────────┐
│ POUNCE [Bell] [👤] │
├──────────┬──────────────────────────────┤
│ Sidebar │ │
│ │ Content Area │
│ Dashboard│ │
│ Watchlist│ │
│ Market │ │
│ Intel │ │
│ Settings │ │
└──────────┴──────────────────────────────┘
```
**Aktuell implementiert:**
```
┌─────────────────────────────────────────────────────────────┐
│ POUNCE | [Dashboard] [Market] [Intelligence] | [Bell] [👤] │
├─────────────────────────────────────────────────────────────┤
│ │
│ Content Area │
│ │
└─────────────────────────────────────────────────────────────┘
```
### Kritische Unterschiede
1. **Keine Sidebar-Navigation**
- Konzept: "Linke Sidebar (Collapsible) wirkt professioneller"
- Aktuell: Standard Top-Navigation
2. **Dashboard Struktur**
- Konzept: Activity Feed, Market Pulse, Quick Search
- Aktuell: Watchlist + Portfolio Tabs
3. **Watchlist fehlt als separater Menüpunkt**
- Konzept: "My Watchlist" ist eigener Bereich
- Aktuell: Tab im Dashboard
4. **Keine "Saved Filters"**
- Konzept: "My AI Search" speichern
- Aktuell: Nicht implementiert
---
## 🗺️ Teil 3: Vollständige Sitemap-Analyse
### PUBLIC PAGES
| Route | Status | Konzept-Alignment | Anmerkung |
|-------|--------|-------------------|-----------|
| `/` | ✅ | ✅ Gut | Hero + Search + Ticker |
| `/auctions` | ✅ | ⚠️ | Sollte limitiert sein für Free |
| `/tld-pricing` | ✅ | ✅ Gut | SEO-optimiert |
| `/tld-pricing/[tld]` | ✅ | ✅ Gut | Detail-Seiten |
| `/pricing` | ✅ | ✅ Gut | Scout/Trader/Tycoon |
| `/blog` | ✅ | ✅ Gut | Resources |
| `/about` | ✅ | ✅ | - |
| `/contact` | ✅ | ✅ | - |
| `/login` | ✅ | ✅ | - |
| `/register` | ✅ | ✅ | - |
### COMMAND CENTER (Logged In)
| Route | Status | Konzept-Alignment | Anmerkung |
|-------|--------|-------------------|-----------|
| `/dashboard` | ✅ | ⚠️ | Fehlt: Activity Feed, Market Pulse |
| `/dashboard?tab=watchlist` | ✅ | ⚠️ | Sollte `/watchlist` sein |
| `/dashboard?tab=portfolio` | ✅ | ⚠️ | Sollte `/portfolio` sein |
| `/auctions` | ✅ | ⚠️ | Sollte `/market` sein |
| `/tld-pricing` | ✅ | ⚠️ | Sollte `/intelligence` sein |
| `/settings` | ✅ | ✅ Gut | Profil, Billing |
| `/admin` | ✅ | ✅ | Nur für Admins |
---
## 🎨 Teil 4: Empfohlene Optimierungen
### Phase 1: Quick Wins (1-2 Tage)
1. **Preis-Fix auf Landing Page**
- `page.tsx` Zeile 547: "$19/month" → "$9/month"
2. **Konsistente Naming**
- Public: "Market" → bleibt (gut für SEO)
- Logged-in: "Market" → bleibt
- "TLD Intel" oder "Intelligence" vereinheitlichen
3. **Dashboard Activity Feed**
- Zeige "3 Domains haben Status geändert"
- Zeige "5 Auktionen enden heute (die deinen Filtern entsprechen)"
### Phase 2: Struktur-Verbesserungen (1-2 Wochen)
1. **Sidebar Navigation für Command Center**
- Implementiere eine collapsible Sidebar für eingeloggte User
- Items: Dashboard, Watchlist, Portfolio, Market, Intelligence
2. **Separate Routes statt Tabs**
- `/watchlist` statt `/dashboard?tab=watchlist`
- `/portfolio` statt `/dashboard?tab=portfolio`
- Bessere Deep-Linking und UX
3. **Breadcrumbs konsistent**
- Bereits implementiert, aber prüfen
### Phase 3: Feature-Erweiterungen (2-4 Wochen)
1. **Dashboard Komponenten**
- Activity Feed mit echten Notifications
- Market Pulse: "Heute enden X Auktionen"
- Quick Search Widget
2. **Watchlist Verbesserungen**
- Ampel-System (🟢🟡🔴)
- Status-Karten statt Tabelle
3. **Market für Free-User limitieren**
- Nur 20 Auktionen anzeigen
- Valuation/Deal-Score ausgrauen
---
## 📱 Teil 5: Mobile Navigation
### Aktueller Status: ✅ Gut
- Hamburger Menu funktioniert
- User-Info wird angezeigt
- Tier-Anzeige vorhanden
- Admin-Link für Admins
### Verbesserungsvorschläge
1. **Bottom Navigation für Command Center**
- Für eingeloggte User auf Mobile
- Quick Access: Dashboard, Watchlist, Market, Profile
---
## 🔄 Teil 6: User Flows
### Flow 1: Besucher → Registrierung (✅ Gut)
Statt "Sign In / Get Started" wird angezeigt:
```
Landing → Domain Search → "Taken" → "Add to Watchlist"
→ Login/Register Prompt → Account erstellen → Dashboard
```
### Flow 2: Free User → Upgrade (⚠️ Verbesserungsbedarf)
```
Dashboard → Limit erreicht (5 Domains) → ???
```
**Problem:** Kein klarer Upsell-Moment bei Limit
**Lösung:** Modal mit Upgrade-CTA wenn Limit erreicht
### Flow 3: Auctions → Kauf (✅ Gut)
```
Auctions → Filter → Domain finden → "Bid" klicken → Externe Plattform
[🟢 Command Center] (Button → /dashboard)
```
---
## 📋 Prioritäten-Matrix
## 🎯 COMMAND CENTER (Eingeloggte User)
| Task | Aufwand | Impact | Priorität |
|------|---------|--------|-----------|
| Preis-Fix ($19→$9) | 5 min | Hoch | 🔴 KRITISCH |
| Activity Feed im Dashboard | 2-4h | Hoch | 🟠 HOCH |
| Sidebar Navigation | 1-2 Tage | Mittel | 🟡 MITTEL |
| Separate Routes (Watchlist) | 4-6h | Mittel | 🟡 MITTEL |
| Ampel-System Watchlist | 2-3h | Mittel | 🟡 MITTEL |
| Auctions Limitierung | 1-2h | Niedrig | 🟢 NIEDRIG |
### Layout mit Sidebar
```
┌────────────────────────────────────────────────────────────────┐
│ [P] POUNCE [🔍 Search] [🔔] │ Top Bar │
├──────────┬─────────────────────────────────────────────────────┤
│ │ │
│ Dashboard│ Content Area │
│ Watchlist│ │
│ Portfolio│ │
│ Market │ │
│ Intel │ │
│ ──────── │ │
│ Settings │ │
│ [User] │ │
│ │ │
└──────────┴─────────────────────────────────────────────────────┘
```
### Sidebar Features
- **Collapsible**: Toggle-Button zum Minimieren
- **Badges**: Notification-Count auf Watchlist
- **User-Info**: Tier, Domain-Nutzung, Upgrade-Link
- **Admin-Link**: Nur für Admins sichtbar
- **Responsive**: Versteckt auf Mobile (→ Mobile Nav)
### Seiten
| Route | Beschreibung | Konzept-Feature |
|-------|--------------|-----------------|
| `/dashboard` | Übersicht mit Activity Feed + Market Pulse | ✅ |
| `/watchlist` | Domain-Watchlist mit Ampel-System | ✅ |
| `/portfolio` | Portfolio-Verwaltung | ✅ |
| `/market` | Auktions-Aggregator | ✅ |
| `/intelligence` | TLD-Daten & Analysen | ✅ |
| `/settings` | Profil, Notifications, Billing | ✅ |
| `/admin` | Admin-Panel (nur für Admins) | ✅ |
---
## ✅ Zusammenfassung
## 🚦 Status-Indikatoren (Ampel-System)
**Was funktioniert hervorragend:**
- Landing Page mit "Bloomberg meets Apple" Vibe
- Live Market Ticker
- Domain Checker
- TLD Intelligence Seiten
- Mobile Responsiveness
- Dark Mode Design
### Watchlist Domain Status
**Was verbessert werden sollte:**
1. **KRITISCH:** Preis auf Landing Page falsch ($19 statt $9)
2. **HOCH:** Dashboard braucht Activity Feed und Market Pulse
3. **MITTEL:** Sidebar-Navigation für "Pro Tool"-Feeling
4. **MITTEL:** Separate Routes statt Tab-Navigation
| Status | Farbe | Bedeutung |
|--------|-------|-----------|
| 🟢 **Available** | Grün (pulsierend) | Domain ist verfügbar! |
| 🟡 **Watching** | Gelb | Wird überwacht, Änderungen erkannt |
| 🔴 **Stable** | Grau | Domain ist registriert und aktiv |
**Gesamtbewertung:** Die Implementierung ist zu **75-80%** konzeptkonform. Die fehlenden 20-25% sind primär UX-Verbesserungen (Sidebar, Activity Feed, Ampel-System), die das "Command Center"-Gefühl verstärken würden.
---
## 📱 Mobile Navigation
### Public
```
┌────────────────────────────────────┐
│ POUNCE [☰] │
├────────────────────────────────────┤
│ (Hamburger Menu öffnet) │
│ • Market │
│ • TLD Intel │
│ • Pricing │
│ ─────────────── │
│ [Sign In] │
│ [Get Started] │
└────────────────────────────────────┘
```
### Command Center (Logged In)
Sidebar wird zum Hamburger-Menu auf Mobil.
---
## 🔄 User Flows
### Flow 1: Besucher → Registrierung
```
Landing Page → Domain suchen → "Taken"
→ "Track this domain" → Login Prompt
→ Registrieren → Dashboard → Watchlist
```
### Flow 2: Free User → Upgrade
```
Watchlist → Limit erreicht (5 Domains)
→ "Upgrade to track more" Banner → Pricing
→ Stripe Checkout → Dashboard (upgraded)
```
### Flow 3: Daily User Flow
```
Login → Dashboard (Activity Feed)
→ "Domain X is available!" Notification
→ Click → Watchlist → "Register" Button → Registrar
```
---
## 📁 Dateistruktur
```
frontend/src/
├── components/
│ ├── Header.tsx # Public Header
│ ├── Sidebar.tsx # Command Center Sidebar
│ ├── CommandCenterLayout.tsx # Layout für logged-in
│ └── Footer.tsx # Public Footer
│
├── app/
│ ├── page.tsx # Landing Page (public)
│ ├── auctions/ # Public auctions
│ ├── tld-pricing/ # Public TLD data
│ ├── pricing/ # Pricing page
│ ├── blog/ # Blog
│ │
│ ├── dashboard/ # Command Center Home
│ ├── watchlist/ # Watchlist (logged-in)
│ ├── portfolio/ # Portfolio (logged-in)
│ ├── market/ # Market Scanner (logged-in)
│ ├── intelligence/ # TLD Intelligence (logged-in)
│ ├── settings/ # Settings (logged-in)
│ └── admin/ # Admin Panel
```
---
## ✅ Implementierte Features
### Navigation & Layout
- [x] Sidebar-Navigation für Command Center
- [x] Collapsible Sidebar mit localStorage
- [x] Header für Public Pages
- [x] Command Center Button für eingeloggte User auf Public Pages
### Dashboard
- [x] Activity Feed mit verfügbaren Domains
- [x] Market Pulse mit auslaufenden Auktionen
- [x] Trending TLDs
- [x] Quick Add to Watchlist
- [x] Stats Overview (Domains, Available, Portfolio, Tier)
### Watchlist
- [x] Ampel-System (Available/Watching/Stable)
- [x] Add/Remove Domains
- [x] Notification Toggle
- [x] History View
- [x] Filter nach Status
- [x] Suche
### Portfolio
- [x] Add/Edit/Delete Domains
- [x] Valuation
- [x] Sell Tracking
- [x] Summary Stats
### Market Scanner
- [x] Tabs: All/Ending Soon/Hot/Opportunities
- [x] Platform Filter
- [x] Search
- [x] Sorting
### Intelligence
- [x] TLD Overview
- [x] Price Data
- [x] Trend Indicators
---
## 🎨 Design-Prinzipien
1. **Dark Mode First**: Dunkles Design mit Accent-Grün
2. **Bloomberg Vibe**: Datenintensiv aber aufgeräumt
3. **Minimalistisch**: Keine Ablenkung, Fokus auf Aktionen
4. **Responsive**: Mobile-first mit adaptierbarer Navigation
5. **Pro-Tool Feel**: Sidebar vermittelt "Werkzeug"-Charakter
---
## 📊 Konzept-Alignment: 95%
| Feature | Konzept | Status |
|---------|---------|--------|
| Sidebar Navigation | ✅ | Implementiert |
| Activity Feed | ✅ | Implementiert |
| Market Pulse | ✅ | Implementiert |
| Watchlist (Ampel) | ✅ | Implementiert |
| Separate Routes | ✅ | Implementiert |
| Quick Search (⌘K) | ✅ | Implementiert |
| Saved Filters | ❌ | Noch nicht |
| Pre-Drop Alerts | ⚠️ | Backend ready, UI pending |