작년 요맘때 삼성에서 T*Omnia 핸드폰을 출시 하였고 그때 당시 사내에서 모바일에 멀티 콘텐츠 브라우징 인터페이스를 Flash Lite로 개발하여 올려볼 일이 있었습니다.

그때 테스트 후에 재미삼아 Youtube 임베디드 플레이어 API를 이용해서 Youtube의 주요 카테고리(최신영상, 가장 많이 본 영상 등)를 볼 수 있는 모바일 애플리케이션을 Flash Lite을 이용해 만들어 봤습니다.

모바일 디바이스는 데스크탑 PC에 비해 그 사양이 매우 낮기 때문에 Flash Lite 3.1 플레이어 역시 기술 지원이 데스크탑에 비해 제한적입니다.  하지만 모바일 환경에서 Flash의 Rich UI를 제공할 수 있다는 것은 Flash Lite 의 큰 장점입니다.

최근 Adobe Max 에서 발표한 Flash 10.1에 대한 기대는 모바일 부분에서도 상당한 것으로 알고 있습니다.  일찍이 국외 스마트 폰에는 Flash 대응을 위해 많은 노력을 기울익 있습니다.
하지만 국내에서는 임베디드 시스템에 다이나믹한 UI를 제공하기 위한 수단으로만 사용될 뿐 개발자를 위한 환경에는 별 관심이 없어 보여 아쉬움이 남습니다.

서두가 길었습니다.

개발했었던 mtube 소개나 할까 시작한 글인데요 : )



개발에 필요한 요소
1. Youtube Embed Player API & Data API
2. ActionScript 2.0 on Flash CS4
3. Flash Lite 3.1
4. Adobe Mobile Packager

개발에 필요한 요소는 위의 4가지 입니다.  개발 후 Adobe Mobile Packager 을 이용해 패키징 하여 디바이스에 설치하여 사용할 수 있습니다.

Adobe Mobile Package Example from rhiokim on Vimeo.


Adobe Mobile Programming Example from rhiokim on Vimeo.



테스트 장비
5. Window Mobile 6.x
6. Samsung T*Omnia(SCH-M490)

최근 옴니아 2가 좀더 나은 스펙으로 출시 되었던데 그 폰에서는 원활이 구동되지 않을까 짐작해봅니다.  사실 이 mtube 애플리케이션은 옴니아에서 메모리 오류가 발생합니다. 

