substance-3d-texturing
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChineseSubstance 3D Texturing
Substance 3D 纹理制作
Overview
概述
Master PBR (Physically Based Rendering) texture creation and export workflows for web and real-time engines. This skill covers Substance 3D Painter workflows from material creation through web-optimized texture export, with Python automation for batch processing and integration with WebGL/WebGPU engines.
Key capabilities:
- PBR material authoring (metallic/roughness workflow)
- Web-optimized texture export (glTF, Three.js, Babylon.js)
- Python API automation for batch export
- Texture compression and optimization for real-time rendering
掌握面向Web与实时引擎的PBR(基于物理的渲染)纹理创建与导出工作流。本技能涵盖Substance 3D Painter从材质创建到Web优化纹理导出的完整工作流,同时包含用于批量处理的Python自动化方案,以及与WebGL/WebGPU引擎的集成方法。
核心功能:
- PBR材质制作(金属度/粗糙度工作流)
- 适配Web的纹理导出(glTF、Three.js、Babylon.js)
- 基于Python API的批量导出自动化
- 面向实时渲染的纹理压缩与优化
Core Concepts
核心概念
PBR Workflow
PBR工作流
Substance 3D Painter uses the metallic/roughness PBR workflow with these core channels:
Base Texture Maps:
- (Albedo) - RGB diffuse color, no lighting information
baseColor - - RGB normal map (tangent space)
normal - - Grayscale metalness (0 = dielectric, 1 = metal)
metallic - - Grayscale surface roughness (0 = smooth/glossy, 1 = rough/matte)
roughness
Additional Maps:
- (AO) - Grayscale cavity/occlusion
ambientOcclusion - - Grayscale displacement/height
height - - RGB self-illumination
emissive - - Grayscale transparency
opacity
Substance 3D Painter采用金属度/粗糙度PBR工作流,包含以下核心通道:
基础纹理贴图:
- (反照率)- RGB漫反射颜色,不含光照信息
baseColor - (法线)- RGB法线贴图(切线空间)
normal - (金属度)- 灰度图,0代表绝缘体,1代表金属
metallic - (粗糙度)- 灰度图,0代表光滑/高光泽,1代表粗糙/哑光
roughness
附加贴图:
- (AO,环境光遮蔽)- 灰度图,表现空腔/遮蔽效果
ambientOcclusion - (高度)- 灰度图,表现位移/高度信息
height - (自发光)- RGB自发光颜色
emissive - (透明度)- 灰度图,控制透明度
opacity
Export Presets
导出预设
Substance 3D Painter includes built-in export presets for common engines:
- PBR Metallic Roughness - Standard glTF/WebGL format
- Unity HDRP/URP - Unity pipelines
- Unreal Engine - UE4/UE5 format
- Arnold (AiStandard) - Renderer-specific
For web engines, PBR Metallic Roughness is the universal standard.
Substance 3D Painter内置了针对常见引擎的导出预设:
- PBR Metallic Roughness - 标准glTF/WebGL格式
- Unity HDRP/URP - Unity渲染管线
- Unreal Engine - UE4/UE5格式
- Arnold (AiStandard) - 渲染器专用格式
对于Web引擎,PBR Metallic Roughness是通用标准。
Texture Resolution
纹理分辨率
Common resolutions for web (powers of 2):
- 512×512 - Low detail props, mobile
- 1024×1024 - Standard props, characters
- 2048×2048 - Hero assets, close-ups
- 4096×4096 - Showcase quality (use sparingly)
Web optimization rule: Start at 1024×1024, scale up only when texture detail is visible.
适用于Web的常见分辨率(2的幂次):
- 512×512 - 低细节道具、移动设备
- 1024×1024 - 标准道具、角色
- 2048×2048 - 核心资产、特写镜头
- 4096×4096 - 展示级画质(谨慎使用)
Web优化准则: 默认使用1024×1024,仅当纹理细节可见时再提升分辨率。
Common Patterns
常见模式
1. Basic Web Export (Three.js/Babylon.js)
1. 基础Web导出(Three.js/Babylon.js)
Manual export workflow for single texture set:
Steps:
- File → Export Textures
- Select preset: "PBR Metallic Roughness"
- Configure export:
- Output directory: Choose target folder
- File format: PNG (8-bit) for web
- Padding: "Infinite" (prevents seams)
- Resolution: 1024×1024 (adjust per asset)
- Export
Result files:
MyAsset_baseColor.png
MyAsset_normal.png
MyAsset_metallicRoughness.png // Packed: R=nothing, G=roughness, B=metallic
MyAsset_emissive.png // OptionalThree.js usage:
javascript
import * as THREE from 'three';
const textureLoader = new THREE.TextureLoader();
const material = new THREE.MeshStandardMaterial({
map: textureLoader.load('MyAsset_baseColor.png'),
normalMap: textureLoader.load('MyAsset_normal.png'),
metalnessMap: textureLoader.load('MyAsset_metallicRoughness.png'),
roughnessMap: textureLoader.load('MyAsset_metallicRoughness.png'),
aoMap: textureLoader.load('MyAsset_ambientOcclusion.png'),
});单组纹理的手动导出工作流:
步骤:
- 文件 → 导出纹理
- 选择预设: "PBR Metallic Roughness"
- 配置导出:
- 输出目录:选择目标文件夹
- 文件格式:PNG(8位,适配Web)
- 填充方式:"无限"(避免接缝)
- 分辨率:1024×1024(根据资产调整)
- 导出
导出结果文件:
MyAsset_baseColor.png
MyAsset_normal.png
MyAsset_metallicRoughness.png // 打包格式:R=无, G=粗糙度, B=金属度
MyAsset_emissive.png // 可选Three.js 使用示例:
javascript
import * as THREE from 'three';
const textureLoader = new THREE.TextureLoader();
const material = new THREE.MeshStandardMaterial({
map: textureLoader.load('MyAsset_baseColor.png'),
normalMap: textureLoader.load('MyAsset_normal.png'),
metalnessMap: textureLoader.load('MyAsset_metallicRoughness.png'),
roughnessMap: textureLoader.load('MyAsset_metallicRoughness.png'),
aoMap: textureLoader.load('MyAsset_ambientOcclusion.png'),
});2. Batch Export with Python API
2. 基于Python API的批量导出
Automate export for multiple texture sets:
python
import substance_painter.export
import substance_painter.resource
import substance_painter.textureset自动化导出多组纹理:
python
import substance_painter.export
import substance_painter.resource
import substance_painter.texturesetDefine export preset
定义导出预设
export_preset = substance_painter.resource.ResourceID(
context="starter_assets",
name="PBR Metallic Roughness"
)
export_preset = substance_painter.resource.ResourceID(
context="starter_assets",
name="PBR Metallic Roughness"
)
Configure export for all texture sets
配置所有纹理集的导出参数
config = {
"exportShaderParams": False,
"exportPath": "C:/export/web_textures",
"defaultExportPreset": export_preset.url(),
"exportList": [],
"exportParameters": [{
"parameters": {
"fileFormat": "png",
"bitDepth": "8",
"dithering": True,
"paddingAlgorithm": "infinite",
"sizeLog2": 10 // 1024×1024
}
}]
}
config = {
"exportShaderParams": False,
"exportPath": "C:/export/web_textures",
"defaultExportPreset": export_preset.url(),
"exportList": [],
"exportParameters": [{
"parameters": {
"fileFormat": "png",
"bitDepth": "8",
"dithering": True,
"paddingAlgorithm": "infinite",
"sizeLog2": 10 // 1024×1024
}
}]
}
Add all texture sets to export list
将所有纹理集添加到导出列表
for texture_set in substance_painter.textureset.all_texture_sets():
config["exportList"].append({
"rootPath": texture_set.name()
})
for texture_set in substance_painter.textureset.all_texture_sets():
config["exportList"].append({
"rootPath": texture_set.name()
})
Execute export
执行导出
result = substance_painter.export.export_project_textures(config)
if result.status == substance_painter.export.ExportStatus.Success:
for stack, files in result.textures.items():
print(f"Exported {stack}: {len(files)} textures")
else:
print(f"Export failed: {result.message}")
undefinedresult = substance_painter.export.export_project_textures(config)
if result.status == substance_painter.export.ExportStatus.Success:
for stack, files in result.textures.items():
print(f"Exported {stack}: {len(files)} textures")
else:
print(f"Export failed: {result.message}")
undefined3. Resolution Override per Asset
3. 按资产覆盖分辨率
Export different resolutions for different assets (e.g., hero vs. background):
python
config = {
"exportPath": "C:/export",
"defaultExportPreset": export_preset.url(),
"exportList": [
{"rootPath": "HeroCharacter"}, # Will use 2048 (override below)
{"rootPath": "BackgroundProp"} # Will use 512 (override below)
],
"exportParameters": [
{
"filter": {"dataPaths": ["HeroCharacter"]},
"parameters": {"sizeLog2": 11} # 2048×2048
},
{
"filter": {"dataPaths": ["BackgroundProp"]},
"parameters": {"sizeLog2": 9} # 512×512
}
]
}为不同资产导出不同分辨率(例如核心资产 vs 背景道具):
python
config = {
"exportPath": "C:/export",
"defaultExportPreset": export_preset.url(),
"exportList": [
{"rootPath": "HeroCharacter"}, // 将使用2048分辨率(下方覆盖配置)
{"rootPath": "BackgroundProp"} // 将使用512分辨率(下方覆盖配置)
],
"exportParameters": [
{
"filter": {"dataPaths": ["HeroCharacter"]},
"parameters": {"sizeLog2": 11} // 2048×2048
},
{
"filter": {"dataPaths": ["BackgroundProp"]},
"parameters": {"sizeLog2": 9} // 512×512
}
]
}4. Custom Export Preset (Separate Channels)
4. 自定义导出预设(分离通道)
Create custom preset to export metallic and roughness as separate files:
python
custom_preset = {
"exportPresets": [{
"name": "WebGL_Separated",
"maps": [
{
"fileName": "$textureSet_baseColor",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "baseColor"},
{"destChannel": "G", "srcChannel": "G", "srcMapType": "documentMap", "srcMapName": "baseColor"},
{"destChannel": "B", "srcChannel": "B", "srcMapType": "documentMap", "srcMapName": "baseColor"}
]
},
{
"fileName": "$textureSet_normal",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "normal"},
{"destChannel": "G", "srcChannel": "G", "srcMapType": "documentMap", "srcMapName": "normal"},
{"destChannel": "B", "srcChannel": "B", "srcMapType": "documentMap", "srcMapName": "normal"}
]
},
{
"fileName": "$textureSet_metallic",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "metallic"}
],
"parameters": {"fileFormat": "png", "bitDepth": "8"}
},
{
"fileName": "$textureSet_roughness",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "roughness"}
],
"parameters": {"fileFormat": "png", "bitDepth": "8"}
}
]
}]
}
config = {
"exportPath": "C:/export",
"exportPresets": custom_preset["exportPresets"],
"exportList": [{"rootPath": "MyAsset", "exportPreset": "WebGL_Separated"}]
}创建自定义预设,将金属度与粗糙度导出为单独文件:
python
custom_preset = {
"exportPresets": [{
"name": "WebGL_Separated",
"maps": [
{
"fileName": "$textureSet_baseColor",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "baseColor"},
{"destChannel": "G", "srcChannel": "G", "srcMapType": "documentMap", "srcMapName": "baseColor"},
{"destChannel": "B", "srcChannel": "B", "srcMapType": "documentMap", "srcMapName": "baseColor"}
]
},
{
"fileName": "$textureSet_normal",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "normal"},
{"destChannel": "G", "srcChannel": "G", "srcMapType": "documentMap", "srcMapName": "normal"},
{"destChannel": "B", "srcChannel": "B", "srcMapType": "documentMap", "srcMapName": "normal"}
]
},
{
"fileName": "$textureSet_metallic",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "metallic"}
],
"parameters": {"fileFormat": "png", "bitDepth": "8"}
},
{
"fileName": "$textureSet_roughness",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "roughness"}
],
"parameters": {"fileFormat": "png", "bitDepth": "8"}
}
]
}]
}
config = {
"exportPath": "C:/export",
"exportPresets": custom_preset["exportPresets"],
"exportList": [{"rootPath": "MyAsset", "exportPreset": "WebGL_Separated"}]
}5. Mobile-Optimized Export
5. 适配移动设备的导出
Aggressive compression for mobile WebGL:
python
mobile_config = {
"exportPath": "C:/export/mobile",
"defaultExportPreset": export_preset.url(),
"exportList": [{"rootPath": texture_set.name()}],
"exportParameters": [{
"parameters": {
"fileFormat": "jpeg", # JPEG for baseColor (lossy but smaller)
"bitDepth": "8",
"sizeLog2": 9, # 512×512 maximum
"paddingAlgorithm": "infinite"
}
}, {
"filter": {"outputMaps": ["$textureSet_normal", "$textureSet_metallicRoughness"]},
"parameters": {
"fileFormat": "png" # PNG for data maps (need lossless)
}
}]
}Post-export: Use tools like or for further compression.
pngquanttinypng针对移动WebGL的激进压缩配置:
python
mobile_config = {
"exportPath": "C:/export/mobile",
"defaultExportPreset": export_preset.url(),
"exportList": [{"rootPath": texture_set.name()}],
"exportParameters": [{
"parameters": {
"fileFormat": "jpeg", // 基础色使用JPEG(有损但体积更小)
"bitDepth": "8",
"sizeLog2": 9, // 最大512×512
"paddingAlgorithm": "infinite"
}
}, {
"filter": {"outputMaps": ["$textureSet_normal", "$textureSet_metallicRoughness"]},
"parameters": {
"fileFormat": "png" // 数据贴图使用PNG(需要无损)
}
}]
}导出后处理: 使用或等工具进一步压缩。
pngquanttinypng6. glTF/GLB Integration
6. glTF/GLB 集成
Export textures for glTF 2.0 format:
python
gltf_config = {
"exportPath": "C:/export/gltf",
"defaultExportPreset": substance_painter.resource.ResourceID(
context="starter_assets",
name="PBR Metallic Roughness"
).url(),
"exportList": [{"rootPath": texture_set.name()}],
"exportParameters": [{
"parameters": {
"fileFormat": "png",
"bitDepth": "8",
"sizeLog2": 10, # 1024×1024
"paddingAlgorithm": "infinite"
}
}]
}导出适配glTF 2.0格式的纹理:
python
gltf_config = {
"exportPath": "C:/export/gltf",
"defaultExportPreset": substance_painter.resource.ResourceID(
context="starter_assets",
name="PBR Metallic Roughness"
).url(),
"exportList": [{"rootPath": texture_set.name()}],
"exportParameters": [{
"parameters": {
"fileFormat": "png",
"bitDepth": "8",
"sizeLog2": 10, // 1024×1024
"paddingAlgorithm": "infinite"
}
}]
}After export, reference in glTF:
导出后,在glTF中引用:
{
{
"materials": [{
"materials": [{
"name": "Material",
"name": "Material",
"pbrMetallicRoughness": {
"pbrMetallicRoughness": {
"baseColorTexture": {"index": 0},
"baseColorTexture": {"index": 0},
"metallicRoughnessTexture": {"index": 1}
"metallicRoughnessTexture": {"index": 1}
},
},
"normalTexture": {"index": 2}
"normalTexture": {"index": 2}
}]
}]
}
}
undefinedundefined7. Event-Driven Export Plugin
7. 事件驱动的导出插件
Auto-export on save using Python plugin:
python
import substance_painter.event
import substance_painter.export
import substance_painter.project
def auto_export(e):
if not substance_painter.project.is_open():
return
config = {
"exportPath": substance_painter.project.file_path().replace('.spp', '_textures'),
"defaultExportPreset": substance_painter.resource.ResourceID(
context="starter_assets", name="PBR Metallic Roughness"
).url(),
"exportList": [{"rootPath": ts.name()} for ts in substance_painter.textureset.all_texture_sets()],
"exportParameters": [{
"parameters": {"fileFormat": "png", "bitDepth": "8", "sizeLog2": 10}
}]
}
substance_painter.export.export_project_textures(config)
print("Auto-export completed")使用Python插件实现保存时自动导出:
python
import substance_painter.event
import substance_painter.export
import substance_painter.project
def auto_export(e):
if not substance_painter.project.is_open():
return
config = {
"exportPath": substance_painter.project.file_path().replace('.spp', '_textures'),
"defaultExportPreset": substance_painter.resource.ResourceID(
context="starter_assets", name="PBR Metallic Roughness"
).url(),
"exportList": [{"rootPath": ts.name()} for ts in substance_painter.textureset.all_texture_sets()],
"exportParameters": [{
"parameters": {"fileFormat": "png", "bitDepth": "8", "sizeLog2": 10}
}]
}
substance_painter.export.export_project_textures(config)
print("Auto-export completed")Register event
注册事件
substance_painter.event.DISPATCHER.connect(
substance_painter.event.ProjectSaved,
auto_export
)
undefinedsubstance_painter.event.DISPATCHER.connect(
substance_painter.event.ProjectSaved,
auto_export
)
undefinedIntegration Patterns
集成模式
Three.js + React Three Fiber
Three.js + React Three Fiber
Use exported textures in R3F:
jsx
import { useTexture } from '@react-three/drei';
function TexturedMesh() {
const [baseColor, normal, metallicRoughness, ao] = useTexture([
'/textures/Asset_baseColor.png',
'/textures/Asset_normal.png',
'/textures/Asset_metallicRoughness.png',
'/textures/Asset_ambientOcclusion.png',
]);
return (
<mesh>
<boxGeometry />
<meshStandardMaterial
map={baseColor}
normalMap={normal}
metalnessMap={metallicRoughness}
roughnessMap={metallicRoughness}
aoMap={ao}
/>
</mesh>
);
}See react-three-fiber skill for advanced R3F material workflows.
在R3F中使用导出的纹理:
jsx
import { useTexture } from '@react-three/drei';
function TexturedMesh() {
const [baseColor, normal, metallicRoughness, ao] = useTexture([
'/textures/Asset_baseColor.png',
'/textures/Asset_normal.png',
'/textures/Asset_metallicRoughness.png',
'/textures/Asset_ambientOcclusion.png',
]);
return (
<mesh>
<boxGeometry />
<meshStandardMaterial
map={baseColor}
normalMap={normal}
metalnessMap={metallicRoughness}
roughnessMap={metallicRoughness}
aoMap={ao}
/>
</mesh>
);
}有关R3F高级材质工作流,请参考react-three-fiber技能指南。
Babylon.js PBR Materials
Babylon.js PBR 材质
javascript
import { PBRMaterial, Texture } from '@babylonjs/core';
const pbr = new PBRMaterial("pbr", scene);
pbr.albedoTexture = new Texture("/textures/Asset_baseColor.png", scene);
pbr.bumpTexture = new Texture("/textures/Asset_normal.png", scene);
pbr.metallicTexture = new Texture("/textures/Asset_metallicRoughness.png", scene);
pbr.useRoughnessFromMetallicTextureAlpha = false;
pbr.useRoughnessFromMetallicTextureGreen = true;
pbr.useMetallnessFromMetallicTextureBlue = true;See babylonjs-engine skill for advanced PBR workflows.
javascript
import { PBRMaterial, Texture } from '@babylonjs/core';
const pbr = new PBRMaterial("pbr", scene);
pbr.albedoTexture = new Texture("/textures/Asset_baseColor.png", scene);
pbr.bumpTexture = new Texture("/textures/Asset_normal.png", scene);
pbr.metallicTexture = new Texture("/textures/Asset_metallicRoughness.png", scene);
pbr.useRoughnessFromMetallicTextureAlpha = false;
pbr.useRoughnessFromMetallicTextureGreen = true;
pbr.useMetallnessFromMetallicTextureBlue = true;有关高级PBR工作流,请参考babylonjs-engine技能指南。
GLTF Export Pipeline
GLTF 导出管线
- Export textures from Substance (as above)
- Export model from Blender with glTF exporter
- Reference Substance textures in JSON
.gltf - Use for Draco compression:
gltf-pipeline
bash
gltf-pipeline -i model.gltf -o model.glb -dSee blender-web-pipeline skill for complete 3D asset pipeline.
- 从Substance导出纹理(如上所述)
- 使用Blender的glTF导出器导出模型
- 在JSON文件中引用Substance纹理
.gltf - 使用进行Draco压缩:
gltf-pipeline
bash
gltf-pipeline -i model.gltf -o model.glb -d有关完整3D资产管线,请参考blender-web-pipeline技能指南。
Performance Optimization
性能优化
Texture Size Budget
纹理内存预算
Desktop WebGL: ~100-150MB total texture memory
Mobile WebGL: ~30-50MB total texture memory
Budget per asset:
- Background/props: 512×512 (1MB per texture × 4 maps = 4MB)
- Standard assets: 1024×1024 (4MB per texture × 4 maps = 16MB)
- Hero assets: 2048×2048 (16MB per texture × 4 maps = 64MB)
桌面WebGL: 总纹理内存约100-150MB
移动WebGL: 总纹理内存约30-50MB
单资产预算:
- 背景/道具:512×512(每张纹理1MB ×4张贴图=4MB)
- 标准资产:1024×1024(每张纹理4MB ×4张贴图=16MB)
- 核心资产:2048×2048(每张纹理16MB ×4张贴图=64MB)
Compression Strategies
压缩策略
- JPEG for baseColor (70-80% quality) - 10× smaller than PNG
- PNG-8 for data maps (normal, metallic, roughness) - lossless required
- Basis Universal () - GPU texture compression (90% smaller)
.basis - Texture atlasing - Combine multiple assets into single texture
- 基础色使用JPEG(70-80%质量)- 体积比PNG小10倍
- 数据贴图使用PNG-8(法线、金属度、粗糙度)- 需无损压缩
- Basis Universal()- GPU纹理压缩(体积缩小90%)
.basis - 纹理图集 - 将多个资产合并为单张纹理
Channel Packing
通道打包
Pack grayscale maps into RGB channels to reduce texture count:
Packed ORM (Occlusion-Roughness-Metallic):
- Red: Ambient Occlusion
- Green: Roughness
- Blue: Metallic
Export in Substance:
python
orm_map = {
"fileName": "$textureSet_ORM",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "ambientOcclusion"},
{"destChannel": "G", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "roughness"},
{"destChannel": "B", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "metallic"}
]
}将灰度贴图打包到RGB通道以减少纹理数量:
打包ORM(遮蔽-粗糙度-金属度):
- 红色通道:环境光遮蔽
- 绿色通道:粗糙度
- 蓝色通道:金属度
在Substance中导出:
python
orm_map = {
"fileName": "$textureSet_ORM",
"channels": [
{"destChannel": "R", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "ambientOcclusion"},
{"destChannel": "G", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "roughness"},
{"destChannel": "B", "srcChannel": "R", "srcMapType": "documentMap", "srcMapName": "metallic"}
]
}Mipmaps
多级渐远纹理(Mipmaps)
Always enable mipmaps in engine for textures viewed at distance:
javascript
// Three.js (automatic)
texture.generateMipmaps = true;
// Babylon.js
texture.updateSamplingMode(Texture.TRILINEAR_SAMPLINGMODE);对于在远距离查看的纹理,务必在引擎中启用多级渐远纹理:
javascript
// Three.js(自动生成)
texture.generateMipmaps = true;
// Babylon.js
texture.updateSamplingMode(Texture.TRILINEAR_SAMPLINGMODE);Common Pitfalls
常见陷阱
1. Wrong Color Space for BaseColor
1. 基础色颜色空间错误
Problem: BaseColor exported in linear space looks washed out.
Solution: Substance exports baseColor in sRGB by default (correct). Ensure engine uses sRGB:
javascript
// Three.js
baseColorTexture.colorSpace = THREE.SRGBColorSpace;
// Babylon.js (automatic for albedoTexture)问题: 以线性空间导出的基础色显示过曝。
解决方案: Substance默认以sRGB空间导出基础色(正确设置)。确保引擎使用sRGB空间:
javascript
// Three.js
baseColorTexture.colorSpace = THREE.SRGBColorSpace;
// Babylon.js(albedoTexture默认自动设置)2. Normal Map Baking Issues
2. 法线贴图烘焙问题
Problem: Normal maps show inverted or incorrect shading.
Solution:
- Verify tangent space normal format (DirectX vs. OpenGL Y-flip)
- Substance uses OpenGL (Y+), same as glTF standard
- If using DirectX engine, flip green channel in export
问题: 法线贴图显示反转或不正确的阴影。
解决方案:
- 验证切线空间法线格式(DirectX vs OpenGL Y轴翻转)
- Substance使用OpenGL格式(Y轴向上),与glTF标准一致
- 若使用DirectX引擎,需在导出时翻转绿色通道
3. Metallic/Roughness Channel Order
3. 金属度/粗糙度通道顺序错误
Problem: Metallic/roughness texture has swapped channels.
Solution: Default Substance export:
- Blue channel = Metallic
- Green channel = Roughness
- Matches glTF 2.0 specification
问题: 金属度/粗糙度贴图通道顺序颠倒。
解决方案: Substance默认导出规则:
- 蓝色通道=金属度
- 绿色通道=粗糙度
- 符合glTF 2.0规范
4. Padding Artifacts at UV Seams
4. UV接缝处的填充伪影
Problem: Black or colored lines appear at UV seams.
Solution: Set padding algorithm to "infinite" in export settings:
python
"paddingAlgorithm": "infinite"问题: UV接缝处出现黑色或彩色线条。
解决方案: 在导出设置中将填充算法设置为**"无限"**:
python
"paddingAlgorithm": "infinite"5. Oversized Textures for Web
5. Web纹理尺寸过大
Problem: 4K textures cause long load times and memory issues on web.
Solution:
- Default to 1024×1024 for web
- Use 2048×2048 only for hero assets viewed close-up
- Implement LOD system with multiple resolution sets
问题: 4K纹理导致Web端加载时间过长和内存问题。
解决方案:
- Web端默认使用1024×1024
- 仅将核心资产设置为2048×2048(需近距离查看)
- 实现LOD(多级细节)系统,提供多分辨率纹理集
6. Missing AO Map in Engine
6. 引擎中AO贴图不可见
Problem: AO map exported but not visible in engine.
Solution:
- Three.js: Requires second UV channel ()
geometry.attributes.uv2 - Babylon.js: Set
material.useAmbientOcclusionFromMetallicTextureRed = true - Alternative: Bake AO into baseColor in Substance
问题: AO已导出,但在引擎中不可见。
解决方案:
- Three.js:需要第二组UV通道()
geometry.attributes.uv2 - Babylon.js:设置
material.useAmbientOcclusionFromMetallicTextureRed = true - 替代方案:在Substance中将AO烘焙到基础色中
Resources
资源
See bundled resources for complete workflows:
- references/python_api_reference.md - Complete Substance Painter Python API
- references/export_presets.md - Built-in and custom export preset catalog
- references/pbr_channel_guide.md - Deep dive into PBR texture channels
- scripts/batch_export.py - Batch export all texture sets
- scripts/web_optimizer.py - Post-process textures for web (resize, compress)
- scripts/generate_export_preset.py - Create custom export preset JSON
- assets/export_templates/ - Pre-configured export presets for Three.js, Babylon.js, Unity
查看捆绑资源获取完整工作流:
- references/python_api_reference.md - 完整Substance Painter Python API文档
- references/export_presets.md - 内置与自定义导出预设目录
- references/pbr_channel_guide.md - PBR纹理通道深度指南
- scripts/batch_export.py - 批量导出所有纹理集的脚本
- scripts/web_optimizer.py - 用于Web纹理后处理的脚本(调整尺寸、压缩)
- scripts/generate_export_preset.py - 创建自定义导出预设JSON的脚本
- assets/export_templates/ - 预配置的导出预设,适配Three.js、Babylon.js、Unity
Related Skills
相关技能
- blender-web-pipeline - Complete 3D model → texture → web pipeline
- threejs-webgl - Loading and using PBR textures in Three.js
- react-three-fiber - R3F material workflows with Substance textures
- babylonjs-engine - Babylon.js PBR material system integration
- blender-web-pipeline - 完整3D模型→纹理→Web管线
- threejs-webgl - 在Three.js中加载与使用PBR纹理
- react-three-fiber - 结合Substance纹理的R3F材质工作流
- babylonjs-engine - Babylon.js PBR材质系统集成