모든 소프트웨어에 붙여진 이름은 나름의 의미와 가치를 내포하고 있다.
훌륭한 프로그래머는 변수이름 하나도 쉽게 정하지 않는다고 하는데 완제품이야 더 말할 것도 없다

아침에, 웹 브라우저 `3라운드` 기사를 보면서 역시 독점보다는 경쟁이 발전을 부추긴다는 생각을 확인하게 된다. 기사와 관련은 없지만 문득 각 브라우저들의 로고의 의미가 궁금해 졌다. 더불어 그 이름의 유래도...

현재 5대 웹 브라우저는 다음과 같다
- 마이크로소프트, 인터넷익스플로어
- 모질라, 파이어폭스
- 애플, 사파리
- 구글, 크롬
- 오페라, 오페라브라우저




우선 마이크로소프트 인터넷익스플로어의 경우 그 이름과 로고의 의미가 단순,직관적이다
전자통신, 인터넷을 뜻하는 접두어 'e' 를 행성띠와 같이 둘러싼 모습이다
이름 역시 터넷탐색기,탐험가 정도의 무난한 해석이다. 이름과 로고의 의미를 해석하고 자시고 할게 없다
직관적이나 개성은 전혀 없다고 하겠다

다음으로 직관적인 것은 오페라이다
오페라소프트웨어는 브라우저만 만드는 특이한(?) 회사다. 간혹 이 회사는 뭘로 그렇게 잘 먹고 살까? 하는 생각도 해봤다. 모바일 장치에 점유율이 꽤 높은건 알겠지만, 그래도 굉장히 독특한 회사로 보인다
오페라 브라우저는 제품명과 제품 로고를 회사의 그것과 그대로 일치시킨 예이다.
다음의 블로그에서 오페라라는 회사의 면면을 엿볼 수 잇다 => 웹브라우저 ‘오페라’를 아시나요?

그 다음으로는 애플의 사파리를 보자.
사파리 하면 언뜻 야생동물 탐험 여행이 떠오른다. 사파리라는 어원 역시 '여행' 이라는 뜻이다
수렵과 탐험을 위한 원정 여행이라는 뜻의 '사파리'는 인터넷의 이곳 저곳을 탐험하고 여행하는 의미로 해석될 수 있겠다. 로고 역시 탐험에 어울릴법한 나침반 모양을 하고 있다

다음으로 구글의 크롬이다
크롬(chrome) 을 사전에서 찾아보면, 크롬이라는 금속으로 나온다. 웹 브라우저로써의 크롬과 연결고리를 찾기기 쉽지 않다. 해서 찾아보니 다음의 블로그에서 그 유래를 알 수 있었다
=> [구글 크롬] 이름과 로고의 탄생 배경~!!!!

브라우저를 디자인할 때 사용된 개발자간의 공용 명칭이 제품명으로 자연스레 녹아든 사례라 하겠다
또한 위 블로그를 보면 크롬 로고에 대한 몇 가지 해석이 있다. 그 중 매우 설득력(?) 있고 재미있는 유래에 대한 그림은 아래와 같다 ㅎㅎ. 마이크로소프트의 윈도우가 탐탁치 않아 다시 조물딱거려서 만든 것?



마지막으로 모질라의 파이어폭스를 보자. 이름과 로고가 가장 private한 의미를 지녔다 할 수 있다

평상시 잘 몰랐지만 오늘 자세히 들여다 보니, 지구에 붉은 여우가 둘러 앉아 있는 모습이구나.
파이어폭스? 단어 해석 그대로 하면 '불타는 여우'? 이다. 또는 '불여우' 이다
왜 여우라는 동물을 제품명과 로고에 사용된 것일까? 아래 블로그에서 그 유래를 알 수 있다.
=> 'Firefox'는 왜 '불여우'인가?

Thunderbird(천둥새) -> Phoenix(불사조) -> Firebird(꾀꼬리, 하지만 불사조와 유사한 의미로 사용) -> Firefox 로 이어진 이름의 변천사를 엿볼수 있다
  1. dddw

    에휴...전형적인 맥빠가 쓴 글이네...노답...디자인의 기본 개념부터...좀...

submit
게임사이트에서 웹 런처는 거의 필수에 가깝다.
이것은 인식의 문제가 아니라, 게임과 웹의 시너지를 통해 게임 이용 전반의 생태계 조성에 필요하기 때문이다.

표준과 멀티 브라우저 시대가 열렸지만, 국내는 여전히 IE 가 절대강자로 군림하고 있다.
이 말은 적어도 아직까지는 국내 대상 게임서비스에서 웹 런처를 위한 ActiveX 사용을 할만(?) 하다는 것이다
(그래서 필요악이다)

문제는 해외 서비스에 있다. 해외는 갈수록 IE 점유율이 떨이지고 있다.
해외 게임사이트에 웹 런처를 고려 한다면 브라우저 호환성은 보다 심각한 문제가 된다.

이와 관련하여 넥슨의 사례를 보고자 한다.
넥슨 사이트 역시 웹 런처를 제공한다. 하지만 ActiveX 설치는 존재하지 않고 심지어 4대 브라우저를 모두 지원한다. (IE, 파이어폭스, 사파리, 오페라)

신기하던 차에 살짝 살펴보니, 웹 런처를 브라우저별 플로그인 기술로 구현된 듯 하다
그리고 플래시를 통해 설치된 플러그인 파일을 실행시키는 구조이다

즉 IE는 여전히 내부적으로는 ActiveX를 이용하고 있는 것이다. 
그러나 명시적으로 ActiveX 설치는 없는 방법으로.....

설치 및 구동방식을 대략 살펴 보면,
1) 먼저 Setup.exe 파일을 수동으로 다운로드해서 설치해야 한다. 여기서 뭔가 감이 잡힐 것이다.
   브라우저에서 ActiveX 를 바로 설치하는 것이 아니라 수동 설치 과정이 필요한 것이다.
   이 수동설치를 통해 내부적으로 ActiveX가 설치되는 것이다



2) 이후 플래시로 만든 웹 런처 버턴을 클릭하면 수동으로 설치된 ActiveX가 실행되는 것이다
 알아본 바로는 플래시의 fscommand 기능을 통해 브라우저 플러그인 실행파일을 구동시킬 수 있다고 한다.   



재미있는 구조다. IE에 설치된 ActiveX는 브라우저의 추가기능관리에서 확인할 수 있다
그리고 이 파일의 위치는 아래와 같다
'C:\Documents and Settings\All Users\Application Data\Nexon\NGM'
아마도 플래시에서 접근하기 위한 영역이 필요하지 않았나 싶다



다른 브라우저를 보면 브라우저 확장기능인 플로그인으로 등록된 것을 확인할 수 있다
아래 그림은 파이어폭스에 설치된 플러그인 화면이다


그리고 아래는 구글 크롬에 설치된 모습니다



브라우저별 플러그인 기술을 각각 개발해야 하는 것인지 ActiveX 를 수동으로 설치하는 과정으로 모든 브라우저에서 가능한지 실제 구현 및 운영상 치명적인 단점은 없는 지 등 등 구체적인 내용은 아직 파악되지 않았으나 두 가지 중요한 힌트를 얻을 수 있는 좋은 기회였다

1) 웹 런처의 브라우저 호환성을 확보할 수 있다 
   호환성을 위한 최적의 방법론은 아닐 수 있으나 하나의 주요한 대안이 될 수 있다

2) 구현 측면에서 플래시를 이용하면 ActiveX 로 제작된 실행파일을 구동시킬 수 있다

이 방법이 좋고 나쁨이나 맞고 틀림, 혹은 꽁수이냐 등을 떠나서,
해외 서비스를 위한 웹런처 구현에 한쪽 눈을 트이게 한 좋은 소식이다

이 서비스에 대한 더 자세한 구현 방법론을 아는 분이 있다면 과감하게 댓글로 알려 주기 바란다~
  1. 질문

    글잘읽어보고 질문이있는데 가끔씩 Activate X를 파이어폭스나 구글크롬등 으로깔때 수동으로깔아도 안깔아지는경우가있습니다 .정확히말해 깔아진후 완료를누른다음 시작을 누르면 (게임시작 예를들면) 다시 설치하라는 창이뜹니다. 이럴땐 어떻게해야하나요?

submit

필요악? ActiveX

Posted in 모바일/모바일 플랫폼 // Posted at 2010. 11. 25. 13:51
마이크로소프트의 ActiveX 는 언젠가부터, 그리고 요즘은 더욱더 비판받는 존재이다.

비판의 시작은 ActiveX의 보안 취약점 때문이었다. 다시 말해 ActiveX의 너무 과도한 권한이 문제였다.
순진한 사용자들은 ActiveX가 뭔지도 몰랐다. 그냥 설치하라니깐, '해야 되나 보다' 했다
그리고 이렇게 설치된 ActiveX를 통해 사용자 PC에서 못된 짓(?)을 하는 사례가 늘어났다

그 다음은 호환성 문제
요즘과 같이 멀티 디바이스, 표준을 외쳐대는 시류에 IE 에서만 가능한 ActiveX는 완전 찬밥 신세다
찬밥을 넘어 굉장한 비판 대상이 되고 있다. 불쌍하게도 ActiveX는 자신을 개발 해 준MS에게게도 버림받을 상황이다

간혹 이 두 개념이 혼재되어 혼란을 야기시킨다.
ActiveX를 왜 반대하는가? 보안 취약점 때문인가 아니면 호환성 때문인가?
아마 둘다라고 하는 사람이 많을 듯 하다. 근데 간혹 이 두 개념이 혼재되어 원인과 결과가 이상하게 흐르기도 한다.

예로, ActiveX의 대안 중 하나라고 하는 Signed Applet 은 어떤가? ActiveX의 대안으로 심심찮게 언급되고 있다. 근데, 이 역시 웹의 특징을 넘어서는 권한을 가지려 한다. Signed Applet과 같은 대안 기술이 호흥을 얻는 이유는 바로 호환성이다. IE 뿐만 아니라 다른 브라우저에서도 자바 애플릿이 구동되기 때문에 대안기술로 등장한 것이다. 즉 여기서 대안이라는 측면은 보안성과는 무관하게 호환성에 초점이 맞춰진 것이다.


일단 보안 부분은 이렇다. 핵심은 웹의 샌드박스 보안 모델로 인한 제한적인 권한이다. 일반 웹 기술로는 로컬 PC 자원에 액세스 할 수 없다. 게임런처와 같은 ActiveX는 로컬 PC의 자원에 접근해야 하는데 방법이 없다. 그래서 얼씨구나 ActiveX 했다. 즉 핵심은 ActiveX가 아니라 로컬자원에 대한 권한이다. ActiveX와 Signed Applet 모두 웹의 샌드박스 이상의 권한을 부여받을 수 있기 때문에 사용하는 것이다.
그리고 절대 다수 IE 사용자들의 환경에서 ActiveX는 자연스러운 선택이었던 것이다.

