Skip to content
ramirolacciPublic

About

BeatMap es un juego de ritmo por círculos moderno para navegador. Permite jugar canciones precargadas, importar archivos .osu o cargar tus propios archivos MP3 con generación automática de mapas en tiempo real sincronizados por audio.

Topics

Resources

Stars

1 star

Watchers

0 watching

Forks

Repository files navigation

🎵 BEATMAP

Juego de Ritmo por Círculos & Generador de Beatmaps por Audio MP3

UI Audio Engine Animations


🌟 Sobre BeatMap

BeatMap es un juego de ritmo por círculos moderno, dinámico y totalmente responsivo diseñado para ejecutarse directamente en el navegador. Fusiona la precisión táctil de los juegos de ritmo clásicos con una potente suite de análisis de frecuencias de audio que permite generar mapas de ritmo jugables e instantáneos a partir de cualquier archivo MP3 o importar canciones en formato .osu.


🖼️ Galería

Menú Principal y Selección de Canciones Ajustes y Panel de Canciones
Pantalla de Juego y Gameplay Pantalla de Resultados y Calificación

🔥 Características Principales

  • 🎧 Generación Inteligente de Ritmo desde MP3: Carga cualquier archivo de audio y el algoritmo detectará automáticamente el BPM, los transitorios de bajos y la intensidad musical para crear un patrón de notas sincronizado.
  • 📂 Soporte para Formato .osu: Importa mapas de la comunidad de osu! de forma directa y juega con configuraciones exactas de aproximación (AR), tamaño de círculo (CS) y dificultad (OD).
  • ⚡ Motor Gráfico en Canvas 2D: Renderizado ultra rápido a 60/120 FPS con rastro de cursor, animaciones de contracción de círculos de aproximación (Approach Circles) y retroalimentación de impactos visuales.
  • 🎮 Canciones Precargadas: Incluye una selección por defecto equilibrada en todas las dificultades (Fácil, Normal, Difícil, Experto) con portadas personalizadas listas para jugar.
  • 📊 Sistema de Puntuación y Resultados: Evaluación precisa en tiempo real de combo máximo, precisión porcentual, desglose de notas (300 / 100 / 50 / Fallos) y calificación por grado (S, A, B, C, D) con efectos de celebración.
  • ✨ Estética Neón Cyberpunk: Interfaz de usuario pulida con efectos de brillo ambiental, desenfoque esmerilado (Backdrop Blur), transiciones fluidas con GSAP y personalización de controles.

🛠️ Tecnologías Utilizadas


🚀 Instalación y Puesta en Marcha

Sigue estos pasos para clonar y ejecutar el proyecto localmente en tu computadora:

1. Requisitos Previos

Asegúrate de tener instalados:

  • Node.js (versión 18 o superior recomendada, v20+)
  • Gestor de paquetes: pnpm (recomendado), npm o yarn

2. Clonar el Repositorio

git clone https://github.com/tu-usuario/beatmap.git
cd beatmap

3. Instalar Dependencias

# Con pnpm (recomendado)
pnpm install

# O con npm
npm install

4. Iniciar Servidor de Desarrollo

# Con pnpm
pnpm run dev

# O con npm
npm run dev

Abre tu navegador en la URL indicada por la terminal (usualmente http://localhost:5173).

5. Compilar para Producción

# Compilar TypeScript y empaquetar con Vite
pnpm run build

# Previsualizar el build de producción localmente
pnpm run preview

🎮 Controles por Defecto

  • Golpear Círculos: Teclas Z y X (o el Clic Izquierdo del Ratón).
  • Pausar / Reanudar: Barra espaciadora (ESPACIO) o tecla Escape.
  • Las teclas de golpe K1 y K2 se pueden reconfigurar directamente desde el panel de ajustes en el menú principal.

Desarrollado con ❤️ para amantes de los juegos de ritmo.

About

BeatMap es un juego de ritmo por círculos moderno para navegador. Permite jugar canciones precargadas, importar archivos .osu o cargar tus propios archivos MP3 con generación automática de mapas en tiempo real sincronizados por audio.

Topics

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages