친구와 크롬에서 ‘퐁’게임 한판…구글 ‘큐브슬램’

구글의 웹브라우저 크롬은 때때로 즐거운 오락기가 되곤 한다. 웹게임을 말하려는 건 아니다. 친구들의 스마트폰과 내 데스크톱을 연결해 올림픽 게임을 즐길 수 있는 ‘슈퍼싱크 스포츠’도 있고, 몇 대의 스마트폰을 하나로 연결해 친구들과 자동차 경주를 벌일 수 있는 ‘레이서’도 있다. 여기에 친구의 얼굴을 보면서 게임을 즐길 수 있다면 더 즐겁지 않을까. 게임에서 진 친구의 일그러진 표정을 실시간으로 볼 수 있을 테니 말이다.

‘큐브슬램’은 6월13일 구글의 크롬 실험실에서 출시한 크롬 웹브라우저 전용 게임이다. 1970년대 초반 아타리에서 출시한 1세대 비디오게임 ‘퐁(Pong)’을 본떴다. 게임의 목적은 간단하다. 화면에 움직이는 공을 막대로 쳐내면 된다. 내가 쳐낸 공을 상대방이 막지 못하면 1점을 얻는다.

이미 40여년 전에 출시된 게임에서 아이디어를 빌려 온 ‘큐브슬램’을 특별하게 만들어 주는 것은 게임에 쓰인 기술이다. HTML5 웹 개발 기술의 핵심 요소가 ‘큐브슬램’안에 빼곡히 들어차 있다.

우선 웹소켓 기술이 눈에 띈다. 웹소켓 기술은 복잡한 별도의 프로그래밍 과정 없이 웹브라우저에서 실시간으로 양방향 통신을 할 수 있도록 하는 기술이다. 서버와 클라이언트가 통신하는 방법의 하나인 TCP 연결을 웹브라우저에서 할 수 있도록 돕는다.

‘큐브슬램’의 3D 그래픽을 웹브라우저에서 구현할 수 있도록 하는 기술은 웹GL과 CSS 3D다. 단순한 3D 그래픽에 지나지 않지만, ‘큐브슬램’은 웹GL과 CSS 3D의 도움으로 실시간으로 3D 그래픽을 웹브라우저 속에서 바로 렌더링할 수 있게 설계됐다.

‘큐브슬램’에서 음악을 재생해주는 기술에도 웹 오디오 기술이 쓰였다. 사용자가 게임 모드를 선택할 때나 게임 속에서 특별한 아이템을 쓸 때, 혹은 배경이 바뀌거나 게임이 시작하고 끝날 때도 동적으로 음악이 재생된다.

여기에 함께 게임을 즐기는 친구의 얼굴을 실시간으로 보여주기 위해 웹RTC 기술이 추가됐다. 웹RTC는 웹브라우저에서 별도의 플러그인을 설치하지 않아도 영상과 음성을 주고받을 수 있도록 해주는 기술이다. 일반적으로 웹브라우저에서 비디오 컨퍼런스를 구현하는 데 쓰인다. 구글의 화상채팅 서비스 ‘행아웃’도 웹RTC 기술로 만들어졌다.

구글의 클라우드 플랫폼도 ‘큐브슬램’의 기술적인 기반이다. 게임을 이루는 모든 구성 요소가 구글의 클라우드 플랫폼 위에 얹혀 있다. 웹브라우저로 즐기는 클라우드 웹게임인 셈이다. 웹개발에 관심 있는 개발자라면 ‘큐브슬램’의 소스코드를 통해 어떤 기술이 어떻게 다뤄졌는지 보면 도움이 된다. 구글은 ‘큐브슬램’의 소스코드를 오픈소스로 공개했다.

사실 ‘큐브슬램’에 쓰인 웹개발 기술이야 몰라도 된다. 직접 즐겨보는 것이 더 좋다. 친구를 설득해 컴퓨터 앞에 앉히자. 친구와 둘이 ‘퐁’ 대결을 펼치려면 크롬 브라우저가 필수다. 파이어폭스나 오페라, 인터넷 익스플로러, 스마트폰용 크롬 웹브라우저로 접속 하면, 혼자 게임을 즐길 수 있다. 혼자 할 때는 친구 대신 곰 캐릭터와 대결을 펼친다.

화면에서 ‘친구와 게임하기’ 단추를 누르면, 친구에게 알려줘야 할 웹주소를 확인할 수 있다. 친구가 크롬 웹브라우저에서 이 웹주소로 접속하면 ‘큐브슬램’을 함께 즐기기 위한 첫 번째 과정은 끝난다. 다음은 웹캠을 쓸 수 있도록 ‘허용’ 단추를 누르면 된다. 내 컴퓨터에는 친구의 얼굴이, 친구의 컴퓨터에는 내 얼굴이 나타난다. 이제 공을 상대방의 막대를 피해 쏘아 보내기만 하면 된다. 한 판에 획득해야 하는 점수는 3점이니 재빨리 한판 즐기기 좋다.