¿Qué es el mapeo por paralaje?

El mapeo por paralaje es una técnica que aumenta la profundidad y el detalle de las superficies texturizadas para gráficos generados por computadora.
El mapeo por paralaje es una herramienta muy empleada para crear la ilusión de detalles en las superficies sin añadir polígonos extra a un modelo en 3D. Esta tecnología permite que las texturas revelen irregularidades, como bultos y abolladuras, cuando se ven desde distintos ángulos.

a textured bluetooth speaker
Aunque el mapeo por paralaje es una función avanzada, se puede implementar fácilmente con las herramientas de modelado en 3D adecuadas. En esta guía, explicaremos cómo funciona el mapeo por paralaje, indicaremos unas cuantas técnicas y explicaremos sus aplicaciones prácticas.

Introducción al mapeo por paralaje

¿Qué es un mapa de paralaje?

Un mapa de paralaje es un tipo de textura que explica la profundidad o la altura de los detalles de una superficie, de forma parecida a un mapa topográfico.

Por ejemplo, si estás mirando un gráfico en 3D de una pared de ladrillo, se ve plano sin efectos especiales. Pero el mapeo por paralaje hace que la pared de ladrillo quede más realista al añadir a la imagen plana líneas de lechada hendidas. Esta tecnología “engaña” al mediante la manipulación de texturas para que parezcan tridimensionales en un espacio bidimensional.

Esta tecnología tiene muchísimas aplicaciones, entre las que se incluyen las siguientes:

  • Juegos de video
  • Películas y animación
  • Realidad virtual y realidad aumentada
  • Diseño web

Fundamentos de la percepción de la profundidad

Tus ojos y tu cerebro colaboran para procesar información visual y percibir la profundidad. El cerebro determina la profundidad con señales binoculares, que comparan las imágenes de cada ojo para crear una imagen cohesiva, lo que te ayuda a juzgar la profundidad.

Sin embargo, también podemos juzgar la profundidad con un solo ojo, gracias a las señales monoculares. La perspectiva, la sombra, el tamaño relativo y los gradientes de textura le transmiten a tu cerebro información importante sobre la profundidad.

El mapeo por paralaje funciona debido a la forma en la que el cerebro humano percibe la profundidad. Cuando te mueves, los objetos más cercanos cambian más que los que están lejos. El mapeo por paralaje utiliza este principio para conseguir que las texturas de los objetos cambien en respuesta a tu ángulo de visión, que simula la profundidad que tu cerebro espera ver.

Por ejemplo, cuando circulas en un coche, los árboles cercanos parecen pasar rápidamente, mientras que las montañas lejanas se “mueven” con lentitud. Esta diferencia en el movimiento te transmite una sensación de profundidad. El mapeo por paralaje imita esta experiencia haciendo que los detalles cercanos se muevan un poco más, lo que genera la ilusión de profundidad en una superficie plana.

Texturas de paralaje

Las texturas de paralaje también se llaman “mapas de altura” o “mapas de desplazamiento”. Son imágenes en escala de grises en las que los tonos de gris representan la altura de los detalles de la superficie. En las zonas elevadas, se emplea un tono más claro y, en las más bajas, tonos más oscuros.

Estas texturas permiten dar profundidad a superficies que de otro modo serían planas sin tener que añadir más polígonos. De este modo, se consigue que las imágenes sean más realistas sin perjuicio de la velocidad ni de los tiempos de carga.

El mapeo por paralaje utiliza texturas para establecer una referencia de cómo debería cambiar cada elemento de la textura principal en función del ángulo de visión. El algoritmo del mapa interpreta los valores de la escala de grises de la textura de paralaje para crear una imagen más realista.

Creación de texturas de paralaje

Para generar una textura de paralaje, sigue estos pasos:

  1. Parte de una imagen base. Esta es una imagen con una textura en 2D de la superficie que quieres replicar, como, por ejemplo, ladrillos, azulejos o piedra.
  2. Determina la altura. Visualiza qué partes de la textura deben estar a mayor altura y cuáles a una menor.
  3. Ponla en escala de grises. Usa un editor de gráficos para pintar las áreas con tonos de gris (claro para las zonas elevadas y más oscuro para las que tengan una menor altura).
  4. Perfecciona el diseño. Difumina la textura y dale y contraste para generar transiciones más fluidas entre todas las áreas.

Tampoco tienes por qué hacer todo esto manualmente. Adobe Photoshop incluye herramientas para crear y perfeccionar imágenes en escala de grises. Adobe Substance 3D es una herramienta más avanzada que permite crear texturas de paralaje con solo unos clics.

Técnicas de mapeo por paralaje

Funcionamiento del mapeo por paralaje

El funcionamiento del mapeo por paralaje se basa en varios principios subyacentes:

  • El desplazamiento de la textura. El mapeo por paralaje funciona mediante el desplazamiento de las coordenadas de la textura. Cambia la posición de las muestras de la textura en función de la perspectiva desde la que se contempla para generar la ilusión de profundidad.
  • Mapas de altura y de desplazamiento. El mapeo por paralaje utiliza un mapa en escala de grises para orientar el grado de desplazamiento de la textura.
  • Ángulo de visión. El efecto del mapeo por paralaje cambia en función del ángulo de visión de la superficie. El desplazamiento se va ajustando a medida que cambia el ángulo para simular una superficie en 3D.

