v2.0

헬로앱스http://www.helloapps.co.kr

가상현실(VR) 코딩 체험북

01. 스스로 만들어 보는 VR/AR 콘텐츠

02. 가상현실에 코딩 접목하기

03. 3D 슈팅게임 만들어 보기

04. 분자운동 모형 및 가상 교실 환경 만들기

05. 태양계 모형 만들어 보기

06. 관절 및 회전장치 만들기

07. 롤링볼 장치 설계 및 구현하기

08. 충돌 감지 및 거리측정 기능 활용하기

09. 나만의 가상공간 기획 및 설계하기 (자료 수집)

10. 나만의 가상공간 창작 및 발표하기

목차

◾ VR(가상현실) 및 AR(증강현실) 콘텐츠의 구성 원리를 이해할 수 있다.

◾ 간단한 VR/AR 콘텐츠를 스스로 작성할 수 있다.

◾ 3D 공 모양을 추가해 본다.

◾ VR 및 AR 전환 기능을 실습해 본다.

◾ 공의 옵션을 추가하는 방법을 실습해 본다.

◾ 특수효과와 재질을 활용하여 콘텐츠의 내용을 다양하게 변화시켜 본다.

◾ 무중력 옵션을 이용하여 나만의 재미있는 콘텐츠를 창작해 본다.

학습 목표

01 스스로 만들어 보는 VR/AR 콘텐츠

실습 개요

◾ VR 코딩 앱 (안드로이드용 또는 PC용, 설치 과정 참조)

◾ 스마트폰 (안드로이드 기기) 또는 PC (윈도우 OS)

◾ VR 디바이스 (옵션사항임, 스마트폰 장착형)

VR 코딩 앱 VR 디바이스 (카드보드 종류)

준비물

1.1 가상현실(VR)과 증강현실(AR)

최근 들어 글로벌 IT 기업들이 많은 종류의 VR 디바이스들을 출시하고 있

고, 또한 우리 주변에서도 VR 체험방 등이 생기고 있는 등 일상 생활에서

VR 기기들이 점화 대중화 되어 가고 있는 추세이다. 본 단원에서는 최근

관심을 끌고 있는 VR 및 AR 기술을 간략히 소개하고 간단한 콘텐츠들을

직접 만들어 봄으로써 해당 기술의 차이점을 이해할 수 있도록 할 예정이

다.

◾ VR 기술은 원래 3D 기술로 만든 가상의 세계 또는 공간을 의미하지만 최

근 들어서는 공간 몰입 기능이 있는 디바이스와 관련된 기술을 의미하는

형태로 많이 사용되고 있다.

<주변에서 자주 볼 수 있는 VR 디바이스>

<VR 콘텐츠 사례>

HTC 바이브 오큘러스 리프트 구글 카드보드

롤러코스터 비행 조종 게임 입체 영화

가상현실 (VR: Virtual Reality)

◾ VR 콘텐츠의 특징

※ VR 콘텐츠는 눈에 보이는 공간 전체가 모두 가상으로 만들어진다.

※ 공간 몰입 기능이 제공되어 360도 각도로 영상을 보거나 가상의 3D 공간

속에 들어가 주변을 둘러 볼 수 있다.

◾ 가상현실 디바이스

가상현실 디바이스는 HMD (Head Mounted Display) 또는 VR 헤드셋 이

라고 불리며, PC에 연결되어 모니터 역할을 하는 기기와 스마트폰을 장착

하는 기기 2가지가 있다.

◾ 가상현실 콘텐츠

가상현실 콘텐츠는 양안영상 (Side By Side) 형식으로 이루어져 있으며,

왼쪽 눈에 비추어지는 영상과 오른쪽 눈에 비추어지는 영상 2가지가 서로

붙어 있는 형식으로 구성되어 있다.

PC에 연결되는 방식 스마트폰을 장착하는 방식

VR에서 사용되는 양안영상 (Side By Side)

