Generador de mapas normales
Carga una foto de textura y obtén en segundos el mapa normal, el mapa de altura (desplazamiento), el mapa de rugosidad y el mapa de oclusión ambiental correspondientes. Ajusta la intensidad, el desenfoque y el contraste, revisa el resultado en una esfera, un plano o un cubo 3D iluminados y descarga PNG para Blender, Unity, Unreal o Godot. Todo se calcula en tu dispositivo.
Última actualización:
Arrastra el modelo para girarlo. Compara con la casilla Mapa normal desmarcada para ver la diferencia.
Cómo usar Generador de mapas normales
- Carga una textura soltando una foto en el cuadro, eligiendo un archivo o pegando una imagen. Se carga un ejemplo de ladrillos para que puedas explorar primero.
- Da forma a la altura con Invertir, Desenfoque y Contraste de altura. Los píxeles claros pasan a ser altos y los oscuros, bajos.
- Ajusta el mapa normal con Intensidad y elige OpenGL o DirectX según tu motor. Activa Bordes continuos para texturas repetibles.
- Ajusta la rugosidad y el AO y revisa la vista previa 3D iluminada. Arrastra para girar el modelo.
- Descarga el mapa que estás viendo o pulsa Descargar todos los mapas (ZIP).
Cómo se calculan los mapas
Cada mapa parte de un mapa de altura. El brillo de la foto se mide con los pesos de luminancia Rec. 709 Y = 0.2126 R + 0.7152 G + 0.0722 B, de modo que los píxeles claros cuentan como altos y los oscuros como bajos (o al revés con Invertir). Un desenfoque gaussiano elimina el ruido de píxeles que, si no, daría un mapa normal granulado, y Contraste de altura estira los valores alrededor de su media.
El mapa normal procede de la pendiente de ese campo de alturas. Para cada píxel, un filtro Sobel de 3 × 3 (pesos 1, 2, 1) o un filtro Scharr (3, 10, 3) mide el cambio de altura de izquierda a derecha (dx) y de arriba abajo (dy). La normal de la superficie es el vector n = normalize(−dx · s, −dy · s, 1), donde s es la Intensidad, y cada componente se guarda como color = (n + 1) / 2 × 255. Por tanto, una zona plana se convierte en (128, 128, 255), el conocido azul lavanda.
El mapa de oclusión ambiental compara cada píxel con la media desenfocada de su entorno en dos radios: los píxeles que quedan más bajos que su vecindario (grietas, juntas de mortero, huecos entre piedras) se oscurecen en proporción a su profundidad. El mapa de rugosidad es una copia del brillo con el contraste ajustado, invertida por defecto para que las zonas más oscuras y sucias sean más rugosas.
¿Dónde va cada mapa?
| Mapa | Espacio de color | Blender (Principled BSDF) | Unity (URP/HDRP Lit) | Unreal Engine |
|---|---|---|---|---|
| Normal | Non-color / lineal | Nodo Normal Map → Normal (OpenGL) | Ranura Normal Map, tipo de textura Normal map (OpenGL) | Entrada Normal, usa DirectX o invierte el verde |
| Altura | Non-color | Nodo Displacement o nodo Bump | Height Map (parallax) | World Position Offset / Displacement |
| Rugosidad | Non-color | Rugosidad | Smoothness = 1 − rugosidad (invierte o empaqueta en alfa) | Rugosidad |
| AO | Non-color | Multiplica por Base Color o úsalo para hornear | Occlusion Map | Ambient Occlusion |
Los shaders Lit de Unity usan smoothness en lugar de rugosidad, así que invierte el mapa de rugosidad (o desmarca "Más oscuro = más rugoso" y ajusta) antes de usarlo allí.
Consejos para mejores resultados
- Usa fotos planas e iluminadas de forma uniforme. Las sombras y los brillos intensos se interpretan como altura. La luz de un día nublado o una caja de luz dan los mapas normales más limpios.
- Empieza con suavidad. Una Intensidad de 1 a 4 se ve natural en la mayoría de los materiales; los valores muy altos hacen que cada mota parezca un cráter.
- Desenfoque para formas grandes, sin desenfoque para el detalle fino. Sube el Desenfoque en piedra y ladrillos para que dominen las formas grandes; mantenlo bajo en tela, cuero o poros de la piel.
- Comprueba la dirección. Si el mortero o las grietas se ven en relieve en la vista previa 3D, marca Invertir altura.
- Ajústate a tu motor. Elige DirectX para Unreal y 3ds Max, OpenGL para Blender, Unity y Godot. El nombre del archivo indica cuál exportaste.
- Hazla sin costuras primero. Para materiales repetibles, haz que la textura de color no tenga costuras y luego genera los mapas con Bordes continuos marcado para que todos los mapas se repitan igual.
Preguntas frecuentes
¿Qué es un mapa normal?
Un mapa normal es una imagen RGB que guarda hacia dónde mira la superficie en cada píxel. El rojo contiene la pendiente en X (de izquierda a derecha), el verde la pendiente en Y y el azul la parte que apunta directamente hacia fuera de la superficie. Un motor 3D lo usa para iluminar un polígono plano como si tuviera relieves, grietas y surcos, sin añadir geometría. Por eso la mayoría de los mapas normales se ven de un azul lavanda claro: las zonas planas codifican el vector (0, 0, 1) como RGB (128, 128, 255).
¿Cómo crea esta herramienta un mapa normal a partir de una foto?
Primero convierte la foto en un mapa de altura, tratando los píxeles más claros como más altos. Luego mide lo rápido que cambia la altura de izquierda a derecha y de arriba abajo con un filtro Sobel o Scharr, multiplica esas pendientes por el valor de Intensidad y normaliza el vector (-dx, -dy, 1) para cada píxel. El resultado se convierte del rango -1 a 1 a valores de color de 0 a 255.
¿Debo elegir OpenGL o DirectX?
Solo se diferencian en el canal verde. El estilo OpenGL (Y+, verde hacia arriba) lo usan Blender, Godot, Unity y Maya. El estilo DirectX (Y-, verde hacia abajo) lo usan Unreal Engine, 3ds Max y el ajuste DirectX de Substance. Si en tu motor los relieves parecen hundidos, cambia la opción o invierte allí el canal verde.
¿Es preciso un mapa normal generado a partir de una foto?
Es una aproximación. Una sola foto no puede distinguir el color de la profundidad, así que la pintura oscura puede interpretarse como un surco y los brillos como relieves. Funciona mejor con texturas iluminadas de forma uniforme y mayormente mate, como piedra, ladrillo, corteza, hormigón, tela y madera. Usa Desenfoque para ignorar el ruido fino, Invertir si la profundidad sale al revés y una Intensidad moderada para resultados realistas. Para un detalle exacto, hornea las normales desde un modelo 3D de alta poligonización.
¿Para qué sirven los mapas de rugosidad y de oclusión ambiental?
La rugosidad indica a un shader PBR lo borrosos que son los reflejos: el blanco es totalmente rugoso y mate, el negro es liso y brillante. La oclusión ambiental oscurece las hendiduras que reciben menos luz indirecta; se multiplica por el color base o por la iluminación ambiental. Aquí la rugosidad se obtiene del brillo de la foto y el AO de cuánto más bajo está cada píxel que su entorno, ambos ajustables.
¿Cómo hago que los mapas se repitan sin costuras?
Empieza con una textura que ya se repita (puedes prepararla con un creador de texturas sin costuras) y activa Bordes continuos. Así los filtros darán la vuelta por los bordes en lugar de recortarse, de modo que los bordes izquierdo y derecho, superior e inferior de cada mapa encajen sin una costura visible.
¿Se suben mis imágenes?
No. La imagen se descodifica y se procesa con JavaScript y WebGL en tu propio navegador, así que funciona de forma privada e incluso sin conexión una vez cargada la página.
¿Se prueban todas las herramientas de FreeToolCabin para comprobar su calidad y precisión?
Sí. Cada herramienta del sitio pasa pruebas automáticas en navegadores reales para comprobar que el resultado es correcto y que no hay errores. Si encuentras un fallo o tienes una sugerencia, escríbenos a [email protected] y lo revisaremos.