Skip to content

mrothpa/Zen-Sync

Repository files navigation

🃏 Zen-Sync (The Mind) - Web Edition

Eine moderne, webbasierte Umsetzung des preisgekrönten Kartenspiels "The Mind".

Hinweis: Dies ist ein Fan-Projekt zu Bildungszwecken. Alle Rechte am ursprünglichen Spielkonzept liegen beim NSV Verlag und Wolfgang Warsch.

✨ Features

  • Echtzeit-Multiplayer: Synchronisiertes Gameplay über Firebase Firestore.
  • Statistik-Dashboard: - Solo: Verfolge deine persönliche Bestleistung und Präzision.
    • Team: Analysiere deine Synergie mit spezifischen Mitspielern.
    • Global: Miss dich mit der Welt im Top-10 Leaderboard.
  • Haptisches Feedback: Vibration bei Fehlern (für mobile Browser).
  • Soziale Interaktion: Sende Echtzeit-Emoji-Reaktionen (🤯, 👍, 🙏) an deine Mitspieler.
  • Modernes UI: Design nach Material 3 Richtlinien mit flüssigen framer-motion Animationen.
  • Hybrid-Auth: Spiele anonym als Gast oder sichere deinen Fortschritt per Login.

🚀 Technischer Stack

  • Frontend: React.js mit TypeScript
  • Styling: Tailwind CSS & Material UI (M3 Design)
  • Animationen: Framer Motion
  • Backend/Datenbank: Firebase (Firestore, Authentication, Hosting)

🛠️ Installation & Setup

  1. Repository klonen:

    git clone [https://github.com/mrothpa/Zen-Sync.git](https://github.com/mrothpa/Zen-Sync.git)
    cd the-mind
  2. Abhängigkeiten installieren:

    npm install
  3. Firebase konfigurieren:

    • Erstelle ein Projekt in der Firebase Console.
    • Aktiviere Firestore und Authentication (Google & Anonym).
    • Erstelle eine .env Datei im Hauptverzeichnis und füge deine Keys hinzu:
      VITE_FIREBASE_API_KEY=dein_key
      VITE_FIREBASE_AUTH_DOMAIN=dein_projekt.firebaseapp.com
      VITE_FIREBASE_PROJECT_ID=dein_projekt
  4. Lokal starten:

    npm run dev
  5. Alternativ ohne Node.js lokal zu installieren: Um das Produktions-Bundle (dist/) zu erstellen, ohne Node.js lokal zu installieren:

    docker run --rm -v "$(pwd)":/app -w /app node:20-slim sh -c "npm install && npm run build"

📈 Spielregeln (Kurzfassung)

  1. Das Team muss Karten von 1 bis 100 in aufsteigender Reihenfolge ablegen.
  2. Es darf nicht kommuniziert werden (keine Absprache, keine Zeichen).
  3. Konzentration und ein gemeinsames Zeitgefühl sind der Schlüssel zum Erfolg.
  4. Wurfsterne können genutzt werden, um die niedrigste Karte aller Spieler aufzudecken.

📱 Mobile Nutzung

Das Projekt ist als PWA (Progressive Web App) optimiert. Für das beste Erlebnis:

  • Öffne die URL im mobilen Browser.
  • Wähle "Zum Home-Bildschirm hinzufügen".
  • Genieße das Spiel im Vollbildmodus inklusive haptischem Feedback.

📝 Lizenz

Dieses Projekt wurde zu Bildungszwecken erstellt. Das Original-Spielprinzip stammt von Wolfgang Warsch (Nürnberger Spielkarten-Verlag).

About

🃏 Zen Sync: A cooperative multiplayer card game built with React, TypeScript, and Firebase. Features real-time synchronization, presence tracking, and global leaderboards.

Topics

Resources

License

Stars

Watchers

Forks

Contributors

Languages