▶ VR 디바이스 또는 콘텐츠를 체험한 사례에 대해 발표해 본다.

◾ AR 기술은 가상현실 기술과 달리 실제의 영상 정보를 배경으로 한다. 대부

분 카메라 영상 위에 추가적인 정보를 표시하는 기술을 의미한다.

▶ VR 콘텐츠 사례와 AR 콘텐츠 사례에 대해 각각 발표해 본다.

실습

증강현실 (AR: Augmented Reality)

증강 현실 콘텐츠 사례

실습

1.2 VR 코딩 프로그램 준비하기

VR 코딩은 스마트폰 또는 PC에서 실습이 가능하며, 둘 중에 하나의 기기

만 있어도 실습이 가능하다.

◾ 웹브라우저를 실행한 후, 아래의 경로로 접속하여 PC용 VR 코딩 프로그램

을 다운로드 받는다.

다운로드 페이지: http://www.helloapps.co.kr/3dvr

◾ zip 파일로 되어 있는 압축파일을 다운로드 받은 후, 압축을 풀면 실행할

수 있는 exe 파일을 볼 수 있다. 이 파일을 실행하면 VR 코딩 프로그램이

실행 된다.

※ 주의사항) 반드시 압축을 해제한 후, 압축 해제된 폴더에 있는 exe를 실행

한다.

PC용 VR 코딩 프로그램 설치하기

◾ 제품키를 입력하는 화면에서 제품키를 입력하여 프로그램을 활성화 시킨

다. PC용 제품키와 스마트폰용 앱 제품키를 동일하게 사용할 수 있다.

◾ 코딩 시작하기 버튼을 클릭한다.

◾ 구글 Play 스토어에서 helloapps 3d로 검색을 한다.

◾ 검색 결과에서 VR 코딩 앱에 있는 설치 버튼을 클릭한다.

◾ 설치 과정이 끝나고 나면 열기 버튼을 클릭한다.

스마트폰용 VR 코딩 프로그램 설치하기

◾ 권한 허용 버튼을 3번에 걸쳐 클릭해 준다.

◾ 제품키를 입력하는 화면에서 제품키를 입력하여 프로그램을 활성화 시킨

다. PC용 제품키와 스마트폰용 앱 제품키를 동일하게 사용할 수 있다.

◾ 코딩 시작하기 버튼을 클릭한다.

1.3 3D 공모양 추가하기

◾ 스크립트 목록 화면에서 오른쪽 아래에 있는 새로 만들기 버튼을 클릭한

다.

◾ 기본 VR 콘텐츠 만들기 버튼을 클릭한다.

새로운 파일 생성하기

◾ 새로운 편집기 화면이 표시되면 왼쪽의 명령어 목록에서 스크롤바를 움직

여 명령어 들을 확인한다.

로직 명령어 3D 오브젝트 환경 명령어 도구 명령어

◾ 3D 오브젝트 명령어에서 공모양 추가하기 명령어를 클릭한다.

◾ sphere1 이름을 가지는 공모양 추가하기 명령어가 추가되었으며, 오른쪽

위쪽 창에는 공모양 추가하기 명령어가 선택되었을 때 사용할 수 있는 옵

션들이 표시된다. 오른쪽 아래에는 공의 이름을 변경할 수 있는 속성 창이

표시된다.

공모양 추가하기

◾ 오른쪽 화면 아래에 있는 실행 버튼을 클릭하면 현재 작성된 코드를 실행

시킬 수 있다.

◾ 왼쪽 조이스틱 버튼은 카메라의 방향을 회전시키는 기능을 수행한다.

코드 실행하기

◾ 오른쪽 조이스틱 버튼은 카메라를 앞뒤로 이동시키는 기능을 수행한다.

◾ 오른쪽 위의 VR 버튼은 VR 모드로 변환시켜주는 기능을 수행한다. 원래

