[웹그래픽] - OpenGL, WebGL, THREE.js

WebGL이란

OpenGL을 공식적으로 사용할 수 있게 정의한 웹 그래픽스 API.

OpenGL이란

2D 및 3D 벡터 그래픽스를 렌더링하기 위한 크로스-플랫폼, 크로스-언어 응용 프로그래밍 그래픽 라이브러리.

Three.js란

WebGL을 통해 OpenGL의 기능을 웹에서 사용할 수 있게 도와주는 자바스크립트 라이브러리.

웹그래픽을 정리하자면

일반 웹사이트는 HTML의 요소들로 이루어져 있습니다. Three.js라는 자바스크립트 라이브러리를 사용하여 웹사이트 상에 3D오브젝트들을 추가하고 수정하고 조종할 수 있습니다.

마무리 그리고 실무에서

웹퍼블리셔가 아닌 개발자 역할군으로 전향하고 나서 익명의 프로젝트에 투입됐습니다.
제가 맡은 업무는 모바일 카메라기반 AR프로젝트에서 사용자의 액션과 상호작용이 가능한 3D오브젝트를 디자인, 출력, 컨트롤가능하게 하는 업무였습니다. 웹기반이었기 때문에 웹브라우저에서 구동할 수 있는 시스템을 찾다가 THREE.js를 알게 됐습니다. 해당 라이브러리의 작동원리를 간단하게 파악하고자 WebGL과 OpenGL도 알아보았으나 저에겐 어려운 개념이라서 깊게까진 파악하지 않았습니다.

THREE.js로 구현하는 웹그래픽은 HTML의 canvas요소로 구현할 수 있습니다.
3D그래픽을 구현하는 데 필요한 기본 환경(카메라, 렌더러, 빛, 물체 등)을 자바스크립트로 설정할 수 있습니다.
THREE.js를 다루는 설명은 다음 글에서 자세히 설명할 예정입니다.