3차시: 인터랙티브 콘텐츠 만들기 소요시간: 45분 준비물 홀로그램 키트 스마트폰 SPL3D 편집기 저작툴.

Presentation on theme: "3차시: 인터랙티브 콘텐츠 만들기 소요시간: 45분 준비물 홀로그램 키트 스마트폰 SPL3D 편집기 저작툴."— Presentation transcript:

1 3차시: 인터랙티브 콘텐츠 만들기 소요시간: 45분 준비물 홀로그램 키트 스마트폰 SPL3D 편집기 저작툴

2 1. SPL3D VR 저작툴 실행하기 바탕화면의 SPL 폴더 클릭 2) SPL3D Editor를 실행합니다.

3 1. SPL3D VR 저작툴 실행하기

4 이전 강좌파일을 참조하여 검정색 배경의 기본 환경 명령어를 작성해 봅니다.
2. 기본 홀로그램 환경 준비하기 이전 강좌파일을 참조하여 검정색 배경의 기본 환경 명령어를 작성해 봅니다.

5 3D 오브젝트 명령어 탭에서 AddSphere 명령어를 마우스로 더블 클릭하여 추가해 줍니다.

6 3. 공 (Sphere) 객체 추가하기 2) 공의 위치를 0, 1, 0으로 수정해 줍니다.

7 3. 공 (Sphere) 객체 추가하기 3) 실행하여 결과를 확인해 봅니다.

8 사진을 입히는 방법은 Texture 옵션을 추가해 주면 됩니다.
4. 공에 지구 사진(텍스처) 입히기 공을 지구본으로 만들어 봅니다. 사진을 입히는 방법은 Texture 옵션을 추가해 주면 됩니다. 2 1 마우스 더블 클릭

9 4. 공에 지구 사진(텍스처) 입히기 2) 과학 텍스처에서 지구를 선택합니다.

10 4. 공에 지구 사진(텍스처) 입히기 3) 결과를 확인해 봅니다.

11 4) 키보드를 이용해 지구본을 확대하거나 회전시켜 봅니다.
4. 공에 지구 사진(텍스처) 입히기 4) 키보드를 이용해 지구본을 확대하거나 회전시켜 봅니다. 좌우 방향키를 눌러 지구본을 회전시켜 봅니다. 상하 방향키를 눌러 지구본을 확대하거나 축소시켜 봅니다.

12 5) 실습: 달이나 다른 행성들의 사진도 입혀 봅니다.
4. 공에 지구 사진(텍스처) 입히기 5) 실습: 달이나 다른 행성들의 사진도 입혀 봅니다.

13 컴퓨터나 스마트폰에 장착된 카메라를 통해 손의 위치를 입력 받은 후 지구본을 움직여 보도록 합니다.
5. 카메라 모션 값 읽어오기 컴퓨터나 스마트폰에 장착된 카메라를 통해 손의 위치를 입력 받은 후 지구본을 움직여 보도록 합니다. 2) 카메라에서 모션 값을 읽어 오는 방법은 GetCameraMotion 명령을 이용해 주면 됩니다.

14 3) 특수효과 및 UI 탭에 있는 GetCameraMotion 명령어를 마우스로 더블 클릭하여 추가해 줍니다.
5. 카메라 모션 값 읽어오기 3) 특수효과 및 UI 탭에 있는 GetCameraMotion 명령어를 마우스로 더블 클릭하여 추가해 줍니다.

15 4) OnDetected 옵션을 마우스로 더블 클릭해 줍니다.
5. 카메라 모션 값 읽어오기 4) OnDetected 옵션을 마우스로 더블 클릭해 줍니다.

16 5) OnDetected 옵션 뒤에 proc1 이라고 입력해 줍니다.
5. 카메라 모션 값 읽어오기 5) OnDetected 옵션 뒤에 proc1 이라고 입력해 줍니다. proc1 이라는 텍스트를 입력해 줍니다.

17 6) OnDetected 설명 5. 카메라 모션 값 읽어오기 카메라에서 모션이 감지되었을 경우
proc1 이라는 이름의 프로시저로 값을 넘겨 줍니다. 이때 넘겨지는 값은 xmotion 값과 ymotion 값이 넘겨 집니다. 이제 이 값들을 화면에 프린트하여 확인해 보도록 하겠습니다.

18 7) 화면 아래에서 오른쪽 마우스 버튼을 클릭하여 procedur를 선택해 줍니다.
5. 카메라 모션 값 읽어오기 7) 화면 아래에서 오른쪽 마우스 버튼을 클릭하여 procedur를 선택해 줍니다.

