Unreal Engine: Creando un Sistema de Ciclismo Día/Noche Dinámico con Blueprint

🌅 Introducción al Ciclo Día/Noche en Unreal Engine

Crear un ciclo de día y noche es fundamental para muchos juegos, ya que añade realismo, inmersión y variedad a los entornos. No solo afecta la iluminación visual, sino que también puede influir en la jugabilidad, el comportamiento de la IA y la atmósfera general de tu mundo.

En este tutorial, exploraremos cómo construir un sistema robusto y personalizable utilizando los potentes Blueprints de Unreal Engine. Cubriremos la configuración del sol, la luna, las estrellas, la iluminación global y el cielo dinámico para lograr una transición suave y creíble entre el día y la noche.

🛠️ Requisitos y Preparación del Proyecto

Antes de empezar, asegúrate de tener Unreal Engine 5 (o una versión similar) instalado. Utilizaremos el template de 'Third Person' o 'Blank' para este tutorial. No es necesario ningún plugin adicional, todo se hará con las herramientas nativas del motor.

📦 Configuración Inicial del Nivel

1. Crear un Nuevo Proyecto: Abre Unreal Engine y crea un nuevo proyecto de juego. Elige el template Third Person o Blank y asegúrate de que esté configurado para Blueprint y Starter Content (aunque no lo usaremos directamente, no está de más tenerlo).

2. Eliminar Elementos Innecesarios: Si estás usando un template como Third Person, puede que ya tengas un Directional Light y Sky Light. Para empezar de cero con nuestro sistema dinámico, es recomendable eliminarlos. Selecciona DirectionalLight y SkyLight en el panel Outliner y presiona Supr.

   ⚠️ Advertencia: Asegúrate de eliminar solo los componentes de luz para evitar errores en la jugabilidad si usas un template de juego.

3. Añadir un Sky Atmosphere: Este componente es crucial para simular el efecto atmosférico de la luz solar. En el Modes Panel (o Place Actors), busca Sky Atmosphere y arrástralo a tu nivel.

4. Añadir un Volumetric Cloud: Para nubes dinámicas, busca Volumetric Cloud y añádelo a tu nivel. Este componente interactúa con el Sky Atmosphere y la luz direccional para crear nubes realistas.

5. Añadir un Exponential Height Fog: Para añadir profundidad y atmósfera, busca Exponential Height Fog y arrástralo al nivel.

📈 Resumen de Componentes Iniciales

✨ Creando el Actor del Ciclo Día/Noche (BP_TimeOfDaySystem)

Vamos a crear un Blueprint que contendrá toda la lógica para nuestro sistema de día y noche. Este será el cerebro de nuestro ciclo temporal.

1. Crear Nuevo Blueprint Actor: En la carpeta Content Browser, haz clic derecho y selecciona Blueprint Class. Elige Actor como clase padre y nómbralo BP_TimeOfDaySystem.

2. Abrir BP_TimeOfDaySystem: Haz doble clic para abrirlo.

☀️ Componentes Esenciales del BP_TimeOfDaySystem

Dentro de BP_TimeOfDaySystem, añadiremos los siguientes componentes:

• Directional Light (Sol): Este componente representará el sol. En el panel Components, haz clic en Add y busca Directional Light. Nómbralo SunLight.
  • Asegúrate de marcar Atmosphere Sun Light en los detalles de SunLight para que interactúe correctamente con el Sky Atmosphere.
• Directional Light (Luna): Sí, usaremos otro Directional Light para la luna, pero lo configuraremos de manera diferente. Nómbralo MoonLight.
  • Desmarca Atmosphere Sun Light para MoonLight, ya que la luna no es una fuente de luz atmosférica principal. En Details, ajusta el Light Color a un azul oscuro o grisáceo.
• Sky Light: Este componente captura la iluminación del cielo y la aplica al entorno. Nómbralo SkyLightComp.
  • En Details, asegúrate de que Source Type esté en SLS Captured Scene.
• Static Mesh (Esfera del Cielo): En lugar de usar el BP_SkySphere predeterminado, crearemos el nuestro para mayor control. Añade un Static Mesh Component y nómbralo SkySphereMesh.
  • Asigna una esfera (EditorSphere o similar) como Static Mesh.
  • Desactiva Cast Shadows para SkySphereMesh y, en Details > Rendering, desactiva Visible si lo vamos a controlar con un Material dinámico.