되로 돌아오려면 키보드에서 Esc 키 또는 스마트폰에서 뒤로가기 버튼을

클릭한다.

◾ 원래의 코드 편집기 화면으로 돌아오려면 키보드에서 Esc 키 또는 스마트

폰에서 뒤로가기 버튼을 클릭한다.

◾ VR 코딩에서는 3차원 공간상에 물체를 표시한다. 따라서 3차원 좌표계에

대해서 이해를 충분히 하고 있어야 원하는 위치에 물체를 표시하고 원하는

형태로 크기를 변경할 수 있다.

◾ 3차원 좌표계에서 각 축의 방향은 다음과 같다.

◾ 공의 위치를 위쪽으로 옮기려면 Y축의 값을 증가시켜 주면 된다.

3차원 좌표계

◾ 공의 위치를 위쪽으로 옮기려면 옵션에서 위치 옵션을 클릭한다.

◾ 위치 옵션이 선택된 상태에서 오른쪽 아래의 속성창에서 Y축의 + 버튼을

클릭하여 값이 4.0으로 증가시켜 준다.

공의 위치 변경하기

◾ 실행 버튼을 클릭하여 공의 위치를 확인해 본다.

1.4 통통 튀는 공 만들기

◾ 이전 활동에서 만든 공은 3D 모양으로 보이긴 하지만 현재 허공에 떠있는

형태로서 아래로 떨어지지 않고 고정되어 있다. 이 공을 떨어지게 하려면

공에 질량 옵션을 추가해 주어야 한다.

떨어지는 공

◾ 질량은 kg 단위로서 기본 값이 1.0kg으로 주어진다.

◾ VR 코딩에서는 표준 단위를 사용하며, 거리는 m, 질량은 kg, 힘은 N 단

위를 사용한다.

◾ 코드를 실행하면 공이 아래로 떨어지는 것을 볼 수 있을 것이다.

◾ 떨어지는 공이 끝없이 떨어지지 않도록 바닥판을 추가해 보자. 3D 오브젝

트 명령어 목록에서 바닥판 추가하기 명령어를 클릭하여 바닥판을 추가해

본다.

바닥판 추가하기

◾ 작성된 코드를 실행하면 바닥판이 추가되고 공이 바닥판 위로 떨어지는

것을 볼 수 있다.

◾ 이전 활동의 결과를 보면 공이 튀기지 않고 바닥에 그냥 붙어 버리는 것

을 볼 수 있는 데, 이는 공과 바닥에 탄성이 없이 때문이다. 먼저 공모양

추가하기 명령어를 선택한 후, 옵션에서 탄성 옵션을 찾아서 공에 추가해

준다.

공에 탄성 추가하기

◾ 탄성 값은 0.0 ~ 1.0 사이의 값을 가지며, 0은 탄성이 없는 상태이고, 1.0

은 탄성이 가장 큰 상태이다.

◾ 바닥판에도 탄성 옵션을 추가해 준다.

◾ 위의 코드를 실행해 보면 예상과 달리 바닥판이 공과 함께 떨어지는 것을

볼 수 있다. 이는 탄성이 적용되면 질량이 같이 적용되기 때문이다.

◾ 바닥판 추가하기 명령어를 선택한 상태에서 오른쪽 옵션 목록을 보면 중

간에 위치고정 옵션을 볼 수 있다. 바닥판 추가하기 명령어에 위치고정 옵

션을 추가해 준다.

◾ 코드를 실행하면 공이 통통 튀는 것을 볼 수 있을 것이다.

바닥판 위치 고정시키기

1.5 공의 모양 변경하기

◾ 공은 위치 옵션과 마찬가지로 크기 옵션도 3차원 좌표축을 기준으로 비율

을 지정해 줄 수 있다.

◾ 공의 크기를 별도로 지정하지 않으면 공의 크기 비율은 기본적으로 X, Y

Z 축에 대해 각각 1, 1, 1의 비율이 적용된다.

