WebAR Exhibitions

01 / WAR MEMORIAL OF KOREA

The Desk of Decision

War Memorial of Korea · Korean War Leaders’ Room

2025.08

The Desk of DecisionExhibition introduction · On-site AR experience

I developed a WebAR viewer that displays 3D models when it recognizes an image marker. The recording shows the exhibition, QR instructions and AR running on a phone.

02 / GANGWON GAMYEONG

Gangwon Gamyeong

Wonju City Information Center · AR/VR experience

2025.01

I developed the Gangwon Gamyeong diorama AR/VR and Yeongjugwan AR content. These visitor photographs follow the experience from QR instructions to AR on the phone. The final pair compares the location without and with the virtual rabbit.

AR instructions and a QR code on a sign beside the Gangwon Gamyeong pond — 01
**QR instructions**
Open the AR experience from the on-site sign.

Phone aimed at the moon sculpture with the experience open — 02
**Point the camera**
The phone displays the real location.

Phone AR view showing a rabbit character on the moon sculpture — 03
**AR overlay**
A rabbit character appears in the camera view.

The moon sculpture and buildings at Gangwon Gamyeong without AR content — 04
**Physical space**
The location without AR content.

AR photo with a virtual rabbit on the moon sculpture at Gangwon Gamyeong — 05
**AR photo**
The same location photographed with the AR character.

On-site photography ·Pinkku, Naver Blog ↗14 Aug 2025 · Select a photo to enlarge it.

03 / HAEGWAN 1897

Haegwan 1897

Mokpo Food Culture Gallery · AR guide

2025.05

Haegwan 1897On-site WebAR demo

I developed the 3D model viewer for a web AR guide accessed through image markers.

AlvaAR / Three.js

Implementation

I used AlvaAR and 8th Wall in my WebAR work. This example focuses on the integration between AlvaAR camera tracking and Three.js.

Camera frames are cropped to the viewport and passed as ImageData to AlvaAR. AlvaAR estimates a camera pose matrix. Rotation and position are extracted, axis directions are converted, and the result is applied to the Three.js camera. — The viewer prepares frames and converts poses. AlvaAR estimates the camera’s position and orientation.

Frame preparation

I scaled the camera feed to fill the viewport while preserving its aspect ratio, then cropped the overflow around the center. AlvaAR was initialized at the same resolution as the prepared frames.

Pose conversion

I extracted rotation and position from the pose matrix returned by AlvaAR, converted the axis directions, and updated the Three.js camera’s quaternion and position. Updates only used available poses; detected plane poses were stored separately from camera poses.

NEXTStudy