A study on the implementation of Korea's traditional pagoda WebXR service

Abstract

본 연구는 전통적인 건축물인 '탑'에 대한 형태와 특징을 더 잘 이해하기 위해 WebXR 기술을 활용하여 웹 상에서 3D 모델로 확인하고 가상현실에서 경험할 수 있도록 하는 데 중점을 두었다. 우리 나라의 전통 탑은 직접 방문해서 확인하기 어렵고, 탑의 규모로 인해 각 층의 구조와 특징을 파악하는 것도 어려움이 있다. 이런 문제들을 해결하기 위해 본 연구에서는 지리적이고 시간적 제약 없이 사용자가 WebXR 형태의 서비스를 통해 탑을 확인하고 분석할 수 있도록 했다. 연구방법으로는 WebAR을 활용하여 스마트 기기 및 현장에서도 직접 3D 모델을 웹에서 확인할 수 있도록 서비스를 제공한다. 그러나 야외에서는 카메라 품질과 외부 조건에 따라 성능이 차이가 있을 수 있다. 이러한 문제를 개선하기 위해 탑의 원형을 검출하고 매칭하는 기술을 적용했다. 이를 통해 현장 방문 없이 전국의 다양한 전통 탑에 대한 정보와 특징을 웹-상에서 확인하고 분석할 수 있는 원격지원 서비스를 제안하며, 현장에서는 스마트 기기를 활용한 증강현실 형태의 탑을 확인할 수 있을 것으로 기대된다.

This study focuses on enhancing the understanding of the form and characteristics of traditional towers, or 'pagodas,' by utilizing WebXR technology to enable users to explore 3D models and experience them in virtual reality on the web. Traditional towers in Korea pose challenges for direct on-site verification due to their size, making it difficult to examine the structure and features of each level. To address these issues, this research aims to provide users with a WebXR service that allows them to remotely explore and analyze towers without geographical or temporal constraints. The research methodology involves utilizing WebAR to offer a web-based service where users can directly view the original form of the tower's 3D model using smart devices both online and on-site. However, outdoor conditions may affect performance, and to address this, a tower-outline detection and matching technique was employed. Consequently, we propose a remote support service for traditional towers, allowing users to remotely access information and features of various towers nationwide on the web. Meanwhile, on-site visits can involve experiencing augmented reality representations of towers using smart devices.

I. Introduction

문화유산은 사람들의 이해와 공감을 넓히는 중요한 수단이다. 특히, 문화유산은 그 지역과 나라의 정체성을 이해하는 데 도움을 준다. 그러나 문화유산을 방문하거나 체험하는 것은 시간, 비용, 지리적 제약, 훼손 등 여러 한계가 존재하고 있다[1]. 본 논문에서는 문화유산 분야에서 WebAR의 활용성을 조사하고[2][3], 그 성과와 한계, 향후 발전 가능성을 분석하며 이를 통해 WebXR 기술이 문화유산과 여행 분야에서 어떻게 더 효과적으로 활용될 수 있는 지에 대한 연구를 진행했다. 그림 1은 WebAR를 이용한 증강 현실 콘텐츠이다. 이와 같이, 증강현실 기술이 다양한 분야에 적극 활용되고 있고, 고-기록물의 경우 실제 체험하고 보기 힘듦에 대한 보완 기술로 응용되고 있다. 본 연구에서는 스마트 기기용 앱을 사용하지 않고 단지 브라우저를 통해 다양한 OS에서도 확인할 수 있는 Web기반의 증강현실 기술을 연구하고 적용했다[4]. 또한, 인식률을 높이기 위해 윤곽선 검출을 통해 인식 성능을 항상 시켰다.

Fig. 1. Using the Aframe WebAR

II. Preliminaries

2.1 Basic Concepts of XR(Extended Reality)

XR은 세부 기술로 VR(Virtual Reality), AR(Augmented Reality), MR(Mixed Reality) 등의 기술로 구분한다[5][6].

그림2는 크로노스사에서 제안하는 VR, AR, MR 등을 통합한 형태의 OpenXR 플랫폼이다[7]. 이러한 플랫폼은 사용자가 물리적 세계를 인식하는 것에 디지털 정보(텍스트, 이미지, 3D 모델 등)를 겹쳐서 표현하는 확장현실 기술이 XR이다. 이러한 용어는 1990년대 초 처음 등장하였으며, 이후로 컴퓨터 그래픽, 인간-컴퓨터 상호작용, 시각 과학 등 다양한 분야를 통합하는 여러 분야로 발전했다. 그림3은 Ivan Edward Sutherland에 의해 고안된 최초의 가상현실 시스템은 헤드 마운티드 디스플레(HMD:Mounted Display)이다. 양안 카메라방식으로 천장에 지지대를 세워 아래쪽에서 착용하는 방식이다.