Imagina que estás mirando un libro abierto. Cada página representa una capa de profundidad en una textura. Si miras el libro directamente en un ángulo de 90°, podrás ver cada página con claridad. Ahora bien, si inclinas el libro, las páginas que tengas más cerca taparán a las que están más lejos. El mapeo por paralaje simula este efecto en las texturas bidimensionales mediante un mapa de altura para indicar cuáles son las texturas que tienes más cerca o más lejos.

Guía paso a paso para el mapeo por paralaje

El mapeo por paralaje es una técnica avanzada, pero hay herramientas como Substance 3D que te la ponen fácil. Si estás empezando a usarlo a un nivel básico, sigue estos consejos:

  • Comienza con una textura. Podría ser una pared de ladrillo, un camino empedrado o un suelo de baldosas.
  • Crea un mapa de altura. Utiliza un software como Photoshop para convertir la textura a escala de grises.
  • Utiliza un motor gráfico. La mayoría de los motores gráficos, como Unity, admiten el mapeo por paralaje. Importa la textura principal y el mapa de altura.
  • Aplica el sombreador de mapeo por paralaje. Asigna un sombreador o materiales para añadir un mapeo por paralaje a la textura y vincularla al mapa de altura.
  • Ajusta los parámetros. Ajusta la intensidad del efecto de paralaje para lograr la ilusión de profundidad que buscas.
  • Contempla desde ángulos distintos. Desplaza la cámara para ver cómo se ajusta la textura a medida que cambias de ángulo.

Estos son unos breves consejos para que te pongas manos a la obra, pero no tengas miedo de experimentar por tu cuenta con el mapeo por paralaje.

Ventajas del mapeo por paralaje

El mapeo por paralaje aporta muchas ventajas, entre las que se incluyen las siguientes:

  • Mayor realismo. El mapeo por paralaje confiere a las imágenes un aspecto más táctil para simular experiencias de la vida real.
  • Inmersión emocional. Esta mejora del realismo repercute sobre la narrativa de los videojuegos y las animaciones, al darle vida a las historias.
  • Optimización del rendimiento. El mapeo por paralaje aumenta la sensación de profundidad mediante la manipulación de texturas sin tener que añadir más polígonos. El renderizado se agiliza muchísimo, lo que viene muy bien para aplicaciones en tiempo real como es el caso de los videojuegos.

Aplicaciones prácticas

El mapeo por paralaje es útil para muy diversas aplicaciones como, por ejemplo:

  • Videojuegos, incluida la realidad virtual
  • Modelos arquitectónicos
  • Visualización de productos para fabricantes y comercios minoristas

Del 2D al 3D: mapeo por paralaje en Substance 3D

El mapeo por paralaje revolucionó todo lo que abarca desde los videojuegos hasta el diseño web. Esta tecnología insufla vida en los diseños y aumenta mucho el detallismo de las imágenes planas en 2D.

La mejor forma de comprobar de lo que es capaz el mapeo por paralaje es probarlo en tus propios diseños. Prueba Adobe Substance 3D para crear gráficos impresionantes e intrincados que se salgan de la pantalla.

Preguntas frecuentes

¿EN QUÉ SE DIFERENCIAN EL MAPEO DE RELIEVE Y EL DE PARALAJE?

Ambas técnicas simulan la profundidad en una superficie sin aumentar la geometría. Sin embargo, el mapeo de relieve utiliza mapas de relieve en escala de grises para simular los altibajos de una textura, lo que afecta a la forma en que refleja la luz. El mapeo de relieve parece plano cuando lo miras desde un ángulo.

El mapeo por paralaje va más allá al desplazar las coordenadas de la textura en función de la perspectiva desde la que esta se contempla, lo que dota a las texturas de una mayor profundidad.

¿EN QUÉ SE DIFERENCIAN LOS MAPAS DE NORMALES Y LOS DE PARALAJE?

Los mapas de normales utilizan colores RGB para representar la dirección de las normales sobre una superficie, lo que genera la ilusión de una superficie compleja. En cambio, un mapa de paralaje es una imagen en escala de grises que representa la altura de los detalles superficiales.

¿QUÉ HACE EL MAPEO DE OCLUSIÓN POR PARALAJE?

El mapeo de oclusión por paralaje (POM, por las siglas en inglés de “parallax occlusion mapping”) simula el autosombreado de una superficie para crear una ilusión de profundidad realista. Rastrea los rayos de luz desde el punto de vista a través de un mapa de altura hasta que impactan sobre una superficie, lo que permite renderizar detalles sobre esta.

¿EL PARALAJE AFECTA AL RENDIMIENTO?

Sí. Es más eficiente que añadir polígonos, pero aun así, requiere más potencia computacional que una textura simple. El mapeo por paralaje básico afecta poco al rendimiento, pero usar técnicas más avanzadas como el mapeo de oclusión consume más recursos informáticos.

https://main--cc--adobecom.hlx.page/cc-shared/fragments/products/substance3d/bottom-blade-cta-s3d-collection