• Post Process Volume (Opcional, pero recomendado): Para controlar efectos de bloom, exposición, y colores. Añade un Post Process Volume y nómbralo PostProcessVolumeComp.
  • En Details, marca Infinite Extent (Unbound) para que afecte a todo el nivel.

🌐 Configuración del Sky Atmosphere

Dentro de BP_TimeOfDaySystem, selecciona Sky Atmosphere en los Components. En sus Details, en la sección Atmosphere:

• Asegúrate de que Sun Light esté asignado a SunLight (nuestro Directional Light del sol).
• 🔥 Importante: Para que el `Sky Atmosphere` funcione correctamente, el `Directional Light` (SunLight) debe ser el *único* con la opción `Atmosphere Sun Light` activada.

⚙️ Lógica de Control del Tiempo (Blueprint)

Ahora, implementaremos la lógica en Blueprint para que el tiempo avance y los elementos de luz se muevan y cambien de intensidad.

⏰ Variables de Tiempo

Vamos a necesitar algunas variables para controlar el ciclo:

• CurrentTime (Float): Representa la hora actual del día, de 0.0 (medianoche) a 24.0 (medianoche). Marcar Expose on Spawn y Instance Editable para poder ajustarlo desde el nivel.
• DayCycleLengthInMinutes (Float): Duración de un día completo en minutos reales. Marcar Expose on Spawn y Instance Editable. Valor predeterminado: 10.0 (un día dura 10 minutos).
• TimeScale (Float): Un multiplicador para la velocidad del tiempo. Calculado internamente.
• MoonPhase (Float): 0.0 a 1.0 para controlar las fases de la luna. (Opcional, para mayor complejidad).

🔄 Event Tick: El Corazón del Sistema

En el Event Graph de BP_TimeOfDaySystem, usaremos el Event Tick para actualizar el tiempo continuamente.

1. Calcular TimeScale: En Event BeginPlay (o una función Initialize), calcula TimeScale: TimeScale = 24.0 / DayCycleLengthInMinutes / 60.0 (Esto convierte los minutos reales a unidades de tiempo de 24 horas por segundo).

2. Actualizar CurrentTime: En Event Tick:

   • Añade Delta Seconds a CurrentTime multiplicado por TimeScale.
   • Usa el nodo FMod (CurrentTime modulo 24.0) para mantener CurrentTime dentro del rango de 0 a 24.

🌞 Movimiento del Sol y la Luna

El movimiento del sol y la luna se basa en la rotación de los Directional Light.

1. Calcular Rotación: En Event Tick, después de actualizar CurrentTime:
   • Convierte CurrentTime a un ángulo de rotación. Un día completo (24 horas) es 360 grados. Así que, RotationAngle = CurrentTime * 15.0 (360/24 = 15).
   • Para el sol, queremos que esté alto al mediodía (hora 12). La rotación del Directional Light en el eje Y (Pitch) es la que determina su altura. Queremos que 0 grados sea mediodía (sol arriba) y 180 grados sea medianoche (sol abajo).
   • Usa un nodo Map Range Clamped o Lerp para mapear CurrentTime (0-24) a un rango de rotación, por ejemplo, de -90 a 270 grados en el eje Pitch.

2. Aplicar Rotación al Sol:

   • Usa Set Actor Rotation para SunLight. Establece el Pitch (Y) con el ángulo calculado. Mantén Roll (X) y Yaw (Z) a 0 o según el punto cardinal de salida/puesta que desees.

3. Aplicar Rotación a la Luna:

   • La luna debe estar en la posición opuesta al sol. Simplemente añade 180 grados al ángulo Pitch del sol, o invierte la dirección de mapeo.
   • Usa Set Actor Rotation para MoonLight con el ángulo de la luna.

💡 Intensidad de Luz y Color

La intensidad y el color del sol y la luna deben cambiar con la hora del día.

1. Intensidad del Sol:

   • Crea una Curve (Float) en el Content Browser (clic derecho -> Miscellaneous -> Curve -> CurveFloat). Nómbrala SunIntensityCurve.
   • Abre SunIntensityCurve. Añade puntos clave: (0, 0), (6, 0.1), (12, 10), (18, 0.1), (24, 0). Ajusta los valores de intensidad según tu preferencia. (12, 10) significa 10 de intensidad al mediodía. Puedes experimentar con valores más altos o más bajos.
   • En Event Tick, usa Get Float Value del SunIntensityCurve con CurrentTime como entrada. Conecta el resultado a Set Intensity del SunLight.

