HTML5, "웹개발자의 적, MS가 변했다"

SK컴즈 UI개발팀 함경우 과장·윤원진 대리, 한국MS DPE 황리건 차장 공동 인터뷰

최신 웹기술 역량을 평가하는 국제 개발자 대회에 한국인 수상자들이 뛰어난 출품작으로 수상자 명단에 올랐다. 인터넷업체 SK커뮤니케이션즈 소속 개발자 2명이 팀을 이뤄 지난해 열린 웹애플리케이션(이하 '웹앱') 개발자 대회 '텐케이어파트(10K apart, 이하 '10K')'에 출전한 결과, 기술부문 우수상(Best Technical Achievement)을 받으며 이름을 알렸다.

이는 웹표준 기술과 최신 브라우저 확산이 더딘 국내 환경에서 이례적인 성과로 비친다. 여전히 우리나라 공공부문과 일반 기업 환경에 '액티브X'같은 퇴출 대상 기술 기반 서비스가 당연시되고 인터넷 익스플로러(IE) 6 버전같은 구형 브라우저가 널리 쓰이는 상황과 대조적인 모습이기 때문이다.

대회 배경도 흥미롭다. 10K를 후원한 기업이 바로 액티브X와 IE를 만든 마이크로소프트(MS)고, 대회와 함께 진행된 행사 믹스(MIX) 컨퍼런스의 기원은 비표준 플러그인 기술인 '실버라이트'를 주제로 해왔다.

개발자들이 웹표준 기반으로 서비스를 개발, 도입하기 열악한 국내 환경에서 어떻게 이같은 실력을 발휘할 수 있었는지, 비표준 독점 기술 전략의 대명사 MS가 어째서 최신 웹기술 흐름을 지원하기에 앞장서는지 선뜻 이해되지 않는 대목이다.

기자는 이달초 한국MS를 방문, 회사 관계자들과 대회 수상팀을 만나 인터뷰를 진행했다. 수상자인 SK컴즈 사용자인터페이스(UI) 개발팀 소속 함경우 과장, 윤원진 대리의 참가 동기와 사내 동료들의 도움을 통해 출품작을 개선시킨 과정과 수상 후 소감을 들을 수 있었다. 함께 자리한 한국MS 개발자플랫폼사업부(DPE) 에반젤리스트 황리건 차장은 대회 연혁과 진행 취지를 밝히며 MS가 웹기술과 HTML5 표준에 내건 기대와 전략의 일환으로 대회를 지원해온 목적을 설명했다.

■과거 IE는 웹개발자 적이었는데…

팀으로 출전한 함경우 과장, 윤원진 대리는 '스페이스마종'이라는 웹게임을 만들어 출품했다. 이 게임은 짧은 시간 안에 무늬가 같은 마작패를 짝지어 없애면서 기록을 세워나가는 것으로 경쟁할 수 있게 만들어졌다. 함경우 과장이 자바스크립트를, 윤원진 대리가 HTML과 CSS로 UI작업을 맡았다. 웹앱도 일반적인 그래픽UI 환경에서 돌리는 소프트웨어처럼 시각요소를 구성하는 레이아웃 디자인과 로직을 구성하는 프로그래밍 영역이 구별되기 때문이다. 이처럼 두 사람은 각자 전문성을 갖춘 영역을 맡아 필요한 결과물을 내놓기 위해 협력한 셈이다.

함경우 과장은 딴지그룹에서 딴지일보, 딴지방송국, 딴지점빵을 개발한 이력과 전 바른손게임즈에서 일하며 세컨드라이프 API 응용서비스 만들기에 참가한 이력이 있다. 윤 대리는 스마트TV용 UI 개발 경험이 있으며 앞서 글로벌 WAC 플랫폼사업자로 뽑힌 오비고에서도 일했다. 회사 밖에선 웹표준화단체 월드와이드웹컨소시엄(W3C)에서 HTML5 대한민국관심그룹(KIG)의 마크업 서브그룹장을 맡고 있다. 다음은 이들과 한국MS 황리건 차장을 함께 만나 주고받은 1문1답이다.

-대회 참가 계기는

