스카이박스 생성 - 360도 구형 파노라마 사진으로 변환

THREE.js로 구현할 3차원 공간의 배경은
6장의 사진으로 만든 스카이박스(SkyBox)로 만듭니다.
참고 : 스카이박스(SkyBox) 배경 설치하기

스카이박스를 만드는 방법은 여러가지가 있겠지만,
먼저 360도 구형 파노라마 사진을 만든뒤 스카이박스로 변환하는 방법이
개인적으로는 간편한것 같습니다.

360도 구형 파노라마를 스카이박스로 변환하는 또 여러가지 방법들 가운데
블렌더를 이용하는 한 방법을 소개합니다.
( 블렌더에 대한 소개나 사용방법은 이곳에서 다루지 않습니다. )

 

참고 : https://aerotwist.com/tutorials/create-your-own-environment-maps/

Aerotwist - Create your own environment maps

 

 

1. 우선 아래의 소스파일을 다운로드 받으세요.

environment.blend

0.41MB

 

 

2. 변환할 360도 구형 파노라마 파일 준비.

- 준비한 파일을 위 블렌더 파일과 같은폴더 안에 "environment.jpg" 이름으로 바꾸어 놓는다.

 

 

3. environment.blend 파일 실행.

- 각자의 환경설정에 따라 실행화면이 조금은 다를수 있습니다.

 

 

4. [렌더]탭의 [애니메이션] 버튼 클릭.

 

 

5. 변환작업 진행

- 위 4번항목 에서 [애니메이션]버튼을 클릭하면 6장의 이미지가 추출되어지는 과정이 보여지면서 자동 진행됩니다.

 

 

6. 작업이 끝나면 폴더에 아래 사진처럼 추출된 6장의 이미지가 만들어져 있습니다.

 

 

7. 만들어진 이미지의 각 방향은 아래와 같습니다.

  '0002.png' -> 좌
  '0004.png' -> 우
  '0006.png' -> 위
  '0005.png' -> 아래
  '0003.png' -> 뒤
  '0001.png' -> 앞

 

 

[기타]

360도 구형 파노라마를 직접 촬영하는 방법과 앱 도 많이 있겠지만
직접 찍은 사진을 이어붙여서 파노라마 사진으로 만들어주는 프로그램도 많이 있습니다.
그중에 개인적으로 Hugin 이라는 오픈소스 프로그램을 추천 합니다.

http://hugin.sourceforge.net/

Hugin - Panorama photo stitcher

 

 

 

 

출처: https://horangi.tistory.com/407?category=821071 [노을빛호랑이의 연습장]