2. Color del Sol (Opcional, pero recomendado):

   • Crea una Curve (Vector) (CurveVector). Nómbrala SunColorCurve.
   • Añade puntos clave en SunColorCurve para simular amaneceres, atardeceres y mediodías. Por ejemplo:
     • Key 0 (Medianoche): R(0.01), G(0.01), B(0.01) (casi negro)
     • Key 5 (Amanecer): R(1.0), G(0.5), B(0.2) (naranja rojizo)
     • Key 12 (Mediodía): R(1.0), G(1.0), B(1.0) (blanco puro)
     • Key 19 (Atardecer): R(1.0), G(0.5), B(0.2) (naranja rojizo)
     • Key 24 (Medianoche): R(0.01), G(0.01), B(0.01)
   • En Event Tick, usa Get Vector Value del SunColorCurve con CurrentTime. Conecta a Set Light Color del SunLight.

3. Intensidad y Color de la Luna:

   • La luna es más simple. Su intensidad será máxima por la noche y nula de día. Puedes usar la misma lógica de SunIntensityCurve pero invertida o una curva separada (MoonIntensityCurve).
   • Para el color, un azul pálido o un gris claro suele funcionar bien. Puedes usar Set Light Color con un color fijo o una CurveVector específica para la luna.

🌌 Actualización del Sky Light

El Sky Light es crucial para la iluminación ambiental. Debe actualizarse para reflejar los cambios en el cielo.

• En Event Tick, después de actualizar el sol y la luna, añade un nodo Recapture Sky al SkyLightComp.
  ⚠️ Advertencia: Recapturar el Sky Light en cada tick puede ser costoso en rendimiento. Considera hacerlo menos frecuentemente (ej. cada 0.5 segundos) o solo cuando la intensidad de luz cambie significativamente para juegos con rendimiento crítico.

☁️ Controlando el Cielo y las Nubes

Para un ciclo día/noche completo, no solo movemos las luces, sino que también adaptamos la apariencia del cielo y las nubes.

🌍 Sky Atmosphere

El componente Sky Atmosphere reacciona automáticamente a la posición y color del SunLight (si está marcado como Atmosphere Sun Light). Sin embargo, puedes ajustar ciertos parámetros dinámicamente si lo deseas:

• Rayleigh Scattering: Afecta al color azul del cielo.
• Mie Scattering: Afecta a la dispersión de la luz y el halo alrededor del sol.

Para un control más avanzado, puedes crear un Dynamic Material Instance para el Sky Atmosphere y ajustar sus parámetros directamente desde Blueprint. Sin embargo, para este tutorial, la configuración por defecto y la interacción con SunLight serán suficientes para un efecto realista.

🌫️ Exponential Height Fog

La niebla también debe adaptarse. Generalmente, es más densa y visible durante la noche o al amanecer/atardecer.

• Fog Density: Puedes usar una CurveFloat similar a la intensidad del sol, pero invertida, para que la densidad sea mayor de noche.
• Fog Inscattering Color: Cambia el color de la niebla para que se vea más azulada de noche y más cálida de día.
• Start Distance: Ajusta la distancia a la que la niebla comienza a ser visible.

☁️ Volumetric Clouds

El Volumetric Cloud se ajusta en gran medida automáticamente con los cambios de luz. Sin embargo, puedes hacer más dinámicas las nubes:

• Cloud Opacity: Puedes reducir la opacidad de las nubes durante la noche o con mal tiempo.
• Material Parameters: Si creas un material personalizado para tus nubes volumétricas, puedes exponer parámetros para controlar la densidad, el tipo de nube o incluso la velocidad del viento, y actualizarlos a través de Blueprint.

🌟 Estrellas y Efectos Nocturnos

Para una noche convincente, necesitamos estrellas y, opcionalmente, una vía láctea.

🌠 Material para las Estrellas

1. Crear Material: En Content Browser, clic derecho -> Material. Nómbralo M_Stars.