Fig. 2. OpenXR Service Platform

Fig. 3. World’s first virtual reality headset

2.2 WebXR

WebXR은 웹 기술을 사용하여 확장현실(AR) 및 가상현실(VR)과 같은 확장된 현실 경험을 구현하는 데 사용되는 표준 API(응용 프로그램 프로그래밍 인터페이스)이다. WebXR은 증강현실 및 가상현실 콘텐츠를 웹 브라우저에서 쉽게 만들고 배포할 수 있도록 지원한다. 또한, WebXR은 WebVR API와 WebAR API를 통합하여 하나의 통합된 API로 제공한다. 이것은 사용자가 VR 헤드셋이나 AR 디바이스를 사용하지 않고도 브라우저를 통해 현실 세계를 더 나은 방식으로 탐험할 수 있다. WebXR은 여러 플랫폼 및 디바이스에서 작동하도록 설계되어 있어 다양한 환경에서 이를 지원한다[8][9]. WebXR의 주요 구성 요소는 XRSession: XR 콘텐츠가 실행되는 세션을 나타내는 인터페이스로 가상 및 증강 현실 디바이스와의 상호 작용을 관리하고 이벤트를 처리하고, XRReferenceSpace: 가상 및 증강 현실 공간을 정의하는 인터페이스로 사용자의 기기에서의 움직임을 추적하고 이동을 정의하는 데 사용한다. XRInputSource: 사용자의 입력 디바이스를 나타내는 인터페이스로 헤드셋, 컨트롤러, 손 추적 센서 등을 포함하며, XRFrame: 프레임별로 업데이트되는 정보를 제공하는 인터페이스로 사용하여 현실 세계의 변화를 감지하고 상호 작용 지원하는 특징이 있다. 본 연구에서는 WebXR의 요소 기술인 WebAR을 활용해서 우리나라 전통 탑에 대한 웹기반 증강현실 기술을 연구했다. Web Augmented Reality(WebAR)은 별도의 애플리케이션 설치 없이 웹 브라이저를 통해 증강 현실(AR)을 경험을 제공하는 기술이다. 이러한 접근성은 사용자에게 즉시 AR 경험을 가능케하므로, 더욱 다양한 사용자 층을 대상으로 서비스를 확장할 수 있다는 장점이 있다. WebAR의 장단점을 비교 분석해보면 크게는 접근성, 다양한 플랫폼 지원, 중앙 집중식 업데이트가 있다. 웹 기반의 특성상 다양한 디바이스와 운영 체제에서 별도 설치 없이 작동하며 웹 서버에서 콘텐츠를 관리하기 때문에 사용자는 별도의 업데이트를 할 필요가 없다[10][11]. 그러나 단점으로는 웹-브라우저 기반의 AR은 네이티브 앱에 비해 성능이 제한적이며, 모든 웹 브라우저가 AR 기능을 완벽히 지원할 수는 없다.

2.3 WebAR's Recent Trends and Libraries

WebAR 기술은 현재 빠르게 성장하고 있으며, 다양한 분야에서 활용되고 있다. 특히, COVID-19 팬데믹 이후로 비대면 환경에서의 활용 가능성이 크게 주목받고 있다. 팬데믹 상황은 원격 참여 솔루션에 대한 필요성을 가속화 시켰고, WebAR은 이러한 문제를 해결하는 데 있어 중요한 역할을 했다. 또한, 특별한 앱 설치 없이도 AR 경험을 제공함으로써, 사용자 참여가 높아지고 있으며, 상품 시각화를 통한 온라인 쇼핑에 활용한다. WebAR를 구현하기 위한 라이브러리로는 대표적으로 표1과 같이 세 가지가 있다. WebXR은 웹 개발자들이 VR 및 AR 경험을 구현하는데 사용할 수 있는 다양한 라이브러리와 프레임워크를 제공하며[12], 웹 페이지에서 가상현실 컨텐츠를 구축하고 사용자에게 더 풍부한 상호작용을 제공한다[13].

Table 1. A Library for WebAR

III. The Proposed Scheme

본 논문에서는 전통 탑에 대한 웹 기반의 증강 현실(WebAR) 서비스를 제안한다. 제안하는 서비스는 웹-브라우저 기반으로 동작하며, 전통 탑의 3D 모델을 실시간으로 사용자에게 제공하는 시스템 구현 방법에 관해 연구했다. 그림 4은 탑 제작 및 인식 과정으로 세부과정은 다음 절에 기술한다.

Fig. 4. Process Pagoda AR for WebXR

3.1 System Architecture

웹상에서 증강현실 시스템은 크게 세 부분으로 구성되어 있다. 데이터수집, 데이터 저장, 그리고 WebAR 구현으로 표2는 전통탑의 증강현실(AR)에 필요한 데이터 수집 과정으로, 우나라 전통 석탑에 대한 수집 데이터이다.

