Un juego de memoria interactivo diseñado para poner a prueba la retención visual y la agilidad mental, para niños.
[MatchPaths] es una aplicación interactiva donde los jugadores deben encontrar pares de cartas ocultas en el menor tiempo y con la menor cantidad de movimientos posibles. Este proyecto fue desarrollado para aplicar conceptos de lógica de programación, manejo del DOM y diseño de interfaces de usuario.
Match Paths es un microjuego interactivo de entrenamiento cognitivo diseñado para mejorar la concentración y la memoria a corto plazo. A través de una experiencia lúdica y visualmente atractiva, los usuarios deben emparejar diferentes tipos de vehículos en tres niveles temáticos progresivos.
-
Sistema de Progresión: Tres niveles de dificultad temática:
Vehículos Terrestres: (Desbloqueado por defecto) 🚗
Vehículos Marítimos: (Se desbloquea tras superar el Nivel 1) 🚢
Vehículos Aéreos: (Se desbloquea tras superar el Nivel 2)✈️ -
Mecánica de Juego: Permite descubrir hasta 3 cartas simultáneamente. Si hay un par dentro de las 3, se valida y se mantiene visible, optimizando el flujo de juego.
-
Feedback Inmediato: Efectos visuales de resaltado verde para aciertos, sonido envolvente y mensajes motivadores dinámicos.
-
Ambiente Personalizable: Botón de Modo Oscuro/Claro para mayor comodidad visual. Música suave con opción de Mute.
-
Estadísticas en Vivo: Contador de intentos y cronómetro integrados para fomentar la autosuperación.
-
Celebración Final: Pantalla de victoria con efecto de confeti y tonos dorados al completar cada nivel.
- [React.js] Para la lógica de componentes y gestión de estados (Hooks como useState, useEffect).
- [Tailwind CSS] Para un diseño responsivo, moderno y animaciones fluidas.
- [Lucide React] Set de iconos minimalistas.
- [Web Audio API] Sintetizador de sonido personalizado para efectos y música sin dependencias externas.
- [Animaciones CSS3] Efectos de volteo de cartas (3D perspective) y transiciones de pantalla.
- Elige un nivel disponible desde el menú principal.
- Haz clic en los bloques para revelar los emojis ocultos.
- Si encuentras un par (ya sea en un grupo de 2 o 3 cartas abiertas), este se iluminará en verde y permanecerá descubierto.
- Si las cartas no coinciden, se ocultarán nuevamente tras un breve periodo.
- ¡Supera el reto en el menor tiempo y con el menor número de intentos posible para desbloquear el siguiente nivel!
Para probar el proyecto en tu entorno local de forma inmediata y sin configuraciones complejas, sigue estos pasos:
- Obtener los archivos: Clona este repositorio en tu máquina o descarga el código fuente en formato ZIP y descomprime su contenido.
- Iniciar la aplicación: Navega hasta la raíz del proyecto, localiza el archivo
index.htmly ábrelo directamente con tu navegador web de preferencia (Chrome, Firefox, Edge, Safari).
Important
Al tratarse de una aplicación basada puramente en el lado del cliente (client-side), no requiere de la instalación de dependencias pesadas ni del despliegue de servidores locales para su funcionamiento base.
Desarrollado como una herramienta interactiva para el entrenamiento mental y la diversión.
