BabylonJS 18회차 : Blender → GLB 내보내기 규칙
목표: 모델이 “깨지는 이유”를 줄입니다.
핵심 개념: scale(단위), pivot(원점/오리진), transform apply, texture packing(텍스처 포함)
실습: 같은 모델을 2가지 방식으로 export 후 비교
산출물: “내보내기 체크리스트” 문서
목차
- 1) GLB가 ‘깨져 보이는’ 대표 증상
- 2) 스케일(단위) 규칙: “작다/크다” 문제를 없애기
- 3) 피벗(pivot)·오리진(origin) 규칙: 회전/카메라 타겟이 이상한 이유
- 4) Transform Apply 규칙: 로딩은 되는데 자세가 틀어지는 이유
- 5) 텍스처 패킹/포맷 규칙: “텍스처가 없다/검다” 문제 줄이기
- 6) Blender GLB Export 권장 설정
- 7) 실습: 같은 모델을 2가지 방식으로 내보내고 비교
- 8) 산출물: 내보내기 체크리스트
- 9) 추가로 생각해볼 점
- 10) 블로그 최적화 정보
1) GLB가 ‘깨져 보이는’ 대표 증상
BabylonJS에서 GLB를 로딩했는데 “깨졌다”는 표현은 사실 여러 케이스를 섞어 부르는 경우가 많습니다. 먼저 증상을 분류해두면 원인 추적이 빨라집니다.
- 크기 문제: 모델이 너무 작거나 너무 커서 카메라에 안 보입니다(사실 로딩은 성공).
- 회전/자세 문제: 모델이 눕거나 뒤집혀 보입니다(축/회전 적용 문제).
- 피벗 문제: 회전 중심이 이상하고, 확대/회전 조작 시 모델이 화면 밖으로 튑니다(오리진/피벗 설정 문제).
- 텍스처 문제: 흰색/검정색/핑크색처럼 보이거나 텍스처가 사라집니다(경로/패킹/머티리얼 호환 문제).
이번 글은 위 4가지의 원인을 Blender 내보내기 규칙으로 최대한 줄이는 것이 목적입니다.
2) 스케일(단위) 규칙: “작다/크다” 문제를 없애기
3D 파이프라인에서 스케일 문제는 가장 흔하고, 동시에 가장 예방하기 쉬운 문제입니다. 핵심은 “Blender의 단위 감각”과 “오브젝트의 Scale 값”을 일치시키는 것입니다.
2-1) 권장 기준: Blender는 미터(m) 단위로 모델링
- Blender Scene Properties → Units에서 Metric, Unit Scale = 1.0을 권장합니다.
- 사람 캐릭터 기준 키 1.7m라면 Blender에서 높이 약 1.7 정도가 직관적인 작업이 됩니다.
- 이 기준을 잡아두면 BabylonJS에서도 “카메라 radius/라이트 범위”를 예측 가능한 값으로 다룰 수 있습니다.
2-2) 오브젝트 Scale은 1,1,1로 만드는 습관
Blender에서 눈대중으로 크기를 맞추다 보면 오브젝트 Scale 값이 0.01 또는 100 같은 값으로 남는 경우가 많습니다. 이 상태로 내보내면 엔진에서 바운딩 계산/물리/애니메이션에서 예상치 못한 문제가 생깁니다.
- 권장: 편집(메시) 단계에서 크기를 맞추고, 오브젝트 단계에서는 Scale = 1을 유지합니다.
- 내보내기 직전에는 반드시 Ctrl + A → Scale을 적용해 수치를 정리합니다.
3) 피벗(pivot)·오리진(origin) 규칙: 회전/카메라 타겟이 이상한 이유
BabylonJS의 ArcRotateCamera(모델 뷰어에서 자주 사용)는 “타겟을 중심으로 회전”합니다. 그런데 모델의 오리진이 멀리 떨어져 있으면, 카메라가 엉뚱한 곳을 중심으로 돌게 되어 조작이 불편해집니다.
3-1) Blender에서 피벗의 정체: Object Origin
- Blender에서 흔히 말하는 피벗은 대부분 Object Origin입니다.
- 회전/스케일의 기준점이 되며, 엔진에선 “모델의 기준 좌표”처럼 동작합니다.
3-2) 권장 규칙(모델 종류별)
| 모델 종류 | 권장 Origin 위치 | 이유 |
|---|---|---|
| 일반 오브젝트(소품) | 바운딩 중심 또는 바닥 중심 | 뷰어 회전/프레이밍이 자연스러움 |
| 캐릭터 | 발바닥 중앙(지면 접점) | 지면 정렬/이동/애니메이션에서 일관성 확보 |
| 차량/장비 | 무게 중심 근처(대개 바닥 위 중심) | 회전/물리 적용 시 안정적 |
3-3) Blender에서 오리진 정리 순서
- 메시 편집 모드에서 실제 지오메트리가 (0,0,0) 근처에 있는지 확인합니다.
- Object Mode에서 Object → Set Origin으로 오리진을 목적 위치로 옮깁니다(예: Origin to Geometry, Origin to 3D Cursor).
- 오리진을 옮긴 뒤에는 “뷰포트에서 회전”해 보며 중심이 기대대로 동작하는지 확인합니다.
4) Transform Apply 규칙: 로딩은 되는데 자세가 틀어지는 이유
Blender에서 오브젝트에 회전/스케일이 누적된 상태로 내보내면, GLB 로딩 후 엔진에서 축 변환과 겹치며 “눕는다/비튼다/스케일이 꼬인다” 같은 현상이 생길 수 있습니다. 이를 예방하는 가장 쉬운 방법이 Transform Apply입니다.
4-1) 무엇을 적용해야 하나?
- Ctrl + A → Rotation & Scale을 권장합니다.
- Location은 프로젝트 규칙에 따라 다르지만, 모델 뷰어 기준에서는 원점 배치(Location=0)가 관리하기 쉽습니다.
4-2) “Apply를 하면 망가지는” 경우도 있습니다
애니메이션/리깅(Armature) 모델에서 무작정 Apply를 하면 본/애니메이션이 어긋날 수 있습니다. 초보자 단계에서는 아래 원칙만 기억해두셔도 안정성이 크게 올라갑니다.
- 정적 모델(소품/배경)은 내보내기 직전 Apply(회전/스케일)를 적용해도 대부분 안전합니다.
- 리깅/애니메이션 모델은 “처음부터 단위/축/오리진 규칙을 맞춘 상태”로 작업하고, Apply는 최소화합니다.
- 리깅 모델은 내보내기 전에 반드시 “테스트 로딩”으로 한 번 검증합니다(모델 뷰어가 바로 그 도구입니다).
5) 텍스처 패킹/포맷 규칙: “텍스처가 없다/검다” 문제 줄이기
텍스처 문제는 대부분 “파일이 GLB에 들어갔는지(패킹)”와 “머티리얼이 표준 방식인지”에서 갈립니다.
5-1) GLB를 권장하는 이유: 텍스처까지 하나로 묶기 쉬움
- GLB는 바이너리 하나에 메시/머티리얼/텍스처를 함께 담을 수 있어 배포가 간단합니다.
- 외부 텍스처 파일 참조(.gltf + textures/)는 경로 문제로 깨질 가능성이 더 큽니다.
5-2) Blender에서 텍스처가 “실제로 저장되어 있는지” 확인
- Image Texture 노드에 연결된 이미지가 “저장되지 않은 상태”면 내보내기에서 누락될 수 있습니다.
- 내보내기 전에 이미지 편집기에서 Image → Save 또는 Save All Images를 점검합니다.
5-3) 머티리얼은 Principled BSDF 중심으로
glTF/GLB는 PBR 기반 표준을 따릅니다. Blender의 Principled BSDF는 이 표준과 궁합이 좋아 BabylonJS에서 결과가 예측 가능해집니다.
- Base Color / Metallic / Roughness / Normal의 기본 채널만 먼저 안정화합니다.
- 복잡한 노드 트리(커스텀 셰이더)는 내보내기 시 변환이 제한될 수 있습니다.
6) Blender GLB Export 권장 설정
Blender의 glTF 2.0 Export 설정은 항목이 많지만, 초보 단계에서 핵심은 “일관된 축/변환/텍스처 포함”입니다. 아래 표는 자주 쓰는 옵션을 작업 의도별로 정리한 것입니다.
| 설정 항목 | 권장 값 | 의미/효과 | 주의 |
|---|---|---|---|
| Format | GLB | 단일 파일로 배포/로딩 안정성↑ | 파일 용량이 커질 수 있음 |
| Include | Selected Objects(선택) | 원치 않는 오브젝트 포함 방지 | 선택 누락 시 빈 파일이 될 수 있음 |
| Transform | (프로젝트 규칙에 맞춤) | 축/변환 처리 | 내보내기 전 Apply로 단순화하는 편이 안정적 |
| Geometry | Apply Modifiers(권장) | 모디파이어 결과를 메시로 확정 | 모디파이어에 따라 결과가 달라질 수 있음 |
| Materials | Export(기본) | PBR 머티리얼 내보내기 | 복잡한 노드는 단순화 필요 |
| Images | Embed(권장) | 텍스처를 파일에 포함 | 이미지 미저장 상태면 누락 가능 |
7) 실습: 같은 모델을 2가지 방식으로 내보내고 비교
실습의 목적은 “권장 규칙을 지켰을 때”와 “대충 내보냈을 때”의 차이를 눈으로 확인하는 것입니다. 같은 모델로 두 가지 GLB를 만들고, BabylonJS 모델 뷰어(이전 회차에서 만든 로딩 UI 포함 뷰어면 더 좋습니다)에서 비교합니다.
7-1) 준비물
- Blender로 만든 간단한 모델 1개(소품/로봇/박스 등)
- 텍스처 1~2장(가능하면 Base Color만 먼저)
- BabylonJS 모델 뷰어(ImportMesh/SceneLoader로 GLB 로딩 가능한 상태)
7-2) 방식 A: 권장 규칙을 지켜서 Export
- Scene Units를 Metric, Unit Scale=1.0으로 설정합니다.
- 오브젝트를 선택하고 Ctrl + A → Rotation & Scale을 적용합니다.
- 오리진을 목적에 맞게 정리합니다(소품이면 중심 또는 바닥 중심 권장).
- 이미지가 저장되어 있는지 확인합니다(Image → Save/Save All Images).
- File → Export → glTF 2.0에서 Format=GLB, Include=Selected Objects, Apply Modifiers, Images=Embed로 내보냅니다.
- 파일명을
model_ok.glb로 저장합니다.
7-3) 방식 B: 의도적으로 “깨질 가능성이 높은” 상태로 Export
아래는 “이런 식으로 하면 왜 문제가 생기는지”를 보여주기 위한 비교용입니다. 실무에서는 권장하지 않습니다.
- 오브젝트 Scale이 0.01 또는 100처럼 비정상인 상태를 유지합니다(Apply 미적용).
- 오리진이 모델에서 멀리 떨어진 상태를 그대로 둡니다(예: 원점으로 이동하지 않음).
- 텍스처가 저장되지 않은 상태(임시 이미지)로 둔 뒤 내보냅니다.
- 같은 Export 메뉴에서 내보내되 파일명을
model_bad.glb로 저장합니다.
7-4) BabylonJS에서 비교 관찰 포인트
- 보이는가/안 보이는가: “안 보이면 로딩 실패”가 아니라 “카메라 스케일 범위 밖”일 수 있습니다.
- 회전 중심: 마우스로 회전할 때 중심이 모델에 붙어 있으면 오리진이 적절합니다.
- 텍스처: Base Color가 정상인지, 금속/러프니스가 과하게 튀지 않는지 확인합니다.
- 바운딩 기반 카메라 프레이밍: 권장 방식 A는 프레이밍이 자연스럽고, 방식 B는 갑자기 멀리 찍히거나 클리핑이 생길 수 있습니다.
7-5) (선택) Blender에서 반복 작업을 줄이는 자동화 예시
여러 모델을 정리할 때는 “내보내기 전 정리 작업(Apply/이미지 저장)”을 반복하기 쉽습니다. 아래는 초보자도 읽기 쉬운 형태의 예시이며, 실제 프로젝트 규칙에 맞게 조정해 사용합니다.
# Blender > Scripting 탭에서 실행하는 간단 예시(선택 오브젝트 기준)
import bpy
# 1) 선택 오브젝트에 Rotation/Scale 적용
for obj in bpy.context.selected_objects:
if obj.type in {'MESH', 'EMPTY', 'ARMATURE'}:
bpy.context.view_layer.objects.active = obj
bpy.ops.object.transform_apply(location=False, rotation=True, scale=True)
# 2) 모든 이미지 저장(누락 방지)
bpy.ops.image.save_all_modified()
print("Done: Applied rotation/scale and saved images.")
8) 산출물: 내보내기 체크리스트
아래 체크리스트는 “내보내기 전에 반드시 확인할 것”만 추린 문서 형태입니다. 팀/프로젝트에서 공통 규칙으로 고정해두면 모델 깨짐이 체감적으로 줄어듭니다.
8-1) 핵심 체크리스트(최소 필수)
| 구분 | 체크 항목 | 권장 기준 | 실패 시 증상 |
|---|---|---|---|
| Scale/Unit | Scene Units / 오브젝트 Scale | Metric, Unit Scale=1.0 / Scale=1,1,1 | 너무 작거나 커서 화면에 안 보임, 바운딩/물리 이상 |
| Pivot/Origin | 오리진 위치 | 뷰어 기준 중심(또는 바닥 중심) | 회전 중심 이상, 카메라 조작 불편 |
| Apply | Rotation/Scale 적용 | Ctrl+A → Rotation & Scale | 눕기/비틀림/스케일 꼬임 |
| Texture | 이미지 저장/임베드 | Save All Images / Export Images=Embed | 흰색/검정색/핑크색, 텍스처 누락 |
| Material | 노드 표준화 | Principled BSDF 중심(PBR) | 광택/색상 결과가 예상과 다름 |
8-2) 내보내기 전 “30초 점검” 루틴
- 오브젝트 Scale이 1,1,1인지 확인하고, 아니라면 Ctrl+A로 정리합니다.
- 오리진이 모델 근처에 붙어 있는지 확인하고, 회전 테스트를 해봅니다.
- 이미지가 저장되어 있는지 Save All Images로 정리합니다.
- GLB로 내보내며 Images=Embed로 포함합니다.
- 내보낸 GLB를 BabylonJS 뷰어로 바로 한 번 로딩해 “눈으로 검증”합니다.
9) 추가로 생각해볼 점
- 규칙을 문서화하면 생산성이 올라갑니다: 개인 작업에서도 체크리스트가 있으면 “왜 깨졌지?” 시간을 크게 줄일 수 있습니다.
- 애니메이션/리깅은 별도 규칙이 필요합니다: 본(Armature), 좌표계, Apply 범위 등 고려사항이 늘어나므로, 정적 모델 규칙을 먼저 확립한 뒤 확장하는 편이 안전합니다.
- 엔진 측 자동 보정은 ‘마지막 수단’으로: BabylonJS에서 바운딩 기반으로 카메라/위치를 보정할 수 있지만, 근본 원인은 Blender 단계에서 잡는 편이 더 좋습니다.
- 팀 작업이라면 네이밍/폴더 규칙도 함께: 텍스처/머티리얼/메시 이름이 일관되면 디버깅과 교체가 쉬워집니다.
이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.
0 댓글