Skybox Equirrectangular vs Cubemap vs HDRI: ¿cuál usar?

En resumen

Si tu plataforma objetivo es Unity URP/HDRP, Unreal 5 o WebGL moderno, usa equirrectangular (equirectangular) 2:1, en PNG o EXR. Si apuntas al pipeline built-in antiguo de Unity, a GPUs móviles sin muestreo panorámico de alta precisión o a Three.js con reflejos de cubo, convierte a cubemap (6 caras). Usa HDRI (.hdr/.exr) cuando necesites contribución de iluminación IBL, no cuando solo quieras un backdrop (fondo). Los tres formatos describen la misma escena: lo único que cambia es cómo se desempaquetan los píxeles.

Una regla práctica: si tu motor ya trae integrado un shader de skybox "Panoramic" o "HDRI Backdrop" y trabajas sobre una GPU moderna, quédate en equirrectangular y sáltate el paso de conversión por completo. No pierdes nada y mantienes el pipeline simple. Los cubemaps son la respuesta correcta cuando el motor o el hardware te obligan, no cuando simplemente sigues tutoriales viejos escritos para Unity 5.

Generador de Skybox con IA →

Cubemap Generator →

Los tres formatos de un vistazo

Los tres formatos representan los mismos datos de fondo: una vista de 360°×180° de un entorno. Las diferencias son puramente sobre cómo se aplana esa información esférica dentro de un archivo y cómo la desempaqueta la GPU o el renderizador en tiempo de ejecución. Un panorama equirrectangular y un cubemap construidos a partir de la misma fuente son matemáticamente equivalentes: los mismos fotones, distinta geometría. El HDRI añade una tercera dimensión: píxeles lineales de alto rango dinámico en lugar de valores de 8 bits codificados en gamma. Entender esas tres dimensiones (disposición, geometría y profundidad de bits) es todo el juego.

Equirrectangular (panorama 2:1)

El formato equirrectangular es el canónico para guardar un entorno 360° completo en un solo archivo. El nombre viene de la proyección cartográfica homónima: la longitud se mapea al eje horizontal, la latitud al eje vertical, y el resultado es un rectángulo con relación de aspecto 2:1. Una imagen de 4096×2048 mide 360 grados de ancho y 180 de alto: un espejo exacto de la esfera que representa.

La proyección genera una distorsión predecible. Cerca del ecuador (el centro vertical de la imagen), los píxeles están densamente empaquetados y guardan la proporción. Cerca de los polos (los bordes superior e inferior), los píxeles se estiran muchísimo: una sola franja horizontal cerca de la parte de arriba puede representar apenas 1° de arco vertical sobre la esfera y, aun así, recibe tantos píxeles como una franja cercana al ecuador que abarca 10°. Por eso los cielos generados como panoramas equirrectangulares se ven borrosos arriba y abajo cuando los miras planos, pero correctos cuando se mapean sobre una esfera o se usan dentro de un shader de skybox.

Para los motores modernos, esa distorsión polar no es un problema. El shader de skybox se encarga internamente del remapeado de UV. El shader Panoramic de Unity, el actor HDRI Backdrop de Unreal, Babylon.js y el EquirectangularReflectionMapping de Three.js aceptan directamente un equirrectangular 2:1 y hacen el mapeado esférico en la GPU. Tú le das al motor una imagen; él se ocupa del resto.

Ventajas: Un solo archivo. Fácil de inspeccionar en cualquier visor de imágenes. Ampliamente soportado por las herramientas modernas. Fácil de editar en Photoshop o GIMP si necesitas retocar la costura. Es el formato de salida estándar de los generadores de panoramas 360° con IA, de las cámaras 360° y de la mayoría de herramientas de pintado de entornos. Puedes inspeccionar cualquier archivo equirrectangular en el Visor 360 Online, sin instalar nada.

Desventajas: La distorsión polar dificulta el pintado a mano. No es el formato nativo de las GPUs antiguas ni de las móviles. Algunos flujos de trabajo veteranos con reflection probes esperan cubemaps. Un equirrectangular de resolución muy alta (digamos, 8192×4096) desperdicia buena parte de su presupuesto de píxeles en unos polos sobremuestreados.

Para la mayoría de flujos de trabajo en 2026, equirrectangular es el punto de partida correcto. Convierte solo cuando el sistema de destino lo exija de verdad.

Si quieres profundizar en el formato en sí, lee ¿Qué es una imagen equirrectangular?.

Cubemap (6 caras)