이제 시대가 많이 변해서 호환성이 큰 이슈가 되고 있다.
웹 표준의 중요한 원칙도 호환성을 위한 표준 정립이다. 이런 환경에서 ActiveX는 정말 골치거리가 아닐 수 없다. 재미있는 것은 플래시나 애플릿 역시 어느정도 호환성은 보장되지만 그 역시나 웹 표준은 아니다.
즉, IE 만 가능한 ActiveX와 다른 브라우저에서 가능한 애플릿,플래시의 차이일 뿐이다.

결과적으로 간혹 ActiveX 는 애매한 해석으로 공격 당하고 있는 느낌이 든다.
(나 역시 반 ActiveX 주의자다. 말하고자 하는 것은 해석의 혼란에 있다)

그러나 개발자라면 이런 해매한 해석의 내면을 아는 사람이 꽤 많을 것이다.
문제는 트랜드를 외치는 사람들, 그리고 일반 사용자들의 애매한 해석을 꼬집고 싶다.


게임회사에 일하다 보니 웹런처로써의 ActiveX가 말그대로 필요악일때가 많다.
근래 새로운 게임 포털을 구상하는 단계에서도 이 문제는 여전히 대두되고 있다.

웹을 통한 게임 접근성의 향상과 웹의 활성화를 위해 웹 런처는 거의 필수에 가깝다.
웹런처이다!!! 즉 ActiveX가 필요한게 아니라 웹 런처가 필요한 것이다
그런데 이런 웹 런처가 가능하기 위해서는 웹의 보안 한계를 넘어서는 뭔가가 필요하다
그것이 바로 ActiveX이다(혹은 Signed Applet과 같은 것이다)

국내 사용자만을 생각한다면 더 말할 것도 없이 ActiveX 다. 외국에 비해 국내은 아직까지 IE 사용자들이 절대 다수이다. 그러나 해외를 염두한다면 상황은 달라진다. 간단하게 그냥 다운로드 시켜서 독립 exe로 하겠지만, 역시 문제는 웹의 활성화가 걸림돌이다. 여기서 호환성 대안 기술을 고려해 볼 수 있다

결국 게임으로의 접근성을 향상시키고 웹의 활성화를 위해 웹 런처가 필요악에 가깝다
그러나 사양기술인 ActiveX 를 고집하는 것도 왠지 꺼림직하다. 또한 표준화, 접근성, 호환성, 범용성이 중시되는 정신 문화에 좋은게 없는 것도 사실이다.

오늘 이런 글을 봤다.
ActiveX 와 게임회사의 공생관계.

글과 댓글을 매우 흥미롭게 읽었으며 느끼는 바가 있다.
현실과 이상의 문제라고 봐야 하나? 아니면 얻는게 있으면 잃는게 있다는 양면성의 문제인가?
그도저도 아니면 웹의 본래 철학을 넘어 서버린 ActiveX의 태생 자체가 문제였던가?
혹은 웹이 네이티브의 그것과 같이 동작하기를 바라는 비즈니스의 문제인가?


음.. 공생하고 공론해야죠. 상생인가? ㅎ


submit

IE 8, 웹 조각(Web Slices)

Posted in 모바일/모바일 플랫폼 // Posted at 2010. 11. 11. 16:41

인터넷이 조각으로 배달된다?
IE9가 주목받는 요즘 IE8에 추가 된 기능을 언급하려하니 좀 늦은감이 없지 않다
하지만 이전에 소식으로만 접했던 IE8의 웹 조각을 다시 음미(?)해 보니 꽤 쓸만한 도구로 보인다

IE8의 웹조각은 그 이름에서 유추할 수 있듯이 웹을 조각으로 관리할 수 있는 기능이다
다시말해, 웹 페이지 중 일부 영역을 따로 떼어 그 부분만을 구독할 수 있게 해 준다

뉴스나 증권정보, 날씨정보와 같이 주기적인 업데이트가 필요한 콘텐트에 적용하기에 알맞은데,
사용자 입장에서, 그 내용을 확인하기 위해 매번 해당 웹사이트로 이동하는 불편을 해소해 준다.
웹조각을 설명한 (별로 재미는 없는) 만화가 제공된다. 아래 그림을 클릭해서 크게 보기 바란다


