상세 컨텐츠

본문 제목

누구나 따라 할 수 있는 AR 콘텐츠 개발 방법

디지털콘텐츠/이슈리포트

by 디지털콘텐츠기업 성장지원센터 2020. 5. 27. 18:46

본문

4차산업혁명 기술 중 하나로 손꼽히는 VR·AR 기술에 대해 다들 한 번쯤은 들어보셨을 거 같습니다. 그중에서도 특히 AR에 관심을 두고 계신 분이 계신가요?

그렇다면 여기를 주목해주세요! 지금부터 AR 기술을 코딩없이 손쉽게 사용해보는 법을 순서대로 알려드리겠습니다.

일단, 본격적인 구현에 앞서 먼저 미리 준비해야 할 것이 있습니다. AR 카메라가 인식할 현실 속 물건 이미지 1장과 그 위에 덮어씌울 이미지 1장입니다. 이때 인식할 현실 속 물건을 담은 이미지는 흰색이나 아무 내용이 없는 것보다는, 색상이 화려하고 패턴이 많은 것을 추천합니다. 전자의 경우에는 카메라 인식도가 낮아 제대로 인식이 되지 않기 때문입니다.

 

< 좌 : 카메라가 인식할 현실 속 물건 / 우 : 인식했을 때 그 위에 덮을 이미지 >

먼저, AR 기술을 구현할 프로그램의 설치입니다.

여기서는 유니티 프로그램과 뷰포리아 엔진을 이용해 AR 기술을 구현할 것이기 때문에, 기술을 구현하기 위해서는 유니티의 설치가 필수적으로 되어있어야 합니다. 유니티 홈페이지(www.unity.com)에 접속하셔서 Get Started 버튼을 누릅니다. 누르면 나오는 Plans and pricing 홈페이지에서 Individual 버튼을 누르고 Personal로 다운로드를 진행합니다.

 

유니티 허브를 내려받으셨다면, 마지막의 설치 버튼을 누른 다음 오른쪽 위의 추가 버튼을 누르세요. 그럼 아래와 같은 창이 뜰 것입니다.

 

< 출처 : Unity HUB, https://unity3D.com >

정식 릴리스 선택 창에서 Unity 2019.3.14.f1이 아니라 2018.4.23.f1(LTS) 버전을 누르고 다음으로 넘어가 주세요. 모듈 추가 창에서 반드시 Vuforia 엔진을 눌러주세요. 이 모듈을 받아야 AR 기능을 구현할 수 있습니다. 그 다음 완료 버튼을 누르고 설치될 때까지 기다립니다. 3D 템플릿으로 새 프로젝트를 시작하면 기초적인 개발 환경은 다 갖춰졌습니다!

 

두 번째 단계는 뷰포리아 AR 엔진의 설정을 하는 단계입니다.

먼저 왼쪽에 있는 Hierarchy 창에서 뷰포리아 AR 카메라를 넣기 위해 메인 카메라를 삭제합니다. 위에 있는 바에서 GameObject를 눌러 Vuforia Engine > AR camera를 눌러 해당 오브젝트를 프로젝트에 삽입합니다. 다음으로 FileBuild Settings을 눌러 환경 설정을 진행합니다. FileGameObjcet와 마찬가지로 상단 바에 자리 잡고 있습니다. Build Setting 창이 뜨면 기본 설정값이 PC 플랫폼에 맞춰져 있을 것입니다. 현재는 AR 어플리케이션을 만드는 것이 아니므로 이를 건드리지 않고 바로 아래에 있는 Player Setting 버튼을 누르겠습니다. 누른 후에는 아래와 같이 XR settings을 찾아 Vuforia AR 서포트를 체크해주셔야 합니다.

 

< 출처 : Unity HUB, https://unity3D.com >

Hierarchy 창에서의 AR 카메라를 누른 다음 Inspector 창을 봐주세요. 아래에 있는 open Vuforia Engine configuration을 누른 후, ADD License 버튼을 눌러주세요.

 

< 출처 : Unity HUB, https://unity3D.com >

뷰포리아 엔진 웹사이트가 뜬 후에 회원가입을 해주시고 로그인 해주시면 됩니다. 그 후, Develop 창에서 License Manager를 누르고 Get Development Key를 눌러주세요. 라이센스 이름을 아무거나 입력해주시고 Terms 동의 후 confirm을 누르시면 라이선스 키를 획득하실 수 있습니다. 이 획득한 키를 ADD License key의 창에 붙여넣으시면 기본 설정은 완료입니다.

 