Un cubemap representa el entorno como seis caras cuadradas: X positivo, X negativo, Y positivo, Y negativo, Z positivo y Z negativo o, dicho en claro, derecha, izquierda, arriba, abajo, delante y detrás. Cada cara es un render en perspectiva normal con un campo de visión de 90°. Une las seis y tienes una esfera completa, sin distorsión polar y con densidad de píxeles uniforme en toda la superficie.

Convenciones de nombres

Los nombres de archivo de las caras siguen un puñado de convenciones de la comunidad y de las cadenas de herramientas, no una regla que ningún motor imponga de verdad. El propio asset Cubemap de Unity asigna las seis texturas mediante seis ranuras del Inspector: ahí no hace falta ningún nombre de archivo concreto. Unreal ni siquiera tiene que responder a la pregunta de cómo nombrar seis caras, porque de entrada no tiene ruta de importación para seis archivos sueltos: metes directamente la fuente equirrectangular y Unreal la desenvuelve en una TextureCube (LongLat unwrap) o la muestrea en vivo a través del actor HDRI Backdrop. Los nombres de abajo son patrones que distintos pipelines y tutoriales han adoptado por comodidad organizativa:

Lo que de verdad importa es que cada cara acabe en la ranura correcta cuando la asignes: una asignación de cara equivocada, y no un nombre de archivo "incorrecto", es la causa número uno de skyboxes del revés o invertidos. Ante la duda, carga cada cara por separado y verifica su orientación antes de procesarlas en lote. El Cubemap Generator te deja exportar con el patrón de nombres que encaje con tu cadena de herramientas, únicamente para que los seis archivos se ordenen de forma predecible en tu proyecto, no porque ningún motor lo exija.

Dónde brillan los cubemaps

Unity antiguo (built-in render pipeline): El pipeline built-in de Unity es anterior al soporte generalizado de shaders de muestreo panorámico. El material de skybox 6-Sided por defecto espera seis texturas separadas, una por cara. Si publicas un juego móvil sobre el pipeline built-in, o mantienes un proyecto anterior a URP, el cubemap es tu única opción práctica sin reescribir el sistema de skybox entero.

Unreal Cube Render Target: Los actores de reflection capture y los cube render targets de UE5 son nativamente cubemaps. Si horneas reflejos en un nivel estático o montas un flujo de trabajo con reflection probes, estás trabajando con cubemaps a nivel de motor aunque hayas importado assets equirrectangulares.

Three.js CubeTextureLoader: El CubeTextureLoader de Three.js espera seis archivos. Si construyes una escena WebGL con THREE.CubeReflectionMapping para materiales con environment mapping, necesitas archivos de cara individuales. THREE.EquirectangularReflectionMapping es la alternativa para montajes modernos, pero CubeTextureLoader sigue siendo el valor por defecto en muchas plantillas de inicio.

Rendimiento en GPU móvil: En hardware Android de gama baja, muestrear panorámicamente desde una única textura 2:1 puede salir más caro que muestrear desde un cubemap, porque la GPU tiene que calcular la proyección de UV por fragmento. Un cubemap prehorneado traslada esas cuentas al momento de carga. La diferencia práctica es pequeña en los móviles de gama media actuales, pero cuenta en hardware económico y a escala.

Ventajas: Densidad de píxeles uniforme, sin resolución desperdiciada en los polos. Formato nativo de los reflection probes. Obligatorio en los pipelines antiguos. Disposición de caras predecible, que un artista puede pintar a mano.

Desventajas: Seis archivos que gestionar. Convenciones de nombres fragmentadas entre motores. Las costuras entre caras exigen cuidado si pintas a mano. Más pasos de conversión si tu fuente es equirrectangular.

Puedes convertir cualquier equirrectangular 2:1 en cubemap dentro del navegador con nuestro Cubemap Generator: todo en el front-end, sin subir nada, gratis.

HDRI (imagen de alto rango dinámico)

HDRI son las siglas de High Dynamic Range Image. La parte clave es "alto rango dinámico". Un PNG estándar de 8 bits guarda 256 valores discretos por canal, con un rango dinámico típico de unos 2 o 3 pasos de luz. Un HDRI en coma flotante de 32 bits guarda valores fraccionarios que van desde casi cero hasta decenas de miles: un rango dinámico de más de 20 pasos. En términos prácticos, el sol de un HDRI real de exterior es cien mil veces más brillante que la sombra profunda bajo un automóvil, y el archivo conserva esa proporción intacta. Si prefieres generar uno a partir de un prompt en lugar de capturarlo, el Generador de HDRI con IA devuelve un .hdr de Radiance directamente. Antes de meter cualquiera de los dos archivos en un renderizador, ábrelo en el navegador con el Visor de HDRI para comprobar exposición, resolución y la relación de aspecto 2:1.