(출처: Internet Explorer 8 만화 5편 “웹조각")


사용자 입장, 웹 조각 사용하기
웹 조각은 사용자 편의를 위해 제공되는 IE8의 새로운 기능이다.
마치 특정 기능을 구현해 독립적인 작은 프로그램 형태로 제공하는 위젯과 유사한 기능이다.
일종의 IE8 즐겨찾기 위젯이라고도 할 수 있겠다

방문한 웹 사이트에서 웹 조각을 제공하면, IE8 도구모음에 있는 웹조각 아이콘이 활성화된다. 또한 웹 페이지의 웹 조각영역에 마우스를 올리면 역시 웹조각 아이콘이 활성화 된다. 아래 그림은 PlayNC 의 예이다
 


이렇게 활성화 된 웹조각 아이콘을 클릭하면 웹조각을 즐겨찾기에 추가할 수 있다. 이후 업데이트 되는 정보는 사이트에 직접 방문하지 않고 즐겨찾기 모음에 추가된 웹조각을 통해서 받아볼 수 있게 된다



개발자 입장, 웹 조각 적용하기
웹 조각은 웹 사이트를 운영하는 측에서 제공해야 이용할 수 있는 기능이다
따라서 사이트를 개발할 때 웹 조각을 위한 (매우 간단한) 코드가 정의되어 있어야 한다
아래는 가장 간단한 형태의 웹 조각 정의이다

<div class="hslice" id="myWebSlice">
  <div class="entry-title" style="display:none">새소식 제목</div>
  <div class="entry-content">
    <a href="http://m.mkexdev.net">새소식 내용</a>
  </div>
</div>

태그의 class 특성을 정의하면 IE8 브라우저는 이를 웹 조각으로 해석하게 된다
hslice는 하나의 웹조각 영역을 뜻하며 entry-title 와 entry-content 는 웹조각에 표시될 제목과 내용을 뜻한다

여기서 지정한 제목이 즐겨찾기에 표시되는 타이틀 제목이 되며, 예에서 숨김 처리를 한 것은 굳이 본문에 제목이 표시되지 않아도 되기 때문이다(이것은 선택이다. 제목도 웹 조각 본문에 포함되기 원한다면 보이게 하면 된다)

그리고 웹 조각은 한 페이지에 여러 개 존재할 수 있다. 다만 ID를 반드시 다르게 해 주어야 한다.
IE8이 웹 조각을 인식하는 기준은 아래와 같은 URL이기 때문에 ID를 중복해서 지정할 수 없다 
따라서
웹조각 마다 각기 다른 ID를 부여해야 하며 ID만 다르다면 여러개의 웹 조각을 정의할 수 있다
http://domain/slice.html#myWebSlice

참고로 제목은 중복될 수 있지만, 즐겨찾기 항목에 동일 제목이 나열되므로 중복되지 않게 하는 것이 좋다

더불어 웹 조각 적용시 기본 크기에 따른 최적의 콘텐트 구성, 웹 조각 링크 수동 제공, 웹 조각을 위한 인증처리 등 더 세밀한 프로그램 작업이 가능하다. 이 부분은 관련 자료를 찾아보기 바란다


웹 조각, 업데이트 알림
웹 조각의 가장 큰 장점 중에 하나는 업데이트 된 정보를 쉽게 취득할 수 있다는 것이다
IE8은 웹 조각 콘텐트를 일정한 주기로 확인하여 업데이트 여부를 시각적으로 알려 주는데 아래와 같이 그 주기를 설정할 수 있다(기본: 15분)
고급설정에서는 웹 조각에 대한 보다 섬세한 설정을 할 수 있으니 참고해 보기 바란다



업데이트를 인지하는 기준?
웹 조각이 업데이트를 인지하는 기준이 뭘까?
일반적으로 웹 브라우저가 서버의 파일 변경을 감지하기 위해서는 HTTP 헤더 정보를 참조한다
즉 HEAD 요청을 통해 해당 파일의 헤더에 있는 수정 날짜가 기준이 된다
브라우저가 웹 파일을 캐시하는 것도 이런 매커니즘이 적용된다

그러나 웹 조각은 파일이 아니라 파일 내 특정 영역에 대한 업데이트이다
개념적으로는 파일의 수정 날짜가 아니라 웹 조각 영역에 대한 변경이 감지되어야 하는데 간단하게 테스트를 해 보니 일관성이 없어 보인다. 파일 변경에 따른 업데이트는 명확히 알려 지는 반면 (파일 변경을 수반하지 않는) 웹 조각 영역내의 변경은 알림이 지연되는 느낌이다. 그러나 이것은 웹 조각의 정신(?)에 위배되지 않는가..

바빠서.. 더 이상의 테스트는 그만 두고, 다음에 알아 보기로 한다
이 테스트에 사용된 코드는 아래와 같이 매우 간단한 날짜 업데이트 코드이다
즉 파일은 더 이상 수정되지 않은채 내부적으로 내용만 업데이트 되도록 하였다

<div class="hslice" id="notice">
  <div class="entry-title" style="display:none">새소식 제목</div>
  <div class="entry-content">
    현재시간: <%=Now() %>   
  </div>   
</div>

급 추가>>>
이런, 이 글을 쓰고 저장하려고 하는 시점에, 웹 브라우저에서 업데이트 알림을 보내 왔다.
그리고 이후 쭈욱 지켜보니 나름대로 일관되게 알림을 보내준다. 이전 테스트는 내 마음이 급해서 인가 보다.

.. 위의 코드, 즉 웹 조각 영역에 있는 내용에 대한 업데이트도 제대로 알림이 되는 것을 확인 하였다
그렇지. 이렇게 되어야 웹 조각의 알림이라 할 수 있겠지... 괜찮은 웹 조각 ㅎㅎ


웹 조각의 범용성?
IE8에 도입된 웹 조각이 꽤 쓸만한 도구로 보이지만 가장 문제는 범용성이다
IE8 이상의 브라우저에서만 가능하기 때문에 요즘처럼 표준과 범용성이 중시되는 환경에서는 큰 단점이다

파이어폭스3 에서도 IE8의 웹 조각을 수용하기 위해,
웹청크(WebChunks, https://addons.mozilla.org/ko/firefox/addon/8494/)라는 것을 선보였다
IE8의 구현을 그대로 계승할 수 있어 두 브라우저의 범용성이 보장되는 셈이다.
그러나 현재 최신 버전의 파이어폭스(3.6.12)에서는 이 확장 기능이 설치 되지 않는다
 
그리고 맥의 사파리에도 이와 유사한 개념의 '웹클립' 이라는 위젯이 제공되는데
 개념적으로만 유사할 뿐 적용 방법과 기술이 달라 범용적으로 적용하기 힘든 구조이다

오페라의 경우 웹조각을 구현한다는 썰이 있는데 단지 루머수준에 머물러 있는 듯 하다
Rumor: Opera 10 to Include Web Slices

결국 웹 사이트의 사용성을 증대 시킨 '웹 조각'은 그 자체로는 유용한 면이 있지만,
실제 현업에서 적용하기에는 범용성이라는 걸림돌에 부딪히게 되는 것이다

만일 대상 고객이 IE에 한정되어 있거나 IE 사용자들에게만 부여되는 옵셔널한 기능이라면 적용할 만한 가치가 있겠다

ps. 글이 매우 급하게 작성되었다. 정신적으로 여러 현안이 겹쳐 있어 이 주제에 집중하기가 힘들다
내용에 오류가 있다면 즉시 지적 바란다

Tags 웹조각

submit
아이폰 플랫폼이 대단하기는 하다.
각종 거대 개발사에서 아이폰 플랫폼에 포팅하기 위한 여러 시도만 봐도 그러하다.
특히 버림 받은(?) 어도비의 애플 사랑이란... 측은하기 까지 하다 ㅎㅎ

다양한 스마트폰, 다양한 태블랫 PC, 다양한 스마트TV, 그외 다양한 가전 플랫폼이 속속 등장하고 있는 요즘과 미래 상황에 이기종 플랫폼의 부담은 날이 갈수록 증가한다

과연 하나의 소스로 다양한 플랫폼에 얹힐 수 있는 날이 올까?
기술의 통합, 표준은 자본주의 환경에서의 기업들의 이해관계를 따진다면 실현은 불가능해 보인다
음.. 그렇다고 정부가 나서나? 우리나라 위피 사례는 섣부른 정부 개입의 문제점을 보여줬다
또, 그렇다고 소프트웨어를 위한 전세계적인 범정부가 있을 수 있나...
그럼 별도의 표준화 기구 정도는 예상해 볼 수 있겠다. 그러나 말했듯이 다양한 이해관계.. 음. 될리 없지..

물론, 꼭 그렇게 될 필요가 있나? 라는 원초적 질문이라면 패스~~

여하튼 플랫폼 이식, 멀티플랫폼화에 대한 요구는 환경의 다양성,발전과 더불어 끊임없이 제기될 것이다


원소스 멀티플랫폼을 위한 기술적 현황

 

2010.10.21

 

현재의 소프트웨어 플랫폼은 그 어느 때보다 멀티 플랫폼에 대한 요구가 강하게 나타나고 있다

 

스마트폰의 열풍과 참신한 모바일기기의 보급, 성장세는 소프트웨어 생태계에 많은 순 기능적 변화를 주고 있다. 이러한 성장세는 거대 업체들의 비즈니스 기회로 활용되고 있으며 그 만큼 다양한 플랫폼이 출시되기에 이른다. 애플의 iOS, 구글의 안드로이드, 마이크로소프트의 윈도모바일7등을 대표적인 이기종 플랫폼 사례로 들 수 있으며 이와 더불어 기존 PC OS환경도 여전히 유효한 플랫폼으로 자리하고 있다.

 

이들 이기종 플랫폼은 각기 다른 개발 언어와 런타임 환경을 제공하고 있어 하나의 제품을 다른 플랫폼에 이식하기 매우 어려운 구조를 띄고 있다. 따라서 소프트웨어 개발사() 입장에서는 하나의 소스가 여러 플랫폼에 쉽게 이식될 수 있는 환경을 간절히 원하고 있으며 이는 시장의 기술적 흐름을 통해서도 명백히 알 수 있다

 

이 글에서는 원소스 멀티플랫폼화를 실현하기 위한 몇 가지 기술적 움직임을 살펴보기로 한다

 

(모바일 웹, 하이브리드 앱)

멀티 플랫폼 실현을 위한 가장 보편적이고 잘 알려진 환경이 바로 웹이다. 이기종 플랫폼이라도 브라우저에 의존하는 웹 어플리케이션은 표준만 준수한다면 동일하게 구동된다. 즉 하나의 소스로 여러 플랫폼에 구동 가능하므로 멀티 플랫폼의 대안으로써 많이 활용된다.

다음과 같은 기술들이 웹의 한계를 극복시켜 줌으로써 앱으로써의 웹을 실현 가능케 한다

HTML5

웹의 기능을 대폭 향상시키는 차세대 표준 스펙. 전용 앱 못지 않은 어플 개발 가능

 

PhoneGap(Bondi, Titanium)

흔히 웹앱으로 불리는 하이브리드 앱 개발을 위한 프레임워크
웹에서도 장치의 고유 기능(가속도 센서, 기울기 센서 사진, 연락처 등)에 접근 가능

 

WebGL

OpenGL 프로젝트 중 하나로 별도의 플러그인 없이 웹에서 3D처리가 가능케 함

 

SVG

XML기반 2차원 백터 그래픽 언어로 표준 웹 기술임

 


플래시] Applications for iPhone

애플의 아이폰, 아이패드등의 제품에서는 플래시가 구동되지 않는다.플래시 개발사인 어도비는 거대한 애플 앱스토어 시장에 진입하기 위해 플래시 어플리케이션을 iOS 전용 어플리케이션으로 포팅해 주는 툴을 개발하였다

플래시 CS5 버전에 포함된 이 기능은 액션스크립트3로 개발된 플래시코드를 iOS 전용코드로 변환하여 앱스토어에 전용 앱으로 배포할 수 있도록 지원한다

 

관련 내용: http://labs.adobe.com/technologies/packagerforiphone/

Pdf: http://www.adityabansod.net/wordpress/wp-content/uploads/2009/11/iPhoneAppsCS5.pdf

사례: Chroma Circuit, Trading Stuff, Fickleblox, Just Letters, Red Hood, South Park

 


일러스트레이터] HTML5 Pack