2. Configurar Material:

   • Cambia Blend Mode a Additive.
   • Cambia Shading Model a Unlit.
   • Para la textura, puedes importar una textura de estrellas o generar una simple con ruido.
   • Usa un nodo Texture Sample con tu textura de estrellas.
   • Conecta la salida RGB del Texture Sample a Emissive Color.
   • Añade un parámetro Scalar llamado StarVisibility y multiplícalo por el Emissive Color. Esto nos permitirá controlar la visibilidad de las estrellas desde Blueprint.

🌌 Aplicar Estrellas al SkySphereMesh

1. Asignar Material: En BP_TimeOfDaySystem, selecciona SkySphereMesh.
2. En Details, en la sección Materials, asigna M_Stars al slot de material.

💫 Control de Visibilidad de Estrellas desde Blueprint

1. Crear Dynamic Material Instance: En Event BeginPlay de BP_TimeOfDaySystem:

   • Create Dynamic Material Instance del SkySphereMesh (M_Stars). Guarda la referencia en una variable (SkyStarsMID).

2. Actualizar StarVisibility: En Event Tick:

   • Usa una CurveFloat (StarVisibilityCurve) para controlar StarVisibility en función de CurrentTime.
     • Ejemplo: (0, 1), (6, 0), (18, 0), (24, 1) (visibles de noche, invisibles de día).
   • Usa Set Scalar Parameter Value en SkyStarsMID con el nombre StarVisibility y el valor de la curva.

🎨 Ajustes Finales y Post-Procesado

Para pulir nuestro sistema, ajustaremos la exposición, el bloom y otros efectos visuales.

📸 Post Process Volume

Selecciona el PostProcessVolumeComp en BP_TimeOfDaySystem.

• Exposición:
  • En Details > Exposure > Meter Mode, selecciona Manual.
  • Crea una CurveFloat llamada ExposureCurve.
  • Define puntos clave: (0, -2) (noche oscura), (6, 0) (amanecer), (12, 1) (mediodía brillante), (18, 0) (atardecer), (24, -2).
  • En Event Tick, usa Set Post Process Settings en PostProcessVolumeComp y conecta el valor de la ExposureCurve al Exposure Compensation.
• Bloom: Ajusta la intensidad del bloom para que sea más pronunciado de noche (luces de la ciudad, luna) y más sutil de día.
• Color Grading: Puedes usar Color Grading para cambiar el tinte general del mundo, por ejemplo, un ligero tono azulado por la noche.

🔄 Recapitulación del Event Tick

Tu Event Tick en BP_TimeOfDaySystem debería seguir este flujo:

1. Actualizar CurrentTime.
2. Calcular y Aplicar Rotación a SunLight y MoonLight.
3. Calcular y Aplicar Intensidad y Color a SunLight y MoonLight usando Curves.
4. Actualizar el SkyLightComp (Recapture Sky).
5. Actualizar Visibilidad de Estrellas en SkyStarsMID.
6. Actualizar Post Process Settings (exposición, bloom, etc.) en PostProcessVolumeComp.
7. Actualizar parámetros de niebla (Exponential Height Fog) y nubes (Volumetric Cloud) (Opcional, si has expuesto parámetros).

✅ Probando y Optimizando

Una vez que hayas implementado toda la lógica, arrastra una instancia de BP_TimeOfDaySystem a tu nivel. Puedes ajustar CurrentTime y DayCycleLengthInMinutes directamente en el panel Details del actor para ver los cambios rápidamente.

• Rendimiento: Recapture Sky en cada tick puede ser costoso. Para optimizar, considera llamar a Recapture Sky solo cuando el SunLight haya rotado un cierto ángulo, o cada X segundos. Lo mismo aplica para actualizaciones de materiales complejos. Para Directional Light y Sky Light, asegúrate de que Mobility esté en Movable.
• Estética: Dedica tiempo a ajustar las curvas de intensidad, color y exposición. Pequeños ajustes pueden tener un gran impacto visual. Experimenta con diferentes texturas de estrellas y materiales de nubes.
• Añadir Audio: Para una inmersión completa, considera añadir sonidos ambientales que cambien entre día y noche (cantos de pájaros, grillos, viento).

¡Felicidades! Has creado un sistema de ciclo día/noche dinámico y personalizable en Unreal Engine. Esto sienta las bases para un mundo de juego mucho más vivo y reactivo.