혹시 이 글을 보고 계신 당신~!!

크롬이나 크롬 플러스를 쓰시고 계신가?
아니면 이번에 발표된 파이어폭스4나 사파리도 괜찮으니 여기 이 사이트를 한번 들어가 보시라.
(정확히는 Chrome 9+ / Firefox 4+ / Safari 10.6+ 버전이면 OK~!! )

그리고 키보드의 화살표키를 이렇게 저렇게 눌러보시라.

펼쳐지는 화면의 3D 그래픽은 ActiveX도 플래시도 아니다.
웹 브라우저 자체에서 구동되는 WebGL 기술로 구현된 것이다.

WebGL로 이 정도의 3D 퀄리티를 구현가능해졌다. 화면은 Hello Racer 캡쳐화면
WebGL로 이 정도의 3D 퀄리티를 구현가능해졌다. 화면은 Hello Racer 캡쳐화면

느낌이 어떠신가?
만약 컴퓨터 성능과 그래픽카드가 어느정도 성능 이상만 받쳐준다면 왠만한 3D 게임에서 느꼈던 느낌을 받으실 수 있을 것이다.

자바스크립트로 프로그래밍이 가능한 WebGL로 IE를 제외한 최신의 브라우저에서 이 정도 퀄리티의 3D 그래픽 표현이 가능해졌다.

택스트와 이미지로 이루어 졌던 단순한 HTML을 넘어서 현재는 플래시 영역까지 야금야금 빼았고 있는 HTML5의 시대가 왔고 앞으로 머지않아 HTML5와 CSS3 여기에 WebGL이 지배하는 세상이 올 것이다.

이미 WebGL을 이용한 3D 게임도 계속 만들어 지고 있는 중이고 멀지않아 컴퓨터 성능, 브라우저 성능 이외의 몇몇가지 요소들만 갖추어진다면 지금의 여러 게임 분야 및 그래픽 분야 등의 소프트웨어 등에 충분히 활용될 환경으로 변모할 것이다.

아우~ 이 무서운 세상의 발전속도!
아래의 링크들은 이러한 WebGL을 이용한 데모 및 서비스이다.

로딩 후 마우스클릭 및 위치에 반응하는 것들이니 한번 쯤 움직여 보시길~

3D 해파리가 두둥실~ :

데모 바로가기 : http://chrysaora.com/

리드미컬한 해파리의 움직임!
리드미컬한 해파리의 움직임!

Sintel Goes Boom

데모 바로가기 : http://alteredqualia.com/three/examples/webgl_materials_video.html

3D 큐빅이 모였다 흩어지고 또한 그것들 위에 동영상이 재생된다
3D 큐빅이 모였다 흩어지고 또한 그것들 위에 동영상이 재생된다

구글 Body

데모 바로가기 URL : http://bodybrowser.googlelabs.com/

구글 바디 사람의 골격, 뼈대, 신경, 내장기관, 근육 등의 여러 세부요소를 3D로 확대, 축소 하면서 살펴볼 수 있다.
구글 바디 사람의 골격, 뼈대, 신경, 내장기관, 근육 등의 여러 세부요소를 3D로 확대, 축소 하면서 살펴볼 수 있다.

Planetarium

데모사이트 URL : https://mozillademos.org/demos/planetarium/demo.html

HTML5 와 WebGL을 활용해 태양계의 천체를 멋진 효과와 함께 설명해준다
HTML5 와 WebGL을 활용해 태양계의 천체를 멋진 효과와 함께 설명해준다

이 외에도 더 많은 WebGL 데모를 살펴보시고 싶으신 분들은
구글 쪽 WebGL 예제 모음 :  http://www.chromeexperiments.com/webgl
파이어폭스 모질라 WebGL 예제 모음 :  https://demos.mozilla.org/ko/
에서 확인할 수 있다~

웹GL 강좌를 함 보고 싶은 분은 여기 : http://learningwebgl.com/blog/?p=11

이 글의 관련글

Tags:

Leave a Reply

Your email address will not be published. Required fields are marked *