Esa proporción es justo lo que hace útil al HDRI para la iluminación basada en imagen (IBL). Cuando un renderizador muestrea un mapa de entorno HDRI para calcular la contribución difusa y especular, usa los valores reales de luminancia del archivo para calcular rebotes de luz y reflejos especulares realistas. Un sol brillante en un HDRI de verdad producirá un especular nítido sobre una superficie pulida. La misma escena guardada como LDR de 8 bits producirá un reflejo quemado y plano: el renderizador trata todo el cielo como si tuviera más o menos el mismo brillo, porque el archivo no puede representar la diferencia.

Formatos de archivo

Los dos contenedores de HDRI dominantes son:

• Radiance .hdr (también llamado RGBE): un formato veterano creado por Greg Ward en los años ochenta. Guarda valores de 32 bits como una mantisa de 8 bits más un exponente compartido de 8 bits por píxel (codificación RGBE). Muy bien soportado por Blender, Substance Painter, Marmoset y la mayoría de herramientas DCC. Archivos más pequeños que EXR. Es el formato que produce el Generador de HDRI con IA.
• OpenEXR .exr: el estándar moderno de los efectos visuales y el render de gama alta. Coma flotante real de 16 o 32 bits por canal, sin el compromiso del exponente compartido. Admite formatos multicapa, multiparte y en mosaico. Preferido en los pipelines de VFX, y soportado por Blender Cycles y por el HDRI Backdrop de Unreal Engine con entrada .exr.

HDRI vs backdrop: una distinción honesta

Mucho contenido sobre desarrollo de juegos difumina la línea entre "skybox HDRI" e "iluminación HDRI". No son lo mismo. Si solo quieres un cielo bonito detrás de tu nivel y no dependes del mapa de entorno para la contribución de luz, no necesitas HDRI de verdad. Un panorama equirrectangular LDR de 8 bits se verá igual de bien con una fracción del tamaño de archivo. El cielo es un backdrop; no necesita precisión de 32 bits.

Necesitas HDRI real cuando:

• Tus materiales basados en física necesitan reflejos especulares precisos de una fuente de luz dominante (el sol, una area light, un letrero de neón).
• Quieres una luz ambiental suave y direccional procedente del entorno, sin colocar luces explícitas.
• Haces look-dev o visualización de producto, donde la precisión de la exposición importa.
• Estás igualando un entorno real fotografiado para producción virtual.

Una nota honesta sobre el HDRI generado con IA

Los generadores de panoramas con IA, incluido el nuestro, el Generador de HDRI con IA, producen píxeles LDR de 8 bits. La salida se envuelve después en un contenedor Radiance .hdr, lo que técnicamente la convierte en un "archivo HDRI". Pero los datos de píxel siguen siendo de 8 bits, con tone mapping aplicado y codificados en gamma. El sol de un cielo generado con IA no es cien mil veces más brillante que las sombras: está como mucho 3 o 4 pasos por encima del neutro, igual que en cualquier imagen de 8 bits.

Qué significa esto en la práctica: el HDRI con IA es excelente para IBL ambiental suave, para marcar la atmósfera, para interiores de ficción y para tener variedad de backdrops. Te dará un especular verosímil a partir de las zonas brillantes del cielo. No te dará el especular solar nítido y físicamente preciso que sí ofrece un HDRI fotografiado con horquillado de exposiciones de Poly Haven. Los dos son útiles. Ten claro cuál necesitas antes de empezar.

Para HDR de verdad, usa Poly Haven (CC0, capturado, excelente calidad) o Lumiere para HDRI de calidad de estudio. Usa la generación con IA para ganar velocidad, volumen y entornos de ficción.

Rutas de conversión

Entender las rutas de conversión entre formatos te ahorra idas y vueltas innecesarias y operaciones con pérdida. Antes de convertir nada, abre el archivo de origen en el Visor de HDRI para inspeccionar exposición, resolución y la relación de aspecto 2:1; después convierte con las herramientas de abajo.

Equirrectangular → Cubemap es la dirección más habitual. Opciones:

• Cubemap Generator (funciona en el navegador, gratis, sin subir archivos, admite las tres convenciones de nombres)
• Blender Compositor: usa un nodo Equirectangular que alimente seis renders con una cámara configurada en proyección de cubo
• Paquete npm panorama-to-cubemap: una biblioteca de JavaScript que corre en Node.js y devuelve los PNG de cada cara por separado

Cubemap → Equirrectangular es menos frecuente, pero a veces hace falta de verdad: por ejemplo, heredas un proyecto que solo trae assets de cubemap y nunca guardó la fuente equirrectangular, y necesitas editar el entorno como una única imagen panorámica o reutilizarlo en un visor que espera entrada 2:1. Nuestro Convertidor de Cubemap a Panorama hace exactamente eso en el navegador: sube las seis caras (los nombres se emparejan automáticamente con los patrones de arriba, con reasignación manual si no coinciden con ninguno), elige un ancho de salida y las reensambla en un solo panorama equirrectangular, sin subida al servidor. Photoshop (Deformación de perspectiva más montaje manual) y Blender (render con un rig de cámaras) siguen siendo alternativas manuales si necesitas más control sobre el resultado del que te da una herramienta automática.

PNG LDR de 8 bits → contenedor HDR: Nuestro Generador de HDRI con IA envuelve el panorama LDR en un archivo Radiance .hdr para que Blender, Unreal y Unity HDRP puedan leerlo sin pasos de conversión por tu parte. Los valores de píxel siguen siendo LDR de 8 bits. La captura HDR real, esa que alcanza un rango dinámico genuino de más de 20 pasos, exige fotografía con horquillado de exposiciones (de 5 a 7 tomas, fusionadas en Lightroom o PTGui) o un render en un motor basado en física con un modelo de cámara correcto. No existe ninguna forma algorítmica de recuperar HDR real a partir de una sola imagen de origen de 8 bits.

¿Qué formato deberías usar?

¿Usas URP / HDRP / UE5 / WebGL / un motor moderno?
├─ Sí → Usa equirrectangular. El motor lo gestiona de forma nativa.
└─ No → ¿Estás en Unity built-in antiguo o en móvil?
    ├─ Sí → Convierte a cubemap.
    └─ No → ¿Haces iluminación IBL (no solo backdrop)?
        ├─ Sí → Usa HDRI (32 bits reales, p. ej. Poly Haven).
        └─ No → Quédate en equirrectangular.

Referencia rápida por motor:

• Unity URP: material de skybox Panoramic. Usa equirrectangular (PNG o EXR). Un solo archivo, sin conversión.
• Unity HDRP: componente de volumen HDRI Sky. Usa EXR o HDR equirrectangular para la iluminación; PNG equirrectangular si solo lo quieres de backdrop.
• Unity built-in: material de skybox 6-Sided. Usa cubemap (6 caras). Convierte con nuestro Cubemap Generator.
• Unreal Engine 5: actor HDRI Backdrop. Usa HDR/EXR equirrectangular. Con Lumen, Unreal tirará del mapa de entorno para la contribución de luz indirecta: aquí conviene un HDRI genuino si quieres los mejores resultados.
• Blender Cycles: shader de World con un nodo Environment Texture en modo Equirectangular. Usa HDR/EXR equirrectangular. La profundidad de bits afecta directamente a la calidad de los reflejos especulares sobre materiales reflectantes.
• Blender Eevee: el mismo montaje de nodos que en Cycles. Eevee usa cubemaps de reflejo internamente, pero la entrada sigue siendo equirrectangular: Eevee hornea sus propios cubemaps a partir de ella al cargar la escena. No necesitas aportar ningún cubemap a mano.
• Three.js: EquirectangularReflectionMapping para montajes modernos (un único PNG/HDR equirrectangular) o CubeTextureLoader para montajes antiguos (6 archivos de cara). Si empiezas un proyecto nuevo, usa equirrectangular: simplifica bastante el pipeline de assets.
• WebXR / A-Frame: el componente a-sky acepta equirrectangular. Tanto los visores de imágenes 360° como las escenas VR completas usan el mismo formato. No hace falta cubemap salvo que implementes tu propio shader de reflejos.

Errores comunes