Table 2. used for displaying the Augmented Reality (AR) representation of traditional towers.

본 연구에서는 수집된 데이터를 클라우드 기반의 서버를 사용하여 데이터를 저장한다. 마지막 단계로 기술 스택으로 HTML,JavaScript,CSS를 사용하여 WebAR을 구현했다.

3.2 Environment for using WebAR

표3는 수집된 데이터를 통해 최종 WebAR을 구현하는데에 있어 사용된 웹 브라우저, 모바일 기기, 서버 환경이다.

Table 3. Compilation Setting for WebAR

WebAR 구현에 사용되는 AR.js는 Markerless AR은 주변 환경 정보가 주어지지 않은 상태에서, 센서의 정보를 이용하여 벽이나 바닥과 같은 환경 정보를 인식하고 디바이스의 위치를 추적하는 방식의 AR로, SLAM(Simultaneous Localization and Mapping)이라 불리는 기법을 이용하여, 카메라 피드로부터 들어온 이미지를 분석한다. 또한, SLAM 엔진을 구현하여 사용하는 8th wall과 앞으로 설명할 WebXR API의 기반이 되는 ARCore/ARKit이 이 방식에 해당한다[14][15].

IV. Experiment and analysis

본 연구에서는 전통탑의 인식율을 높이기 위해서 탑 이미지에 대한 윤곽선을 검출하는 단계를 포함했다. 일반 이미지의 경우 태양광, 주위의 환경에 따라 인식률이 떨어지는 단점이 있다. 표 4는 전통 탑에 대한 윤곽선 검출 및 프로그램 주요 코드이다. 이미지 처리를 위해 OpenCV2 와 수학적 계산을 위한 matplotlib.pyplot 모듈의 함수를 사용해서 구현했다. matplotlib.pyplot는 주로 수학 연산과 그래프를 그리는 도구로 많이 사용한다.

Table 4. Traditional pagoda outline detection

윤곽선으로 검출된 이미지와 패턴화(Raw 데이터 타입의 수치화)된 AR.js에대하여 Raw파일 형태의 비트열화해서 증강현실에 사용되는 인식 마커로 사용한다[16][17]. 기존의 마커형태의 이미지보다, 마커리스 형태의 실제 이미지 대상으로 인식하면 좀더 현실감이 높다는 장점이 있다. 인식율을 극대화기 위해서 본 연구에서 윤곽선 검출과 마커리스형태의 마커를 사용했다. 그림4는 마커로 생성된 RAW파일이다. "patt 파일"은 주로 마커의 패턴을 정의하는데 사용된다. 이 파일은 특정 마커를 인식할 때 어떤 3D 모델이나 콘텐츠를 렌더링할지에 대한 정보를 담고 있다. "patt 파일"은 주로 텍스트 파일로 구성되고, 최초 수치는 RAW의 개수를 흑백 밝기로 표현된다. 그림 5는 탑에 대한 “*.patt”파일에 대한 매칭 영역을 표시한다.

Fig. 5. AR.js pattern for Pagoda recognition

그림 6는 AR 마커를 생성하는 과정으로 이미지를 사이트에 입력하면 전용 마커를 생성한다. 사이즈 및 해상도를 변경가능하다. 이미지 패턴은 AR.js 사이트의 AR.js Marker Training에서 패턴을 시켜 데이터 만들었다. AR.js 이미지 패턴화하기 위해 미리 준비된 전통탑 선정해서 진행했다. 물론, 윤관선 검출한 결과와 동시에 진행하도록 했다. 과정에서 옵션은 패턴 비율(0.90), 이미지 사이즈(211 pxel)를 설정해 로컬에 “*.patt” 파일로 변환했다. 그림 7은 3차원 탑 이미지에 대하여 페턴파일을 연결하는 과정으로 사이트에서 추출된 “*.patt”에 대한 Aframe 웹프로그램을 통해서 Import하는 과정으로 프로그램에서 매칭작업을 진행한다.

Fig. 6. AR.js Marker Training Website

Fig. 7. WebAR a-maker source code

그림8은 최종 결과물로 조이스틱 버튼을 통해서 3d객체의 좌우이동을 확인하고 “+”,“-”통해서 표시된 객체의 확대 및 축소를 통해 자세한 탑의 형태을 확인할 수있다. 또한, “R”,“L” 버튼을 이용해서 표시된 객체의 이동이 되도록 구현했다. 또한, 체감형 형태로 도출된 탑 3D모델을 가상현실 보는 장치인 HMD를 통해서 볼수 있도록 구현했다. 웹-상에서 가상현실 기능은 AFrame API를 기본으로 사용하므로 특별한 구현 없이 자동으로 컨트롤러를 인식한다. 이러한 기능을 일명 WebXR 서비스이다.