대표적인 그래픽 저작 툴이 일러스트레이터는 CS5 버전에서 그래픽 결과물을 HTML5, CSS3, SVG등 웹 표준으로 포팅하는 기능을 포함 시켰다. HTML5 등의 표준 기술로 포팅된 결과물은 이기종 플랫폼에 구애 받지 않고 웹으로 구동시킬 수 있다. 이것 역시 원소스 멀티플랫폼을 위한 움직임이라 하겠다


관련 기사
: http://www.macworld.com/article/154033/illustratorcs5_html5.html

 


Java] AlcheMo for iPhone

애플의 아이폰, 아이패드등의 제품에서는 자바프로그램 역시 구동되지 않는다

AlcheMo for iPhone J2ME기반에서 개발된 자바코드를 아이폰에서 해석 가능한 C++ 코드로 포팅해 준다. 이 툴은 모바일 게임 개발툴을 제공하는 Innaworks Development Limited사에서 개발했다

관련내용: http://tech.gaeatimes.com/index.php/archive/how-to-install-compile-run-java-on-iphone/

 


Java] JVM for iPhone

자바를 개발한 SUN 사에서는 애플의 제품에 자사의 자바응용프로그램을 구동시키기 위해

J2ME에 기반한 아이폰용 JVM을 개발하겠다고 발표한적이 있다. 이것은 몇 년 전에 발표된 내용으로 애플의 코드를 해석하는 소프트웨어 불가방침에 그 행보가 확실치 않다. 다만 원소스 멀티플랫폼 위한 SUN사의 노력을 엿볼 수 있다


