본 논문에서는 CSS3 스타일시트를 이용하여 HTML5로 작성된 웹 페이지를 3차원 공간에서 3D 스테레오스코픽으로 표현하였다. 먼저, 웹브라우저상의 웹 콘텐츠를 3차원 공간에 효과적으로 재구성할 수 있도록 다양한 웹 페이지 분리 방법을 제시하였다. 다음, CSS3 모듈을 이용한 3D 뷰 볼륨 설정 방법을 제안하였다. 스테레오 이미지 생성을 위해 시스템 렌더링 엔진 에뮬레이터에서는 자동으로 생성한 스테레오 뷰 볼륨의 가상 좌안, 우안 카메라로부터 각각의 영상을 획득하였다. 그리고 각 샘플 콘텐츠들이 3D 스테레오스코픽으로 표현된 결과를 확인하였다.
In this paper, we represented the HTML5 webpage in 3D space for the 3D stereoscopic display by using CSS3 stylesheet. At first, we suggested various webpage separation methods in order to reconstruct webpages in the 3D space effectively. Next, we suggested 3D view volume setting method using CSS3 modules. For the resulting stereoscopic images, we developed a rendering engine emulator which produce dual images from virtual left and right-eyed cameras. And we have checked the sample contents displayed on the 3D stereoscopic monitor.