윤: 실은 지난 2010년 첫대회에도 진작 출전하고 싶었어요. 당시 실력이 모자라다 생각했고 주변 여건도 따라주지 않았죠. 올해 두번째 대회 소식을 트위터로 접했고 관심있는 주제까지 설정돼 있어서 도전해보기로 했어요. 제가 갖고 있는 지식을 잘 활용해 보면 가능성이 있겠다 싶었어요. 함 과장님이 자바스크립트 부분을 담당해 주시면 잘 될 것 같아 팀을 짜서 나가보자고 제안했죠.

함 : 최근 화두인 HTML5 관련 기술을 현업 환경에서 연구하고 적용할 기회가 충분하지 않은데요. 이렇게 실무에 적용을 못 해서 '감질났던' 기술과 아이디어를 활용해볼 기회가 됐죠. 사람들에게 널리 퍼진 아이디어지만 실무에 적용하기는 어려운 기술들을 실제 구현해 보자는 성향이 강했어요. 유관기업이나 주관기관이 관련된 기술을 사람들에게 홍보하고 생태계를 키우려는 일반적인 개발자 대회와 성격이 좀 달랐죠.

황: 2010년 첫회 때는 특별한 주제 없이 29일간 10KB짜리 웹앱을 만드는 과제가 제시됐어요. 50개이상 참가국에서 367개 앱을 등록했어요. 지난해 두번째 대회는 40일로 늘어난 진행기간 동안 50개 참가국에서 등록된 앱이 128개에 그칠 정도로 규모가 줄었어요. 1년만에 다시 열리면서 초점을 맞춘 영역이 '반응형 웹'이란 쉽지 않은 주제였거든요.

웹을 다루는 사용자 환경이 단말기 특성이나 모니터 화면 크기 측면에서 제각각이잖아요. 웹 콘텐츠를 거기 맞춰 반응시켜 서비스한다는 게 기본 개념이에요. 이전부터 여러 방법론이 있었는데 최근 '미디어쿼리' 같은 CSS3 기술을 쓰면서 더 잘 구현할 수 있게 됐죠. 웹페이지를 구성하는 HTML와 CSS 파일을 하나만 구성하면서도요. 원래 현업에서 모바일 환경을 다양화하면서 거기 맞춘 HTML, CSS를 여러벌 만드는 게 일반적이었죠.

-대회 연혁은?

황: 첫회는 2010년에 열렸어요. 10년전인 2000년에 스튜어트 버터필드란 사람이 열었던 웹앱 개발자 대회 '파이브케이 컨테스트(5K Contest)'를 모티브로요. 파이브케이는 이름에서 알 수 있듯 5KB를 넘지 않는 코드와 이미지만으로 웹앱을 만드는 게 조건이었죠.

원래 '언이벤트어파트(An Event Apart)'라는 이름의 해외 조직이 동명의 웹개발자 컨퍼런스를 열어왔는데, MS가 진행하는 웹기술행사 '믹스(MIX)'와 파트너십을 맺으면서 2010년부터 공동개최하게 됐죠. MS 소속이 아닌 외부 개발자들만 참가할 수 있어요. 그 이전에 MS가 열던 웹기술행사 MIX 컨퍼런스와 열던 '텐케이(10K)'라는 대회가 있었는데, 실버라이트 기술 컨테스트였죠.

윤&함: 웹개발자들 입장에서 MS가 많이 달라보여요. 이런 류의 웹개발자 대상으로 하는 대회를 후원하는 모습만 봐도요. 출품작 이전에 데모용 소스코드도 마음대로 제공해 주고 있어서 환영하는 부분이에요. '쿨'해졌다고 할까요? 국내 브라우저 점유율 크게 차지하는 IE는 웹개발자들에게 '적'이었는데… 요즘은 MS를 보고 어떤 표정을 지어야 될지 모를 정도예요. HTML5 지원에 적극적으로 바뀐 것 같아요.

황: MS는 개발자들이 차세대 웹표준 기술에 대응할 수 있도록 노력중이에요. HTML5 무료 교육과 개발자네트워크(MSDN)를 통한 기술자료 제공, 기업체 세미나, 웹표준 지원센터 운영 등 다양한 활동을 하고 있죠. 국내 기업체들과 일반 사용자들을 대상으로 IE6 업그레이드 캠페인을 진행하는 등 국내 웹 환경 개선을 위해서도 노력중이고요.

■최신 웹기술 장려 취지…현업 적용하기까지 더딘 걸음

