🧠 Patty - Juegos Pedagógicos para Cabellos de Plata

Una aplicación web progresiva (PWA) diseñada específicamente para adultos mayores, que combina entretenimiento con estimulación cognitiva y fomenta la interacción intergeneracional.

🎯 Características Principales

🎮 Juegos Incluidos

• Juego de Memoria: Encuentra las parejas de cartas con temas familiares
• Sopa de Letras: Busca palabras relacionadas con experiencias de vida
• Ejercicios Mentales: Problemas matemáticos adaptados por dificultad
• Trivia Familiar: Preguntas intergeneracionales para compartir en familia

♿ Accesibilidad

• Tamaños de letra ajustables: 3 niveles de tamaño
• Alto contraste: Modo oscuro para mejor visibilidad
• Navegación por teclado: Soporte completo para teclado
• Interfaz intuitiva: Botones grandes y fáciles de usar
• Instrucciones claras: Explicaciones paso a paso

📱 Tecnología PWA

• Instalable: Se puede instalar como app nativa
• Funciona offline: Juega sin conexión a internet
• Responsive: Se adapta a cualquier dispositivo
• Rápida: Carga instantánea después de la primera visita

📊 Sistema de Progreso

• Estadísticas detalladas: Seguimiento de progreso personal
• Sistema de logros: Reconocimientos por hitos alcanzados
• Niveles de dificultad: Adaptación automática según experiencia
• Historial de juegos: Registro de todas las partidas

🚀 Instalación y Uso

Requisitos Previos

• Python 3.6 o superior
• Navegador web moderno (Chrome, Firefox, Safari, Edge)

Instalación

1. Clona o descarga el proyecto:

   git clone [URL_DEL_REPOSITORIO]
   cd Patty

2. Inicia el servidor:

   python3 server.py

   O en un puerto específico:

   python3 server.py 8080

3. Abre tu navegador y visita:

   http://localhost:8000
   

Instalación como PWA

1. Abre la aplicación en tu navegador
2. Busca el ícono de "Instalar" en la barra de direcciones
3. Haz clic en "Instalar" para agregar Patty a tu dispositivo
4. ¡Ya puedes usar Patty como una aplicación nativa!

Verificación de Iconos

Si los iconos no se muestran correctamente:

1. Visita http://localhost:8000/test-icons.html para verificar que todos los iconos se cargan
2. Los iconos se generan automáticamente al iniciar el proyecto
3. Si necesitas regenerar los iconos, ejecuta:

   python3 -c "from PIL import Image; print('Iconos disponibles')"

🎮 Cómo Jugar

Primer Uso

1. Ingresa tu nombre en la pantalla de bienvenida
2. Explora el menú de juegos disponibles
3. Ajusta la accesibilidad usando los botones en la esquina superior derecha
4. Selecciona un juego y ¡comienza a divertirte!

Juego de Memoria

• Haz clic en las cartas para voltearlas
• Encuentra las parejas iguales
• Completa todas las parejas para ganar

Sopa de Letras

• Busca las palabras de la lista
• Arrastra para seleccionar las letras
• Encuentra todas las palabras para completar el nivel

Ejercicios Mentales

• Resuelve los problemas matemáticos
• Tienes tiempo limitado por problema
• Responde correctamente para ganar puntos

Trivia Familiar

• Lee las preguntas cuidadosamente
• Selecciona la respuesta correcta
• ¡Perfecto para jugar en familia!

🛠️ Estructura del Proyecto

Patty/
├── index.html              # Página principal
├── manifest.json           # Configuración PWA
├── sw.js                   # Service Worker
├── server.py               # Servidor de desarrollo
├── css/
│   ├── styles.css          # Estilos principales
│   └── games.css           # Estilos de juegos
├── js/
│   ├── app.js              # Aplicación principal
│   ├── utils.js            # Utilidades
│   └── games/
│       ├── memory.js       # Juego de memoria
│       ├── words.js        # Sopa de letras
│       ├── numbers.js      # Ejercicios mentales
│       └── social.js       # Trivia familiar
└── images/
    └── icons/              # Iconos de la PWA

🎨 Personalización

Cambiar Colores

Edita las variables CSS en css/styles.css:

:root {
    --primary-color: #4a90e2;    /* Color principal */
    --accent-color: #f39c12;     /* Color de acento */
    --success-color: #27ae60;    /* Color de éxito */
}

Agregar Nuevos Juegos

1. Crea un nuevo archivo en js/games/
2. Implementa la clase del juego
3. Agrega la carta del juego en index.html
4. Registra el juego en js/app.js

Modificar Preguntas de Trivia

Edita el array questionBank en js/games/social.js

🔧 Desarrollo

Estructura de Clases

• PattyApp: Aplicación principal
• MemoryGame: Lógica del juego de memoria
• WordsGame: Lógica de la sopa de letras
• NumbersGame: Lógica de ejercicios mentales
• TriviaGame: Lógica de la trivia

Utilidades Disponibles

• PattyUtils.Storage: Manejo de localStorage
• PattyUtils.Accessibility: Funciones de accesibilidad
• PattyUtils.Effects: Animaciones y efectos
• PattyUtils.Stats: Sistema de estadísticas
• PattyUtils.DateTime: Utilidades de fecha y hora

📈 Métricas y Estadísticas

La aplicación rastrea automáticamente:

• Juegos jugados por tipo
• Puntuaciones y mejores marcas
• Tiempo promedio por juego
• Racha de victorias
• Progreso de nivel
• Logros desbloqueados

🌐 Compatibilidad

Navegadores Soportados

• Chrome 60+
• Firefox 55+
• Safari 11+
• Edge 79+

Dispositivos

• Computadoras de escritorio
• Tablets
• Teléfonos móviles
• Smart TVs (con navegador)

🤝 Contribuir

¡Las contribuciones son bienvenidas! Especialmente:

• Nuevos juegos pedagógicos
• Mejoras de accesibilidad
• Traducciones a otros idiomas
• Optimizaciones de rendimiento

📄 Licencia

Este proyecto está bajo la Licencia MIT. Ver el archivo LICENSE para más detalles.

👥 Créditos

Desarrollado con ❤️ para estimular la mente y unir generaciones.

Tecnologías utilizadas:

• HTML5, CSS3, JavaScript (Vanilla)
• PWA (Progressive Web App)
• Service Workers
• Local Storage API
• Canvas API (para iconos)

---

¡Disfruta jugando y mantén tu mente activa! 🧠✨