관련 기사
: http://www.infoworld.com/d/developer-world/sun-well-put-java-iphone-042

 

지금까지 소개한 사례들은 대체로 아이폰 포팅을 주제로 하고 있다.이는 현재 대세가 되는 플랫폼을 향한 업계의 반응이며 다른 플랫폼이 부각된다면 여전히 관련 포팅 기술이 출시될 것이다.

결국 이러한 움직임이 멀티플랫폼화를 위한 업계의 노력이라 할 수 있겠다.
또한 이런 노력과 시도들은 그만큼 시장의 요구가 있다는 반증이 될 것이다

 

submit
간혹 기술은 변하는데 시각이 변하지 않는 사례를 보곤 한다
지금은 웹을 통한 서비스를 기획하고 창출하는 시각의 변화가 필요한 시점이라 생각한다

현재 그리고 앞으로 다가 올 웹 기술 환경은 과거의 그것과 확연히 구분된다
더 이상 기존 웹 사이트 수준에 머무는 웹을 생각해서는 안된다
기술의 범위가 넓어진만큼 생각의 범위도 키워야 한다

그러기 위해서는 무엇보다 발전하는 웹 기술을 큰 맥락에서 이해해 둘 필요가 있겠다
지금까지 웹 사이트를 개발하고 기획하고 설계하는 범위를 넘어서서 바라보아야 할 것이다

우선, 차세대 웹 표준으로 자리매김 할 HTML5 는 웹을 더 이상 문서가 아닌 응용프로그램이 가능하도록 만들어 준다. 이것은 ASP, PHP 와 같은 서버 측 기술이 아니다

간혹 동적인 웹, 인터렉티브 한 웹 하면 제일 먼저 ASP와 같은 서버 측 기술을 떠올리곤 한다

그리고 멀티미디어 웹 하면 제일 먼저 플래시를 떠올린다

다 맞는 예기다. 하지만 여기에 추가해야 할 중요한 것이 있다.
HTML5, CSS3, SVG 와 같은 차세대 웹 표준 기술이 빠졌다

HTML5 는 단순한 HTML 을 업그레이드 버전으로 생각하면 큰 오산이다
여기에는 2D, 3D 그래픽 표현을 위한 Canvas 와 비디오,오디오 재생을 위한 video, audio 그리고 웹이 응용프로그램화 될 수 있는 멀티 쓰레드 처리(Web Worker), 소켓 통신(Web Socket), 강력한 로컬 저장소(Web SQL Database, Indexed Database), LBS 구현이 가능한 Geolocation 등이 포함되어 있다

이 들의 조합으로 매우 강력한 웹 응용프로그램을 개발할 수 있다

HTML5로 꽤 쓸만한 게임 개발도 가능하다

HTML5에 포함된 그래픽 처리, 멀티 미디어 처리, 백 그라운드 처리, 소켓 통신 등이 이를 가능하게 해 준다
이는 과거 HTML 에서는 상상도 할 수 없는 일이였다