< 출처: 뷰포리아 개발자 엔진, https://developer.vuforia.com >  

 

< 출처 : Unity HUB, https://unity3D.com >

세 번째 단계는 프로젝트에 미리 준비했던 이미지를 삽입하는 단계입니다.

상단 바의 GameObjectVuforia Engine으로 들어가셔서 image를 누릅니다. 그러면 ImageTarget이라는 객체가 Hierarchy 창에 뜰 것입니다. 아래 창(Project)에서 Assets > Resources > VuforiaConfigration을 누릅니다. 아까와 같이 Inspector 창을 보되, 아래로 내려가 DataBases 항목에서 ADD DataBases를 누릅니다.

 

< 출처 : Unity HUB, https://unity3D.com >

그러면 뷰포리아 개발자 웹사이트가 자동으로 열릴 텐데요, 그 후로는 Target Manager 탭 클릭한 다음 Add Database(이하 DB)를 클릭하시면 됩니다. DB 생성 시에는 아무 이름으로, 또 기본값으로 생성해 주세요. 생성된 DB에서 ADD Target을 클릭해 주신 다음, 생성된 DB에서 ADD Target을 클릭해 주세요.

 

클릭 후 뜨는 ADD target 창에서 type은 기본 값인 single image 로 설정해주신 다음 카메라가 인식할 물건이 있는 이미지를 업로드 해주세요. 이때 업로드 한 이미지의 실물 가로 길이를 미터 단위로 입력해주셔야 하는데, 원래 길이에 0.01을 곱한 값을 입력해주시면 됩니다. 예를 들면, 8cm 길이의 물건을 0.08로 입력하면 되는 것이죠.

그 후 카드 이름을 입력하시고, 추가해주시면 인식할 이미지가 담긴 DB가 완성됩니다. 그다음에는 완성된 DB의 이미지를 유니티와 연결하는 작업을 할 건데요, Downlode Database를 눌러 Unity Editor에 체크해주시고 다운로드를 진행해주세요. 다운로드가 끝났다면, 내려받은 패키지를 눌러줍니다. 그러면 유니티 프로그램에서 아래 세 번째와 같은 창이 뜰 겁니다. 그 창에서 import를 누르면 저희가 인식하고자 하는 이미지가 유니티와 연동됩니다.

 

< 출처: 뷰포리아 개발자 엔진, https://developer.vuforia.com >  

 

< 출처 : Unity HUB, https://unity3D.com >

네 번째 단계는 오브젝트에 인식할 물건을 입히고, 덮어씌울 이미지의 위치를 조정하는 단계입니다.

유니티의 Hierarchy 창에서 imageTarget을 선택 후, 아까 전 단계에서 삽입한 DB 이미지를 Inspector 창에서 적용합니다. 다시 Hierarchy 창에서 ImageTarget을 선택해주세요. 객체를 골랐다면, 마우스 오른쪽 버튼을 눌러 3D Object > Quad를 선택해주시면 주황색 테두리의 직사각형 모양 객체가 뜰 것입니다. 이 객체가 인식시킬 이미지 위를 덮을 수 있도록 Rotation scale을 조정해주세요. x축을 90도로 회전시키면 인식시킬 이미지를 덮을 수 있으니 참고해주세요.

 

< 출처 : Unity HUB, https://unity3D.com >

마지막 단계입니다.

덮어씌울 이미지를 아래에 있는 Resources 창에 드래그해 주세요. 이미지가 추가된 Resource 창에 마우스 우클릭을 한 후 Create > Material을 선택해주세요. 아래 오른쪽 사진처럼 그 후 덮을 이미지를 생성된 Material inspector 탭에 있는 Albedo까지 드래그해 주시면 됩니다. 그 후 생성된 MaterialQuad에 드래그하면 완성입니다.

 

< 출처 : Unity HUB, https://unity3D.com >

시작() 버튼을 눌러 결과를 확인해보실 수 있습니다. 아래는 제가 직접 한 결과를 보여주는 사진입니다.

 

<출처: Unity HUB, https://unity3D.com>  

지금 구현한 이 플랫폼을 안드로이드로 바꾸면 안드로이드 핸드폰에서 작동하는 안드로이드 AR 어플리케이션을 만들 수 있습니다. 조금 방법이 복잡하다고 생각되실 수는 있겠지만, 위의 내용대로 차근차근 따라 해 보시면 무리 없이 하실 수 있습니다. 지금까지 코딩없이 누구나 AR 콘텐츠을 개발하는 방법이었습니다.

 

관련글 더보기

댓글 영역