19 8) proc1 이름의 프로시저가 생성되면 print xmotion 이라고 입력해 줍니다.
5. 카메라 모션 값 읽어오기 8) proc1 이름의 프로시저가 생성되면 print xmotion 이라고 입력해 줍니다. 텍스트 입력

20 9) 컴퓨터에 카메라가 연결되어 있는 경우 스크립트를 실행하여 값을 확인해 봅니다.
5. 카메라 모션 값 읽어오기 9) 컴퓨터에 카메라가 연결되어 있는 경우 스크립트를 실행하여 값을 확인해 봅니다. 만약, 컴퓨터에 카메라가 없는 경우에는 서버에 업로드한 후, 스마트폰에서 결과를 확인해 봅니다.

21 10) 카메라 주변에서 손을 좌우로 움직여서 값을 확인해 봅니다.
5. 카메라 모션 값 읽어오기 10) 카메라 주변에서 손을 좌우로 움직여서 값을 확인해 봅니다.

22 1) 지구본의 회전 속도를 저장하기 위한 변수를 추가해 줍니다.
6. 카메라 모션 값으로 지구본 회전시키기 1) 지구본의 회전 속도를 저장하기 위한 변수를 추가해 줍니다.

23 2) proc1 프로시저에서 speed 값에 값을 저장시킵니다.
6. 카메라 모션 값으로 지구본 회전시키기 2) proc1 프로시저에서 speed 값에 값을 저장시킵니다.

24 3) 새로운 프로시저를 추가한 후, 지구본이 speed 변수의 값으로 회전하도록 스크립트를 추가해 줍니다.
6. 카메라 모션 값으로 지구본 회전시키기 3) 새로운 프로시저를 추가한 후, 지구본이 speed 변수의 값으로 회전하도록 스크립트를 추가해 줍니다. 스크립트 추가

25 6. 카메라 모션 값으로 지구본 회전시키기 4) 결과를 확인해 봅니다. PC에 카메라가 있는 경우 손을 좌우로 움직여 봅니다.

26 5) 스마트폰에서 확인하기 위해 서버에 업로드 합니다.
6. 카메라 모션 값으로 지구본 회전시키기 5) 스마트폰에서 확인하기 위해 서버에 업로드 합니다. 6) 지구본의 크기를 조절한 후, 홀로그램 키트에 스마트폰을 올려 놓고 지구본을 회전 시켜 봅니다.

27 오른쪽의 코드를 입력하여 모션으로 공을 멀리 보내는 예제를 실습해 봅니다. 7. 손으로 공으로 쳐서 멀리 보내기
SetSky sky1 /Material:"BlackBlank Skybox" HideAxis HideGrid DisableHeadTracking AddSphere sphere1 /Position: /Texture:"ScienceTextures/3Earth" /Mass:1.0 /Scale: GetCameraMotion /OnDetected:proc1 force = 0.0 number = 0 procedure proc1 force = xmotion * 1000 number = number + 1 CopyObject ball_{number} /Source:sphere1 /Position: ball_{number}.AddForce(0, 300, force) end 오른쪽의 코드를 입력하여 모션으로 공을 멀리 보내는 예제를 실습해 봅니다.

28 코드 윗부분 7. 손으로 공으로 쳐서 멀리 보내기 SetSky sky1 /Material:"BlackBlank Skybox"
HideAxis HideGrid DisableHeadTracking AddSphere sphere1 /Position: /Texture:"ScienceTextures/3Earth" /Mass:1.0 /Scale: GetCameraMotion /OnDetected:proc1

29 코드 아래 부분 7. 손으로 공으로 쳐서 멀리 보내기 force = 0.0 number = 0 procedure proc1
force = xmotion * 1000 number = number + 1 CopyObject ball_{number} /Source:sphere1 /Position: ball_{number}.AddForce(0, 300, force) end 코드 아래 부분

30 카메라 앞에서 손을 좌우로 움직이면 공이 발사 됩니다.
7. 손으로 공으로 쳐서 멀리 보내기 카메라 앞에서 손을 좌우로 움직이면 공이 발사 됩니다.

31 실습) 친구 얼굴을 사진 찍어서 공에 입힌 후, 공을 멀리 보내 보세요^^
7. 손으로 공으로 쳐서 멀리 보내기 실습) 친구 얼굴을 사진 찍어서 공에 입힌 후, 공을 멀리 보내 보세요^^