Actúa como un experto desarrollador de prompts y genera uno para crear una aplicación en html dirigida a niños de Educación Primaria, especialmente a niños con dislexia y su misión será detectar la palabra intrusa.
Quiero que la aplicación elija al azar una de los siguientes juegos de palabras:
1. perro, gato, caballo, vaca, mesa
2. rojo, azul, verde, amarillo, zapato
3. manzana, pera, plátano, naranja, silla
4. pantalón, camiseta, vestido, abrigo, cuchara
5. cama, sofá, mesa, silla, limón
6. coche, autobús, tren, bicicleta, pan
7. cuchara, tenedor, cuchillo, plato, perro
8. ojo, nariz, boca, oreja, árbol
9. león, tigre, elefante, jirafa, camiseta
10. pan, leche, queso, yogur, pelota
11. lápiz, bolígrafo, goma, regla, plátano
12. primavera, verano, otoño, invierno, coche
13. lunes, martes, miércoles, jueves, naranja
14. médico, enfermero, dentista, profesor, bicicleta
15. fútbol, baloncesto, tenis, natación, mesa
16. lluvia, nieve, viento, sol, zapato
17. rosa, tulipán, margarita, clavel, autobús
18. árbol, flor, hierba, planta, cuchillo
19. casa, colegio, hospital, supermercado, león
20. alegría, tristeza, enfado, miedo, manzana
Cada juego de palabra está compuesto por cuatro palabras de la misma familia y en quinta posición va la palabra intrusa.
Realiza estas tareas:
1. Muestra inicialmente un juego de palabra usando la fuente OpenDyslexic.
2. Quiero que le pidas al niño que haga clic sobre la palabra intrusa. Si no acierta le damos tres intentos y si no lo consigue le decimos cual es la palabra intrusa.
3. Cuando resuelva el ejercicio que aparezca otra familia y repita el proceso hasta 5 veces, aunque habrá un botón para regresar al menú.
4. Quiero también que la aplicación permita introducir nuevas familias de palabras que nosotros deseemos y en la que haya una intrusa.
5. Quiero que me de las estadísticas con los resultados.
6. La aplicación debe funcionar en tablets, ordenadores, móviles con Android e IOs.
7. Después de resolver un ejercicio que se muestren mensajes motivadores acompañados de pequeñas animaciones.
8. La aplicación debe incluir: botones grandes, alto contraste, posibilidad de activar/desactivar sonidos, funcionamiento tanto con ratón como con pantalla táctil, orientación horizontal y vertical...
9. Con una interfaz moderna inspirada en aplicaciones actuales.
10. La aplicación debe parecer un recurso educativo profesional.
Optimiza el prompt para hacerlo mejor y hazme las preguntas que consideres necesarias antes de proceder.
Actúa como un desarrollador web experto en la creación de aplicaciones educativas accesibles e inclusivas, especializado en el diseño de recursos digitales para alumnado de Educación Primaria y, especialmente, para niños y niñas con dislexia y otras dificultades específicas de aprendizaje relacionadas con la lectura.
Tu misión es crear una aplicación educativa interactiva llamada «La palabra intrusa», diseñada para ayudar al alumnado a identificar relaciones semánticas entre palabras y detectar cuál de ellas no pertenece al mismo grupo.
La aplicación debe tener un aspecto moderno, atractivo, profesional y cuidado, inspirado en las aplicaciones educativas actuales. Debe transmitir la sensación de ser un recurso educativo de calidad, no un simple ejercicio web.
Crea una aplicación web completa en un único archivo HTML autocontenido.
El archivo debe incluir internamente todo lo necesario:
HTML.
CSS.
JavaScript.
Los datos de las familias de palabras.
La fuente OpenDyslexic integrada.
Los sonidos o los sistemas necesarios para generar la retroalimentación sonora.
La aplicación debe funcionar sin depender de servidores, APIs ni recursos externos y, una vez guardado el archivo, debe poder utilizarse sin conexión a Internet.
Debe ser compatible con:
Ordenadores con Windows, macOS, Linux y Chromebook.
Tablets.
Teléfonos móviles Android.
iPhone y iPad.
Navegadores modernos.
La interfaz debe adaptarse correctamente tanto a orientación vertical como horizontal.
La misión del niño será identificar la palabra intrusa dentro de un grupo de cinco palabras.
Cada ejercicio estará formado siempre por:
4 palabras pertenecientes a una misma categoría o familia semántica.
1 palabra intrusa que no pertenece a esa categoría.
El niño deberá pulsar o tocar la palabra que considere intrusa.
La aplicación debe utilizar inicialmente las siguientes 20 familias:
perro, gato, caballo, vaca, mesa
rojo, azul, verde, amarillo, zapato
manzana, pera, plátano, naranja, silla
pantalón, camiseta, vestido, abrigo, cuchara
cama, sofá, mesa, silla, limón
coche, autobús, tren, bicicleta, pan
cuchara, tenedor, cuchillo, plato, perro
ojo, nariz, boca, oreja, árbol
león, tigre, elefante, jirafa, camiseta
pan, leche, queso, yogur, pelota
lápiz, bolígrafo, goma, regla, plátano
primavera, verano, otoño, invierno, coche
lunes, martes, miércoles, jueves, naranja
médico, enfermero, dentista, profesor, bicicleta
fútbol, baloncesto, tenis, natación, mesa
lluvia, nieve, viento, sol, zapato
rosa, tulipán, margarita, clavel, autobús
árbol, flor, hierba, planta, cuchillo
casa, colegio, hospital, supermercado, león
alegría, tristeza, enfado, miedo, manzana
En los datos internos de la aplicación debe quedar correctamente identificada cuál es la palabra intrusa de cada familia.
Aunque la palabra intrusa aparezca inicialmente en quinta posición en esta lista, las cinco palabras deberán mostrarse siempre en un orden aleatorio.
Esto es fundamental para evitar que el alumnado aprenda que la última palabra suele ser la respuesta correcta.
Cada partida estará compuesta por 5 ejercicios.
Al comenzar una nueva partida:
La aplicación seleccionará aleatoriamente 5 familias diferentes entre todas las disponibles.
No se repetirá una familia dentro de la misma partida.
Las cinco palabras de cada ejercicio aparecerán en orden aleatorio.
El niño deberá seleccionar la palabra intrusa pulsando o tocando sobre ella.
Debe mostrarse una instrucción clara y sencilla, por ejemplo:
«Busca la palabra que no pertenece al grupo»
La instrucción debe poder leerse en voz alta si está activada la opción correspondiente.
El niño dispondrá de un máximo de 3 intentos para encontrar la palabra intrusa.
El comportamiento debe ser exactamente el siguiente:
Si el niño selecciona una palabra incorrecta:
La palabra elegida debe recibir una retroalimentación visual clara, pero sin resultar excesivamente negativa.
Debe reproducirse un sonido de error si los sonidos están activados.
Debe aparecer un mensaje breve y motivador, por ejemplo:
«¡Casi! Vuelve a intentarlo».
«No pasa nada. Observa las palabras con atención».
«¡Sigue pensando! Seguro que puedes encontrarla».
El niño debe poder realizar un segundo intento.
Si vuelve a equivocarse:
Debe aparecer otra retroalimentación visual.
Debe mostrarse un nuevo mensaje de ayuda y ánimo.
Debe reproducirse un sonido de error si está activado.
El niño podrá realizar un tercer y último intento.
Si falla el tercer intento:
La aplicación debe indicar claramente cuál era la palabra intrusa.
La palabra correcta debe quedar destacada visualmente.
Debe aparecer un mensaje amable y educativo, por ejemplo:
«La palabra intrusa era: [palabra]. ¡En el siguiente ejercicio seguro que lo conseguirás!»
Debe contabilizarse el ejercicio como no resuelto.
Después de unos segundos, la aplicación pasará automáticamente al siguiente ejercicio.
Cuando el niño seleccione correctamente la palabra intrusa:
Debe bloquearse temporalmente la interacción para evitar pulsaciones accidentales.
La respuesta correcta debe recibir una retroalimentación visual positiva.
Debe reproducirse un sonido de acierto si está activado.
Debe aparecer inmediatamente un mensaje motivador elegido aleatoriamente.
Incluye una variedad de mensajes como:
«¡Excelente!»
«¡Muy bien!»
«¡Lo has conseguido!»
«¡Fantástico trabajo!»
«¡Eres un gran detective de palabras!»
«¡Genial!»
«¡Perfecto!»
«¡Sigue así!»
Junto al mensaje debe aparecer una pequeña animación positiva y alegre, por ejemplo:
Estrellas.
Confeti.
Una medalla.
Una explosión suave de celebración.
Elementos gráficos animados.
Las animaciones deben ser agradables, breves y no excesivamente recargadas.
Después de unos segundos, la aplicación debe pasar automáticamente al siguiente ejercicio.
No debe ser necesario pulsar un botón para continuar.
La aplicación debe comenzar con un menú principal moderno y atractivo.
Debe incluir:
El título «La palabra intrusa».
Un subtítulo o breve explicación sencilla.
Un botón grande y destacado: «Jugar».
Un botón: «Gestionar familias».
Un botón: «Estadísticas».
Un acceso claro a los ajustes.
La pantalla debe resultar atractiva para niños y niñas de Educación Primaria, pero sin parecer demasiado infantil o recargada.
La aplicación debe incluir un apartado llamado:
Desde este apartado se debe poder:
El usuario podrá introducir:
Cuatro palabras relacionadas.
Una palabra intrusa.
Debe existir una forma clara de indicar cuál de las cinco palabras es la intrusa.
Antes de guardar, la aplicación debe validar que:
Las cinco palabras contienen texto.
No hay campos vacíos.
La palabra intrusa está correctamente identificada.
Las familias creadas por el usuario deben guardarse mediante localStorage.
Por tanto:
No deben desaparecer al cerrar la aplicación.
Deben seguir disponibles al volver a abrir el archivo HTML en el mismo navegador y dispositivo.
Debe mostrarse un listado claro de las familias personalizadas creadas por el usuario.
Debe ser posible modificar cualquier familia personalizada.
Debe ser posible eliminar una familia personalizada.
Antes de eliminar, debe aparecer una confirmación para evitar borrados accidentales.
Las familias originales incluidas en la aplicación deben mantenerse disponibles y no deben poder eliminarse accidentalmente.
Las familias personalizadas deben incorporarse automáticamente al conjunto de ejercicios disponibles para las partidas.
La aplicación debe registrar y mostrar estadísticas completas.
Debe guardar al menos:
Número total de ejercicios realizados.
Número de ejercicios acertados en el primer intento.
Número de ejercicios acertados en el segundo intento.
Número de ejercicios acertados en el tercer intento.
Número de ejercicios no resueltos.
Número total de errores.
Porcentaje global de aciertos.
Tiempo total empleado jugando.
Las estadísticas deben mostrarse de una forma clara y visual.
Incluye, si resulta útil:
Tarjetas de estadísticas.
Indicadores visuales.
Barras de progreso.
Gráficos sencillos realizados sin dependencias externas.
Debe existir un botón para regresar al menú.
También debe existir una opción para reiniciar las estadísticas, solicitando confirmación antes de borrar los datos.
Las estadísticas deben guardarse mediante localStorage para que se mantengan entre sesiones.
Después de completar los 5 ejercicios debe aparecer una pantalla final especial con el título:
Esta pantalla debe incluir:
Una valoración positiva adaptada al resultado obtenido.
Una pequeña animación de celebración.
Número de ejercicios resueltos.
Número de errores.
Aciertos en el primer intento.
Aciertos en el segundo intento.
Aciertos en el tercer intento.
Ejercicios no resueltos.
Tiempo empleado en la partida.
Debe incluir tres botones grandes:
«Jugar otra partida»
«Volver al menú»
«Ver estadísticas»
La aplicación debe disponer de dos controles independientes:
Permite activar o desactivar:
Sonidos de acierto.
Sonidos de error.
Sonidos de interacción.
Permite activar o desactivar la lectura mediante síntesis de voz.
Cuando esta opción esté activada:
Las instrucciones podrán ser leídas en voz alta.
Las palabras del ejercicio deben poder escucharse.
Debe utilizarse la voz disponible en español de España cuando sea posible.
Implementa la síntesis mediante las capacidades nativas del navegador, evitando dependencias externas.
Los dos controles deben recordar la configuración elegida por el usuario mediante localStorage.
La aplicación debe estar especialmente cuidada para facilitar la lectura.
Utiliza la fuente:
OpenDyslexic
La fuente debe estar integrada en el propio archivo para que no sea necesario descargarla desde Internet.
Además:
Utiliza un tamaño de letra grande.
Mantén suficiente espacio entre palabras.
Evita bloques de texto largos.
Utiliza frases cortas y claras.
Evita fondos que dificulten la lectura.
Mantén un alto contraste.
Evita animaciones excesivas o molestas.
No utilices texto demasiado pequeño.
Las palabras deben presentarse en botones o tarjetas amplias y fáciles de pulsar.
La jerarquía visual debe ser muy clara.
Las cinco palabras deben poder distribuirse de forma adaptable según el tamaño y orientación de la pantalla.
Por ejemplo:
En pantallas grandes, varias columnas.
En móviles verticales, una distribución cómoda en varias filas.
Sin necesidad de desplazamiento horizontal.
La aplicación debe funcionar correctamente mediante:
Ratón.
Pantalla táctil.
Teclado.
Los elementos interactivos deben:
Ser grandes.
Tener una separación suficiente.
Mostrar claramente cuándo reciben el foco.
Poder utilizarse mediante teclado.
Tener etiquetas accesibles cuando sea necesario.
Utiliza:
HTML semántico.
Atributos ARIA apropiados.
Gestión visible del foco.
Buen contraste de colores.
Estados claros para las opciones seleccionadas.
Procura seguir los principios de WCAG 2.2 AA, especialmente en:
Contraste.
Tamaño de los controles.
Navegación mediante teclado.
Indicadores de foco.
Comprensión de las instrucciones.
La interfaz debe tener un diseño:
Moderno.
Profesional.
Limpio.
Atractivo.
Amable.
Educativo.
Adaptado a niños y niñas de Educación Primaria.
Utiliza:
Tarjetas.
Bordes redondeados.
Sombras suaves.
Transiciones discretas.
Iconos sencillos creados mediante CSS, SVG integrado o caracteres Unicode cuando resulte apropiado.
Botones grandes y claramente diferenciados.
No utilices recursos gráficos externos que requieran conexión a Internet.
La aplicación debe transmitir la sensación de una herramienta educativa profesional y cuidadosamente diseñada.
La aplicación debe ser completamente responsive.
Debe funcionar correctamente en:
Ordenadores con pantallas grandes.
Portátiles.
Tablets en horizontal.
Tablets en vertical.
Móviles Android.
iPhone.
La interfaz debe reorganizar automáticamente los elementos según el espacio disponible.
Debe evitar:
Desbordamientos.
Botones demasiado pequeños.
Texto cortado.
Barras de desplazamiento horizontales.
Elementos superpuestos.
Entrega un único archivo HTML completamente funcional.
El archivo debe contener:
HTML
+
CSS
+
JavaScript
+
datos de las familias
+
fuente OpenDyslexic integrada
+
sonidos generados o incluidos internamente
No utilices:
Frameworks externos.
Librerías externas.
CDN.
APIs externas.
Archivos adicionales.
El resultado debe poder guardarse con extensión .html y abrirse directamente en un navegador.
La aplicación debe funcionar correctamente incluso sin conexión a Internet.
El código debe estar:
Bien estructurado.
Comentado.
Organizado por secciones.
Fácil de modificar posteriormente.
Utiliza nombres claros para variables y funciones.
Organiza la aplicación en las siguientes vistas o secciones:
Menú principal
Juego
Pantalla de retroalimentación
Pantalla «¡Reto completado!»
Gestionar familias
Estadísticas
Ajustes
No es necesario recargar la página para cambiar entre secciones.
La navegación debe realizarse dinámicamente mediante JavaScript.
Antes de entregar el código, verifica cuidadosamente que:
Cada partida contiene exactamente 5 ejercicios.
No se repite ninguna familia durante una misma partida.
Cada ejercicio contiene exactamente 5 palabras.
Siempre hay exactamente 4 palabras relacionadas y 1 intrusa.
Las palabras se muestran en orden aleatorio.
La posición de la palabra intrusa cambia en cada presentación.
El sistema de 3 intentos funciona correctamente.
Un acierto en primer, segundo o tercer intento se registra correctamente.
Un ejercicio fallado tras 3 intentos se registra como no resuelto.
La palabra intrusa se revela correctamente tras el tercer error.
El ejercicio siguiente aparece automáticamente después de la retroalimentación.
Al terminar los 5 ejercicios aparece la pantalla «¡Reto completado!».
Los resultados de la partida se calculan correctamente.
Las estadísticas acumuladas funcionan correctamente.
Las estadísticas se conservan al cerrar y volver a abrir la aplicación.
Las familias personalizadas se guardan correctamente.
Las familias personalizadas aparecen en futuras partidas.
Se pueden editar y eliminar las familias personalizadas.
Las familias originales permanecen protegidas.
Los ajustes de sonido y lectura en voz alta funcionan de forma independiente.
Los ajustes se recuerdan entre sesiones.
La aplicación funciona con ratón, pantalla táctil y teclado.
La interfaz se adapta correctamente a orientación vertical y horizontal.
No existen enlaces, dependencias ni recursos externos.
El HTML funciona como un archivo único y autónomo.
No hay errores de JavaScript ni funcionalidades incompletas.
No dejes comentarios como «añadir más contenido aquí», «pendiente», «TODO» o funciones sin terminar.
Entrega directamente el código HTML completo y funcional, listo para copiar, guardar como:
la-palabra-intrusa.html
y abrir en cualquier navegador moderno.
No entregues explicaciones teóricas extensas ni fragmentos incompletos.
El resultado debe ser una aplicación educativa completa, funcional, atractiva, accesible y profesional.