1. Costura visible en la línea de cierre. Los panoramas equirrectangulares se cierran por el borde izquierdo y el derecho. Si la columna de píxeles del borde izquierdo no coincide con la del borde derecho, aparece una franja vertical visible en tu skybox. Esto pasa sobre todo cuando la generación con IA añade ruido aleatorio o viñeteado en los bordes de la imagen. El Generador de Skybox con IA incluye un reescritor de prompts y un pipeline de generación afinados específicamente para minimizar los artefactos de costura: el modelo está condicionado para producir cielos que se cierran sin costura. Si generas con un modelo de imagen genérico, aplica una pasada de mezclado horizontal en Photoshop (desplaza la imagen un 50 %, funde el nuevo centro y vuelve a desplazarla).

2. Orientación de cara equivocada en el cubemap. Cada motor espera las caras en un sistema de coordenadas y con una lateralidad distintos. Unity usa un sistema levógiro con Y hacia arriba; Unreal usa internamente un sistema levógiro con Z hacia arriba para sus cube render targets y sus reflection captures, aunque nunca llegues a entregarle seis archivos sueltos. El mismo asset de cubemap puede dar resultados espejados o rotados en motores distintos. El flujo más seguro es verificar cada cara cargándola como una textura normal antes de montar el skybox final, sea cual sea el patrón de nombres que hayas usado. Nuestro Cubemap Generator exporta con los nombres de ranura 6-Sided de Unity, con el estilo px/nx para Three.js y herramientas genéricas, o con el estilo pos_x de OpenGL: el preset de Unity bautiza cada archivo con las etiquetas de las propias ranuras Skybox/6 Sided de Unity para que puedas emparejarlos por nombre en el Inspector, pero el nombre de archivo no arregla una cara mal asignada; eso solo lo arregla asignarla bien.

3. Contenido de 8 bits tratado como HDR. Cargar un equirrectangular PNG de 8 bits en Blender Cycles como World Environment Texture funciona técnicamente —Blender lo acepta—, pero no vas a obtener un especular físicamente plausible del sol. El archivo sencillamente no tiene suficiente rango dinámico. Blender comprimirá todos los píxeles dentro de la misma banda estrecha y tus reflejos especulares saldrán blandos y sin detalle. Si tu escena depende de la calidad del IBL, necesitas datos de origen HDR reales. Esto se aplica igual a los archivos .hdr generados con IA: el formato del contenedor es HDR, pero el contenido puede ser LDR. Revisa el histograma en tu herramienta DCC antes de casarte con una fuente HDRI.

4. Desajuste de resolución entre la fuente y el tamaño de cara del cubemap. Si extraes una cara de cubemap de 1024×1024 desde un equirrectangular de origen de 2048×1024, estás muestreando de unos 512×512 píxeles de datos de origen útiles por cara (el resto se va a las caras contiguas). El resultado se verá pixelado, sobre todo en las esquinas de cada cara, donde la distorsión de perspectiva es mayor. Regla práctica: el ancho de tu equirrectangular de origen debería ser al menos 4× el tamaño de cara que quieres, si buscas resultados limpios. Para una cara de 1024×1024, parte de un equirrectangular de 4096×2048. Para una cara de 2048×2048 (el techo de calidad para la mayoría de usos en juegos), usa una fuente de 8192×4096.

Genera tu primer skybox

Si empiezas desde cero, el camino más rápido es describir tu entorno en lenguaje natural y generar directamente un panorama equirrectangular. El Generador de Skybox con IA se encarga de la optimización del prompt, del cierre sin costura y de la salida 2:1 en un solo paso. Las imágenes generadas están listas para soltarlas en Unity URP, HDRP, Unreal 5 o cualquier escena WebGL sin ninguna conversión.

Si tu objetivo es un pipeline antiguo o un motor móvil que exige seis caras de cubemap, pasa la salida por el Cubemap Generator. Elige el patrón de nombres que encaje con tu cadena de herramientas (nombres de ranura 6-Sided de Unity, estilo px-nx genérico para Three.js, o estilo pos_x de OpenGL), descarga el zip e impórtalo. Todo el pipeline, de la generación al cubemap, corre en el navegador sin subir nada a ningún servidor.

Para iluminación IBL en concreto, mira el Generador de HDRI con IA y su exportación a Radiance .hdr. Recuerda la advertencia sobre LDR de más arriba: úsalo para ambiente suave y atmósfera, y complétalo con assets de Poly Haven cuando necesites precisión en el especular duro.

Lecturas relacionadas

• ¿Qué es una imagen equirrectangular?
• HDRI con IA para Blender, Unreal y Unity
• Cómo escribir prompts para panoramas 360°
• Cubemap con IA para Unity gratis: la alternativa online
• Cómo hacer una foto 360°