이유 인 즉, Youtube 임베디드 플레이어가 모바일 용이 아니다 보니 : (  메모리 점유율이 상당히 많더군요. 뿐만 아니라 동영상 또한 버퍼를 이용하므로 많은 메모리를 요구하게 됩니다.

mTube based on Flash Lite 3.1 from rhiokim on Vimeo.



첨부한 Youtube.metadata 와 Youtube_1.0.0_English (US).cab 파일을 폰에 저장하고 cab 파일을 설치하면 됩니다.  소스와 클래스 다이어그램을 첨부합니다.


개발 경험에 대한 정리도 할 겸 간단히 Flash를 이용한 Mobile 앱을 개발하고픈 개발자에게 도움이 될까 공유해 봅니다.  

Tip, JavaScript 나 ActionScript 나 그 표준(ECMA-262)이 같기 때문에 근본적인 원리를 알고 접근한다면 매우 쉽고 재미있는 기술입니다.

클래스 다이어그램
 

매우 단순한 구조로 되어있습니다.

Youtube Class는 main class로 Controller 담당하고
Embed Class는 Youtube 임베디드 플레이어 모델 담당, List Class는 Youtube XML Data 모델  담당,  Container는 동영상 클립들을 제어 관리 모델 역할을 합니다.


신고
Posted by Rhio.kim
http://labs.adobe.com/technologies/distributableplayer/

그동안 Private Beta 테스트를 해온 Distributable Player Solution(이하 DP)이 정식 발표를 하였습니다.  여기에는 Adobe Mobile Packager 가 함께 포함됩니다.

이를 이용하면 데스크탑 Flash Application 모델을 그대로 모바일에 적용하여 수행할 수 있게 합니다.  당연 개발은 Flash Lite 3.1상에서 개발해야 겠죠.  Flash Lite 3.1 은 Flash 10에 비하면 지원여부가 매우 작지만 Flash의 주요 기술중 핵심 기술들은 대부분 구현이 가능합니다. Flash Application 개발자들에게는 더 없이 좋은 소식이 되겠네요.

Adobe Mobile Packager를 이용하여 .CAB 형태로 Package하여 Window Mobile 플랫폼에서 Standalone Application으로 동작할 수 있도록 합니다.  간단히 Package 테스트 및 환경 구축에 대한 내용은 아래의 내용에 추가했습니다.  또한 Adobe 에서도 ScreenCast가 있으니 함께 보시면 큰 도움이 되리라 봅니다.

Flash Lite DP 를 Window Mobile 6.x, 5.0의 Smart Phone 그리고 Symbian S60에서도 이용할 수 있게 되었습니다.  간단히 아래의 그림과 같은 방식(Workflow)으로 생성 및 배포, 실행할 수 있게 됩니다.
 
이미지 출처 : Adobe Lab


필요 요소
  개발 PC
    - Flash Professional CS3 or CS4, Device Central CS3 or more
    - MicroSoft ActiveSync

  Mobile Device(Flash Lite 3.1 Distributable Player) 
    http://labs.adobe.com/downloads/distributableplayer.html

    Download the Developer edition for Windows Mobile 5.0 Pocket PC (ZIP, 930 KB)
    Download the Developer edition for Windows Mobile 5.0 Smartphone (ZIP, 926 KB)
    Download the Developer edition for Windows Mobile 6 Professional (ZIP, 928 KB)
    Download the Developer edition for S60 devices (SIS, 675 KB)


Adobe Mobile Packager Test 내용

더보기



테스트 해보고 픈 마음에 만들어 놓았던 Image Viewer와 Video Player는 삼성 T*Omina(SCH-M490)에서는 돌아가질 않네요.
 
이제 iPhone용 Distributable Player만 발표 되면 되는 걸까요?  이것만 출시 된다면 다양한 플랫폼에 있어서 Flash의 입지는 좀더 강해지지 않을까 생각을 해봅니다.

참고자료
Adobe Video : http://tv.adobe.com/#pg+15313
PDF : http://labs.adobe.com/downloads/distributableplayer.html 
Flash Lite : http://www.adobe.com/products/flashlite/ 

신고
Posted by Rhio.kim

삼성 T*OMNIA(옴니아) Phone 에서 Flash Lite 3.1 개발을 위한 준비

사용자 삽입 이미지

모바일 시장이 꾀 빠르게 변화하고 다 각도로 생활에 자리를 잡아가는 것 같습니다.  최근 불경기임에도 불구하고 삼성에서는 모델명 SCH-M490의 T*Omnia Phone를 내놓았습니다.  그것도 100만원 정도의 부담을 주는 가격으로 또한 Apple에서는 iPhone와 기존에 iPod Touch 2세대를 내놓았고  iPhone 국내 출시도 머지 않았습니다.

두 기기 뿐만 아니라 Nokia 에서도 새로운 모델을 통해 웹 기반의 강력한 환경을 지원하기 위한 발전이 매우 빠르게 이뤄지고 있고 Google의 Android 플랫폼의 아고라 또한 내년 초에 그 모습을 드리운다고 하니…

과연 이런 변화가 웹의 생태에도 영향을 미치지 않을까 라는 생각을 요즘 들어 많이 하게 됩니다.  또 하나의 이유인 즉 저 역시 iPod Touch 2세대를 열심히 사용중인데 사용할수록 매우 강한 인상을 받습니다.  아침에 눈떠서 화장실에 갈 때도 자리에 누워서 잠을 자기 전까지 출근할 때나 자투리 시간이 남을 때면 핸드폰 보다 아이팟을 더 보게 됩니다.  이렇듯 생활에 필요한 하나의 큰 문화로 자리를 잡아간 다는 것.

아마도 또 다른 많은 기기들에 의해서 그렇게 생활의 주요 일부분을 의지하게 되지 않을까요?

또한 그것들의 기술에 대한 궁금증으로 사로잡혀 헤어나기가 쉽지 않습니다.  기기들의 안의 컨텐츠는 웹 기반의 매우 다양한 솔루션들을 제공합니다. 

이렇듯 자기의 생활의 Storage를 자그마한 기기에 담고 다니는 것입니다.
이것들의 또 하나의 강력한 기능은 당연 Data Portability 일 것입니다.  이젠 이 Data 가 Life 혹은 Human Memorize 되는 날이 머지 않은 듯 합니다.

서두가 길었던 것 같습니다.

T*Omnia와 Apple iPhone 에 대해서 벤치마킹하고 싶은 마음도 간절합니다.
허나 그것보다 기기 위에 올려질 개발자들의 산물에 일부분들이 어떻게 효율적으로 개발되어질 수 있는지 그러한 경험들을 공유 해보고자 합니다.


Flash Lite 3.1 에 대한 이해

참고 : http://www.adobe.com/products/flashlite/
Flash Lite 3.1은 Mobile Opera build 1957 버전에서 그나마 안정적으로 지원되고 Internet Explorer 브라우저에서는 아직까지 지원되지 않는 모습이다.

 

사용자 삽입 이미지


이는 Adobe 사의 Flash Lite의 Archtecture 입니다. Lite 2.1에 비해 변화한 모습입니다.
http://www.adobe.com/products/flashlite/version/ 이곳을 통해 버전별 비교 모습을 보시면 좋겠습니다. 

위 자료에 보면 MPEG-4 and other video formats 부분에 (On2, Sorensen, and support for H.264) 라는 Support 여부에 대한 언급이 있는데 몇번의 H.264(AVC/AVV) 인코딩 된 영상 파일에 대한 테스트를 해 보았지만 재생은 되지 않았다.  어떤 조건이 맞지 않았는지 자세히 찾아 보지는 않았습니다.

그리고 Flash 내에서 표현되는 컨텐츠 요소마다의 Sound 제어할 수는 없는 것 같습니다.  두개의 멀티미디어 콘텐츠를 재생하려 할때 각기 다른 볼륨 컨트롤이 지원되지 않습니다.  SoundTransform Class가 따로 존재하지 않더군요.


옴니아 환경 정보 확인 

SCH-M490 모델 Windows Mobile 6.1 플랫폼에 Internet Explorer 과 Opera Mobile 두 가지의 브라우저가 Embed 되어있습니다.  그나마 Flash Lite가 안정적으로 지원되는 Opera는 설정 부분에서 Flash 지원여부를 선택함에 따라서 Flash를 사용할 수 있게 됩니다.

옴니아 초기 Opera 버전은 따로 최적화 작업을 한 것인지 모르겠으나 build 15110 으로 되어있다.  1511 버전을 안정화 한게 아닌가 생각이 듭니다.

인터넷에 찾아보니 옴니아 추출 버전이라고 하여 build 1957이 공유 되어지고 있는 것은 확인하고 옴니아에 인스톨해서 사용해 보았지만 Flash Lite는 돌아가지 않았습니다.

추가적인 한가지 인터넷 상에 배포되어지고 있는 대부분의 Mobile Opera 버전을 다운로드 받아 옴니아에 설치해서 구동시켜 Flash Lite 3.1 환경 테스트를 해보았지만 어느 하나 정상적으로 표시되는 것은 보지 못했습니다.

그리고 옴니아 폰에서는 Flash Lite 3.1을 기본적으로 지원하지 않습니다.  이는 따로 배포하고 있는 Flash Lite 3.1 Plug-In을 설치하여야 가능합니다.  Window Mobile 6.1에 embed 된 Flash Lite의 버전은 잘 모르겠지만 Flash가 브라우저상에 렌더링 되지 않았습니다.


옴니아 폰 환경 설정

Flash Lite 3.1 Plug-In은 정확한 배포 버젼을 다운 받아 Mobile 기기에 인스톨을 해주면 됩니다.

Mobile Opera의 경우에는 초기 폰에 설치되어 있는 버전의 설정 > 고급설정 > 플래시 사용 에 체크를 해줌으로써 기본적인 Flash Lite 3.1 개발 환경은 갖춰지게 됩니다.


Flash CS4 개발 환경

Flash 개발 환경은 CS4 와 CS3 모든 버전에서 동일합니다.

기본적으로 Flash Project 생성시 publish setting 에서 Player version, ActionScript version을 설정해 주게 됩니다.  Player는 Flash Lite 3.0 혹은 Flash Lite 3.1로 설정하고 ActionScript 2.0 으로 설정을 하고 개발하면 됩니다.

사용자 삽입 이미지


초기 개발에는 Player version을 Flash Player 8으로 설정하고 개발하면 되고 디버깅시에만 Flash Lite 3.x에 맞추면 됩니다.

디버깅이라는 것은 Adobe Device Central 을 이용해서 실제 모바일 환경에서 테스팅 할 수 있는 에뮬레이터가 뜨는데 이는 Adobe 사에서 온라인을 통해서 최신의 Device Profile 들을 제공해줍니다.  하지만 SCH-M490 모델은 없다는 것

하지만 Adobe Device Central CS4 의 기본 Flash Lite 3.1 에뮬레이터를 제공하니 표준에서 개발하시면 별 무리 없이 지원이 됩니다.

사용자 삽입 이미지

Adobe Device Central CS4

사용자 삽입 이미지사용자 삽입 이미지
다양한 Device 환경을 제공


위에 간략히 소개한 것은 웹 기반의 Flash Lite 3.1의 환경을 위한 것이고 실제로 Standalone Application 개발을 위해서는 현재 Adobe AppZone 에서 Distribute your content 탭에 보면 private beta 로 서비스 중입니다.

이와 관련된 정보는 http://www.adobe.com/devnet/devices/ 에서 참고할 수 있습니다.

모바일 환경에서는 Flash Lite 뿐만 아닌 MS의 Silverlight Mobile 또한 발표된 바 모바일 어플리케이션의 주요 기술로 두 사의 경쟁이 어떨지 기대됩니다.

최근 Flash 환경에서 웹과 모바일의 간단한 UI 개발 기회가 있어 경험을 쌓게 되었는데 ActionScript 2.0의 모태는 ECMAS-262 Spec을 따르고 있어서인지 JavaScript와 매우 유사한 모습을 띄우고 있습니다.

그리고 ActionScript 3.0 부터는 ECMAS4 Spec을 따르고 있어서 객체지향 언어로서의 완벽한 모습을 갖추고 그래서 인지 적응하기도 매우 빨라 보입니다.  UX 분석을 통한 디자인, 설계는 쉽지 않은 과제인 것 같습니다.

정리할 내용도 많고 개발에 필요한 환경 그리고 설정들에 관해서 좀더 디테일한 정보를 공유하고 싶네요.

요 아래 Mashup Contest 홍보 포스팅도 몹시 간략히 했지만 올해 매쉬업 경진대회에서는 이런 Mobile분야로 서비스 할 수 있는 Mashup Application도 나오면 어떨까?  짧은 아이디어를 내봅니다.


개발 가이드 : http://help.adobe.com/ko_KR/FlashLite/2.0_FlashLiteDevGuide2/

신고
Posted by Rhio.kim