황: 웹이란 게 원래 용량과 성능간 도전과제를 계속 마주해야 하는 환경이에요. 제약된 환경에서 더 많은 창조성을 발휘할 수 있도록 유도하려는 취지죠. 기술적 측면에서는, 가능한 여러 조건에서 사용자 경험을 최적화한 결과물을 만들어 보이도록 한 거죠. 개발자가 자신의 앱이 돌아갈 서버 성능, 대역폭, 사용자 환경 등을 포괄적으로 고려하면서요.

윤: 새롭게 뭔가를 공부했다기보단 평소 공부하는 부분과 맞닿는 영역들, UI 기술을 시험해 보는 장이었어요. 이론으로만 알아왔던 기술을 활용하면서 시행착오를 할 수 있는 기회가 됐죠.

함: 주로 최근 이론화된 웹기술을 활용해 보는 작업이 많았습니다. 다양한 디자인을 직접 설계하고, 프로토타입을 만들고, 문제를 발견해 개선하는 작업을 거듭하면서요.

-어떤 상을 받았고 혜택이 뭐였나

함: 우선 모든 분야에 뛰어난 평가를 받은 1개 출품작이 '그랜드프라이즈'라는 상을 받아요. 우리나라 대회로 치면 '대상'쯤 될까요? 그 바로 아래 부문별로 우수함을 인정받은 출품작들을 뽑는데, 기술적으로 높은 평점을 받은 작품에 주는 '베스트테크니컬' 상이 그 중 하나예요. 디자인이 뛰어난 출품작에 '베스트디자인' 상을 주고 사람들에게 인기를 많이 얻으면 '피플스초이스' 상을 주는 것 같아요. 이 3가지는 '부문별 최우수상'쯤 되겠죠.

윤: 여기까진 부상을 주더라고요. 저희팀이 베스트테크니컬 등급과 함께 부상으로 상금 1천달러, 책 몇 권, 언이벤트어파트가 주최하는 세미나에 1회 참가할 수 있는 개인용 티켓, 이렇게 받았어요. 아쉬운 점이 팀 출전이더라도 이런 상이 개인용 기준으로 나와버려서 분배하기 애매했다는 거예요. 다음 회차엔 단체출전도 배려를 좀 해줬으면 좋겠어요. 부상 없이 출품작 이름만 언급한 게 12갠가 있었어요. '우수상' 성격인 것 같아요.

-대회에 적용한 기술을 실무에 적용할 기회가 전혀 없었나

윤: 여러 단말기 환경에 더 개선된 경험을 제공하는 '반응형 웹(responsive web)' 디자인은 아직 활용되기 어려워요. 이를 효율적으로 구현할 수 있는 기술이 주로 HTML5을 지원하는 최신 브라우저에서만 돌아가요. 하지만 시장에선 기업이 다수 사용자를 지원하는 서비스를 만들어야 하기 때문에, 과거 기술과 신기술을 함께 구현할 수밖에 없는데 이는 경제적 관점에서 선택되기 어려운 개발 시나리오죠.

함: 전체 서비스에 도입한 사례는 전혀 없고요. 일부분 적용된 요소는 있어요. 다음 메일서비스 같은 사례를 보면 HTML5 지원 클라이언트를 감지해서 더 쾌적한 메일서비스를 제공하게 돼있죠. 기업 운영을 지휘하는 수준에서보단 현장 개발자들이 노력을 많이 한 경우 같아요. SK컴즈의 네이트도 실험적인 노력을 많이 진행하고 있죠. 회사에서 지원하는 국내 출시된 거의 모든 단말기를 테스트하기도 하고요. 이번에 대회 출품 단계에도 이 장비로 테스트에 도움이 많이 됐어요.

-이번 대회와 관련해 향후 계획이 있다면

윤: 이번 대회 주제가 딱 마음에 들어서, 같은 주제라면 또 출전하고 싶어요. 이보다 더 좋은 주제가 있을지 잘 모르겠어요. 국내도 대회 홍보가 좀 잘 됐으면 좋았을거란 아쉬움도 있었어요.

함: 이번 대회 출품작을 각 단말기에서 네이티브로 돌아가는 앱으로 만들어 앱스토어에 등록시킬까도 생각중이에요. 대회때문에 용량 제약으로 포기했던 부분들을 보완해서 다듬어보려고요. 시각효과를 넣었다가 실제 단말기 구현할 때 테스트하면서 빼버리고 진행한 게 많아요.