◾ 만약 X축으로 크기를 3배 키우려면 다음과 같이 크기 옵션을 추가한 후,

X축의 값을 3.0으로 수정해 준다.

크기 옵션

◾ X축으로 크기가 3배 늘어난 결과는 다음과 같다.

▶ 공의 크기를 다양한 형태로 변경시켜 본다.

실습

1.6 바닥판과 공에 사진 입히기

◾ 3D 오브젝트에 재질 옵션을 추가하면 3D 모양의 외부에 사진이나 그림을

입힐 수 있다.

◾ 먼저, 바닥판 추가하기 명령어를 선택하고, 옵션 목록에서 재질을 추가해

준다.

◾ 벽돌 모양의 재질이 기본 값으로 설정되어 있으며, 재질 속성에서 다른 그

림으로 변경할 수 있다.

◾ 일단 코드를 실행하여 벽돌 그림이 어떻게 적용되는 지 확인해 본다.

재질 옵션

◾ 다른 재질을 선택하여 결과가 어떻게 달라지는 지 관찰해 본다.

◾ 오른쪽 재질 속성창 맨 아래에는 카메라로 사진 찍기 버튼이 있다. 이 버

튼을 클릭하면 사진을 촬영하게 되고, 촬영된 사진이 재질로 선택되게 된

다.

▶ 공과 바닥판에 친구들의 얼굴 사진이나 옷 사진을 입혀 본다.

사진 입히기

실습

1.7 증강현실 모드 적용하기

◾ 로직 명령어 맨 위에 있는 증강 현실 모드 명령어를 추가한 후 코드를 실

행시켜 본다.

◾ 카메라 영상 위에 3D 콘텐츠가 표시되는 것을 볼 수 있을 것이다.

증강 현실 모드

1.8 특수 효과 추가하기

◾ 로직 명령어 아래 쪽에 있는 도구 명령어 그룹으로 이동해 보면 특수효과

추가하기 명령어를 볼 수 있다. 이 명령어를 클릭하여 추가해 준다.

◾ 옵션에서 효과파일을 추가해 준다.

특수 효과 추가하기

◾ 효과파일의 기본 값에는 비눗방울이 선택되어 있다. 실행 버튼을 클릭하여

결과를 확인해 본다.

◾ 효과파일 목록에서 맨 위에 있는 Daylight Water 효과를 선택한 후, 코

드를 실행시켜 본다.

물 효과

▶ 다음과 같이 비가 오는 효과를 추가하려면 어떠한 효과를 선택해야 하는

지 찾아보고 결과를 비교해 본다.

실습

1.9 무중력 설정하기

◾ 편집기 왼쪽 아래에 있는 뒤로 가기 버튼을 눌러서 목록으로 이동한다.

◾ 오른쪽 아래에 있는 새로 만들기 버튼을 눌러서 새로운 코드를 생성한다.

◾ 3D 오브젝트 명령어에서 박스모양 추가하기를 클릭하여 새로운 박스 모양

을 추가한다. 아래 그림과 같이 옵션을 추가해 준다.

◾ 박스 모양에는 무중력이 적용되어 있어 박스가 공간에 중력을 적용받지

않고 떠 있는 상태가 된다.

새로운 파일 만들기

박스 모양 추가하기

◾ 무중력 상태로 떠 있는 박스가 공과 충돌하였을 때, 어떻게 움직이는 지를

관찰하기 위해 아래와 같이 떨어지는 공을 추가한 후 실행해 본다.

◾ 공이 박스와 충돌한 후, 박스가 회전하면서 공간을 이동하는 것을 볼 수

있을 것이다.

공과 충돌시키기

▶ 공간상에 다양한 위치에 여러 3D 물체를 생성한 후 무중력으로 설정한다.

공이나 다른 물체를 생성된 물체들과 충돌시켜 무중력 공간 상에서 물체가

어떻게 운동하는 지를 관찰한다.

실습