HTML5Games 사이트에서는 HTML5 로 개발된 여러 게임들을 서비스 하고 있다
이 사이트이 게임들만 쭈욱 훓어 봐도 어느 정도 감을 잡을 수 있다

아래 사이트들도 확인해 보기 바란다
HTML5, JavaScript, DHTML 등 웹 기술로만 제작된 게임 데모를 실행해 볼 수 있다
http://www.benjoffe.com/code/demos/canvascape/

http://blog.nihilogic.dk/2008/05/javascript-super-mario-kart.html
http://www.javascriptgaming.com/
http://www.kesiev.com/akihabara/

또한 HTML5는 3D도 지원할 예정이다
WebGL을 이용한 3D 그래픽용 Canvas 스펙이 개발 중이다
Google Web Tookit 팀에서 개발한 퀘이크 동영상도 확인해 보자
=> https://www.youtube.com/watch?v=XhMN0wlITLk 

그리고 모바일 웹을 앱처럼 개발할 수도 있다
흔히 '웹앱' 혹은 '하이브리드 앱'이라고 표현하는데, PhoneGap, Bondi 와 같은 훌륭한 오픈 소스 플랫폼을 활용하면 순수 웹 기술로 스마트 폰에 내장된 네이티브 정보를 활용할 수 있다
=> 모바일 웹, 장치(Device)의 기능을 불러다 쓰다

다음의 웹 앱 마켓과 포털 사이트를 확인해 보기 바란다
=> 모바일 웹 마켓(오픈앱마켓,OPENAPPMKT)
=> http://www.dseffects.com/iphone.php

(위 URL 들 중 데모 실행을 위해서는 크롬, 사파리와 같은 HTML5 지원 브라우저를 이용해야 한다)

이제 이런 말은 조심스럽게 걷어 낼 수도 있겠다

'음.. 웹은 한계가 있어서 그런 서비스를 개발하기는 힘들어요..!@#$@#'

필자 역시 근래 다시 웹에 큰 관심을 두는 이유도 바로 이런 기술의 변화 때문이다
기술의 변화는 서비스를 변화 시킨다. 물론 서비스가 변화하려면 그 서비스를 창출하는 사람들의 의식이 먼저 변해야 한다. 웹을 통한 비즈니스를 하는 그 누구든, 새로운 기술을 큰 틀에서라도 이해하는 것이 매우 중요하다. 그래야 원하는 서비스, 추구하는 목적을 보다 정확히 실현할 수 있기 때문이다
특히 요즘과 같이 급성장하는 모바일 환경, 브라우저 환경에서는 더욱 그러하다 하겠다
.....

경험은 매우 값진 지식이다. 그러나 간혹 과거의 경험이 스스로를 한계 짓는 틀로 작용할 때가 있다.
특히 요즘과 같이 급변하는 세상에서는 경험의 틀에만 의존해서는 곤란하다.
값진 경험과 새로운 환경을 조합한 최적의 준비태세를 갖출 필요가 있겠다

참고로 HTML5를 개괄적으로 소개한 다음의 글을 읽어 보기 바란다
=>
HTML5 개요와 기술적 특징

그리고 다음의 글도 참고 바란다
=> http://m.mkexdev.net/65

submit

Code Syntax Highlighter 툴 소개

Posted in 모바일/모바일 플랫폼 // Posted at 2010. 9. 30. 12:31
개발자들은 블로그에 기술 글을 쓸 때 프로그램 코드를 사용하는 경우가 많다
코드를 보여주고 코드 설명을 할 때 주로 사용한다
간혹 코드의 길이가 길거나 복잡할 경우 코드와 설명을 연결하기가 쉽지 않다

지금 소개하는 툴은 프로그램 코드를 블로그와 같은 웹상에 표현할 때 보다 직관적으로 보이기 위해
예약어 색상 변경, 라인 넘버, 들여 쓰기, 코드 접기/펼치기 효과를 주는 HTML코드를 자동으로 생성해 준다. 예약어 색상을 지원하는 언어는 C#, SQL, HTML, VBScript, Java, PHP 등이 지원된다

툴 주소: http://www.stevetrefethen.com/highlighter/default.aspx

- 코드 입력


- 결과


결과로 나온 부분을 그대로 복사해서 사용하면 된다.
그리고 아랫부분에 결과에 대한 HTML코드가 공된다


submit

MobiOne, 아이폰 에뮬레이터

Posted in 모바일/모바일 플랫폼 // Posted at 2010. 8. 31. 15:31
모바일 웹을 개발할 때 실제 아이폰으로 테스트하기에는 여간 불편한게 아니다
아이폰이 있어야 함은 물론이고 3G라도 쓸 요량이면 요금도 신경 쓰인다

그래서 실제 아이폰을 대신할 에뮬레이터를 찾게 된다
지금까지 본 에뮬레이터 중 단연 으뜸은 Genuitec에서 개발한 MobiOne이다
http://www.genuitec.com/mobile/

윈도우에서 아이폰 개발환경을 지원하고 모바일 웹에 대한 뷰 테스트, HTML5, CSS3와 같은
최신 스펙의 웹 기술을 대부분 테스트 해 볼 수 있다




