# Reducir el movimiento no esencial sin ocultar el significado

> Respeta la preferencia de reducir el movimiento para ofrecer una presentación más tranquila, manteniendo la información esencial y señales claras de respuesta a las acciones.

- URL: https://oneshotgems.ai/es/topics/reduced-motion-in-games
- Categoría: Para desarrolladores de juegos
- Tipo: Guía
- Actualizado: 5 de octubre de 2026

Un juego de navegador puede contener movimiento de cámara, vibración de la pantalla, paralaje, escalado repetido y partículas decorativas. Algunos movimientos comunican el estado esencial del juego, mientras que otros son una presentación. Respete la preferencia del sistema operativo del jugador por el movimiento reducido y decida qué efectos se pueden atenuar, reemplazar o eliminar sin ocultar un golpe, un cambio de puntuación o una señal de dirección.

## Separa la información útil del movimiento decorativo

Usa la característica de medios prefers-reduced-motion para detectar la preferencia en CSS y aplícala también a los efectos controlados por código cuando sea necesario. Por ejemplo, elimina el zoom repetido del fondo, pero conserva una breve señal de color o texto que indique una acción correcta. Reducir el movimiento no debe hacer que se pierda información: el jugador debe seguir entendiendo qué ha cambiado y qué hacer después.

No elimines todas las animaciones automáticamente. Un objetivo en movimiento puede ser parte de la mecánica, mientras que el temblor de cámara tras una colisión puede ser decorativo. Conserva el movimiento necesario para indicar ubicación o tiempo y, cuando sea posible, ofrece otra señal clara. MDN explica que esta preferencia pide reducir o sustituir el movimiento no esencial.

## Prueba de transiciones y efectos repetidos.

Revise el movimiento a lo largo de toda la experiencia: menús, carga, transiciones de cámara, estados de victoria y pérdida y efectos recurrentes durante una ejecución larga. Una configuración que solo deshabilita una animación CSS puede omitir JavaScript o el movimiento del lienzo. Mantenga la preferencia constante en todas las capas de renderizado y evite cambios repentinos si la configuración del sistema cambia mientras un juego está activo.

Activa la opción del sistema operativo para reducir el movimiento y comprueba que los jugadores todavía puedan localizar objetivos, reconocer impactos y entender las transiciones. Prueba juntos los efectos CSS, los programados y los del lienzo. MDN documenta la función multimedia y cómo ofrecer un estilo alternativo cuando la preferencia está activada.

## Preguntas

**¿El movimiento reducido debería detener todo movimiento en un juego?** No. Es imprescindible cierto movimiento para jugar o comunicar el estado. Reduzca o reemplace los efectos no esenciales y preserve una forma clara de comprender el tiempo, la ubicación y la retroalimentación.

**¿Cómo detecta una página la preferencia?** CSS puede usar la característica de medios prefers-reduced-motion. Los efectos programados y los dibujados en canvas también deben consultar esa preferencia para mantener una presentación coherente.

## Sigue tu curiosidad

- [Haz que los colores del juego sean accesibles sin depender solo del color](https://oneshotgems.ai/es/topics/accessible-game-colors): Utilice contrastes y señales visuales redundantes para que los jugadores puedan distinguir los estados del juego cuando los tonos sean similares o no estén disponibles para ellos.
- [Diseña controles de audio útiles para juegos de navegador](https://oneshotgems.ai/es/topics/game-audio-controls): Ofrezca a los jugadores control sobre el sonido del juego con un comportamiento claro de silencio y volumen, y maneje las restricciones de reproducción automática del navegador sin interrumpir las señales de audio del juego.

## Más información

- [MDN: prefers-reduced-motion](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/%40media/prefers-reduced-motion)
- [MDN: consultas de medios para accesibilidad](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Media_queries/Using_for_accessibility)

---
Página canónica: https://oneshotgems.ai/es/topics/reduced-motion-in-games