Fig. 8. WebAR recognition web service

실험은 패턴 비율은 0.5, 이미지 사이즈는 512px로 동일한 환경에서 진행했다. 패턴화된 물체를 인식한 후에 WebAR에서 디바이스를 통해 물체를 인식하는 시간을 비교 분석하였을 때 크게 차이가 나지 않는 결과를 보이고 있다. 외적으로 인식을 할 때에 구도, 카메라 품질에 영향을 있는 것으로 사료된다. 실제로 WebAR을 디바이스를 연동했을 때 실제로 보여진다. 또한, 조이스틱을 통해 3D 객체를 이동할 수 있고 회전 기능을 구현하여 3D 객체를 다 각도에서 볼 수 있다. 이러한 기능을 구현 함으로써 WebAR으로 지리적 제한에서 벗어나 관람할 수 있으며 향후에 추가적인 기능을 추가하여 시대적 흐름, 자세한 분석을 WebAR을 통해 해결할 수 있을 것으로 사료된다. 표5은 수집된 데이터를 WebAR으로 물체를 인식하였을 때 물체 인식 속도를 나타낸 것이다. 대부분 2.33초 이내에 인식을 완료됨을 확인했다. 이러한 근거로 3D 데이터 경우 로딩속도, 네트워크속도, 카메라의 각도 및 해상도에도 좌우한다. 하지만, 기존의 증강현실 도구인 뷰포리아, ARCORE, ARKIT 특정 플랫폼(Android, Windows, IOS)에 의존해서 개발 과정과, 사용자 접근성에 떨어지는 반면 웹 기반의 AR의 경우 언제, 어디서나 쉽게 웹-브라우저를 가지고 접근할 수 있어 접근성에서 높다고 판단된다.

Table 5. WebAR Recognition Time(Loading)

표5에서 8개의 3D모델링 탑에 대하여 AR.JS를 통해 패턴인식을 위한 마커를 생성하고 Aframe 플랫폼의 API를 사용해 웹상에서 동작하도록 구현했다. 이러한 결과 평균 로딩 시간은 1.95 초의 성능을 보였으면 실제 객체을 인식하는 평균 속도는 0.38초가 소요됨을 확인했다. 이로써 기본의 증강현실을 구현하는 어플리케이션 보다 접근성 및 속도 면에서 우수한 성능을 보임을 확인했다. 또한, 인식율을 높이기 위해 윤곽선 검출기능을 포함했다.

V. Conclusions

우리나라의 문화유산인 전통 탑의 경우 목탑고 석탑으로 구분되고 대부분이 2D형태의 정보제공하고 있다. 또한, 일부 3D형태로 제공하는 경우 서비스플랫폼(Windows, Android, IOS)에 의존해서 사용자의 접근성이 떨어진다. 또한, 기본의 방법은 야외의 경우 주변환경의 변화에 따른 인식이 저조한 편이다. 이에 본 연구에서는 웹-환경에서 웹-브라우저를 통해 사이트에서 증강현실을 바로 사용할 수있도록 WebXR 기반요소인 WebAR를 구현했다. 또한, 가상환경에서 볼 수 있도록 구현했다. 연구결과는 WebAR 기술이 빠르고 안정적으로 물체를 인식하며, 3D 객체를 정확하게 표현할 수 있음을 보여주었다. 그러나 이 기술에는 여전히 몇 가지 한계가 있다. 첫째, 웹 브라우저 기반의 WebAR은 일반적인 앱에 비해 성능 제한이 있을 수 있다. 둘째, 모든 웹 브라우저와 장치가 완벽하게 지원하지 않을 수 있다는 문제가 있다. 셋째, 실제 문화유산과 WebAR의 경험 사이에는 여전히 차이가 있을 수 있으며, 이를 어떻게 더 가깝게 가져갈 수 있는 대한 연구가 필요하다. 향후 연구 방향으로는, 더 높은 성능과 호환성을 위해 웹 브라우저와 장치 간의 최적화 작업, 실제 문화유산과의 경험 차이를 줄이기 위한 새로운 상호작용 디자인 또는 기술 개발 등이 있다. 또한, 문화유산 자체에 대한 더 깊은 이해와 분석을 통해, WebAR 경험이 실제 문화유산 체험에 어떻게 도움을 줄 수 있는지 더 구체적으로 연구할 필요가 있다. 결론적으로, WebAR는 문화유산을 다루는 여러 분야에서 활용 가능한 기술로, 다양한 가능성과 미래가 있다. 이 기술은 문화유산에 대한 이해와 존중을 넓히는 동시에, 더 많은 사람이 문화유산을 체험하고 학습할 수 있는 새로운 경로를 제공할 것이다.