MobiOne 테스트 센터와 디자인 센터 실행 화면



  1. karazhan

    아직 맥을 소유하지 못해 아이폰 관련 프로젝트에 조금은 불편했는데 좋은 도구 소개해 주셔서 정말 감사합니다.
    아 그리고 이클립스JEE가 지금처럼 좋지않을 땐 위 회사의 플러그인을 구하려고 어둠길 뒤지던 생각이 나네요. 멋진 회사. 좋은 소식 반가웠습니다.

  2. 몬난아

    저도 모비원 사용하는데요 최근에 테스트 중에 알아낸것 입니다만!!
    정말 아이러니 하게도 IOS3,4 버전 모두 html5test.com에서 테스트 결과 185점 가량 나옵니다만 모비원은 85점이였나? 약 80점 대 정도 나오더라구요

  3. 아이폰매니아

    아....난...아이폰5인데.....

submit

이제 모바일 환경에서도,
네이티브(Native) 어플 뿐만 아니라 웹(Web) 어플을 위한 마켓이 형성되었다

지난 달(7월) 오픈 한 오픈앱마켓(http://www.openappmkt.com/)이다
애플의 앱스토어가 네이티브 앱을 위한 장터라면 오픈앱마켓은 웹 앱을 위한 장터이다
그것도 전세계 고객을 대상으로 말이다

오픈앱마켓은 기존 웹구현의 한계를 뛰어 넘을 수 있는 HTML5 기반 모바일 웹 서비스를 모아 소개한다

대부분의 앱마켓과 유사한 기능을 제공한다
웹 앱들을 카테고리화 시키고 인기도와 유/무료를 구분하며 앱 실행화면과 설명, 리뷰 등을 제공한다
일반 앱스토어처럼 개발자 등록과정이 있으며 수익분배 모델고 가지고 있다
애플 앱스토어가 7:3 인 것에 비해 오픈앱마켓은 8:2 분배를 원칙으로 한다
비자,마스터 카드등 해외결제가 가능한 신용카드가 있어야 유료앱 결제가 가능하다

앱 설치도 네이티브 환경과 최대한 유사하게 보이려 노력했다
다만 웹 앱은 네이티브처럼 아이폰 OS에 설치되는 것이 아니라 웹 사이트 바로가기 형태로
바탕화면에 아이콘이 설치된다. 물론 고객은 네이티브 앱 설치와 유사한 느낌을 받는다

자세한 내용은 BLOTER.net 에 소개된 다음의 글을 참고하자
http://www.bloter.net/archives/36636

모바일 트랜드는 소프트웨어의 유통구조를 확연히 변화시키고 있는 듯 하다
참.. 세상은 흥미롭게 변하고 있다.
이런 세상에 개발자로써의 업적(?)을 하나 정도는 남겨야 하지 않을까?

submit

오픈페인트(OpenFeint)

Posted in 모바일/모바일 플랫폼 // Posted at 2010. 7. 30. 11:19

팀장님이 알려주신 오픈페인트 서비스
오전에 관련 앱과 게임을 다운받아 보고 조금 사용해 봤다

외국에서 개발한 이 서비스는 아이폰 무료 게임들의 게임 스코어 정보를 저장하여 다른 사람과
랭킹 정보를 공유할 수 있도록 해주며 친구를 맺게 하여 지속적인 공유가 가능토록 한다
또한 채팅 및 게시판과 같은 커뮤니티 기능을 제공하며 트위터와 페이스북과의 연계성도 가지고 있다

예를 들어 특정 게임 실행 후 스코어를 트위터에 바로 등록할 수 있는 기능이 있다
트위터에 자동으로 등록된 글을 보니 게임 시코어는 물론 해당 게임의 앱스토어 URL도 같이 표시된다
일종의 광고인 게임 광고인 셈이다



오픈페인트에서 관련 기능을 위한 오픈 API를 제공하고 각 게임 개발자들이 이를 연동하는 구조로 보인다
물론 오픈페인트 자체 앱(App)도 존재한다
- 오픈페인트, 오픈 API 개발자 등록: https://api.openfeint.com/signup
- 오픈페인트 아이폰 앱:http://itunes.apple.com/hk/app/openfeint-game-spotlight/id349406668?mt=8
- 오픈페인트 사이트: http://www.openfeint.com/
- 오픈페인트 트위터: http://twitter.com/openfeint

랭킹정보를 서버에 저장하기 위해 자신의 아이텐티티를 서버에 제공해야 하는 소위 등록(가입)과정이 필요한데 오픈페인트에서는 매우 간단하고 쉽게 등록할 수 있도록 만들어 두었다

자신의 직접 이메일 계정과 패스워드를 기입하여 등록할 수도 있으며
임의의 숫자로 자동으로 생성된 아이디를 그대로 이용할 수도 있다.
즉 가입과정을 최대한 간소화 시킨 것이라 볼 수 있다

대략 잠시 사용해 본 내용이다.
오픈페인트는 단위 앱(App)이 아니라 기존에 있는 게임들을 위한 서비스 플랫폼인 것이다
특히 소셜 서비스 플랫폼에 가깝다고 할 수 있겠다

기존 게임개발자나 업체에서는 오픈페인트와 연동하여 손쉽게 소셜 서비스를 제공할 수 있게 되고
게임의 광고도 자연스럽게 이루어지는 효과도 볼 수 있다

앱스토어라는 거대한 플랫폼 위에 또다른 개념의 서비스 플랫폼의 전형적 예를 잘 보여준 사례로 보인다

참고> 오픈페인트 기능 소개
http://theeye.pe.kr/entry/open-social-platform-openfeint-on-iphone-games

Tags OpenFeint

submit