모바일매쉬업 WebApp 저작시스템 v1.0 한국전자통신연구원
TECHNOLGY BRIEF 기술소개서모바일매쉬업 WebApp 저작시스템 v1.0 기술개요 Open API 등웹상의자원뿐만아니라카메라, GPS 등사용자의모바일기기내자원을함께매쉬업하여모바일 WebApp 으로저작하고, 실행할수있도록하는기술임 기술개발상태 : 5 단계 2
3 TECHNOLGY BRIEF 기술소개서모바일매쉬업 WebApp 저작시스템 v1.0 기술설명 모바일매쉬업 WebApp 저작엔진기술 30여종이상의빌트인모바일매쉬업블록을위치정보, 멀티미디어, 소셜네트워크, 오퍼레이터, 사용자입력등카테고리로제공 REST(Representational State Transfer) 형식의 Open API(Flickr, Google Geocoding, Twitter 등 ) 와 Javascript 라이브러리형식의 Open API(Google Map, Daum Map 등 ) 매쉬업가능 Ajax 호출, 프록시생성, 데이터검증, 상태관리, 공통기능등을매쉬업코어및공통라이브러리로라이브러리화하여확장및블록저작이용이함 모바일매쉬업 WebApp 저작및배포인터페이스기술 HTML 5(HTML, Javascript, CSS) 표준을기반으로개발되어 Internet Explorer, Google Chrome, Safari 등다양한웹브라우저에서동일한 GUI 환경의저작도구를제공하며, 드래그앤드롭방식등손쉬운저작이가능함 모바일 WebApp의저작및모바일기기에서의실행에적합하도록 JQueryMobile 기반의컨트롤디자인및저작가능함 모바일매쉬업 WebApp 런타임기술 HTML 5 기반모바일웹브라우저의 Geolocation, Local Storage, Application Cache 등기능을매쉬업하여모바일 WebApp 저작가능함 카메라 (Camera), 갤러리 (Gallery) 등의모바일기기내부자원을매쉬업하여모바일 WebApp 저작및실행이가능하며, PC 기반저작도구에서미리보기를위한에뮬레이팅기능제공 기본웹브라우저와동일한 HTML, Javascript, CSS 동작을제공하는커스텀웹브라우저포함 적용분야 모바일웹서비스 모바일매쉬업 WebApp 저작환경및콘텐츠제공 모바일웹앱개발 모바일환경매쉬업 WebApp 콘텐츠개발
4 기술적경쟁력 전문가 ( 개발자 ) 와일반사용자로대상사용자층을명확히구분하고각각에특화된모바일매쉬업 WebApp 저작도구를개발함으로써사용자용이성이큼 Open API 등웹상의자원뿐만아니라카메라, GPS 등사용자의모바일기기내자원을함께매쉬업 하여모바일 WebApp 으로저작하고, 실행가능한환경제공 HTML5 표준기반으로개발되어 Internet Explorer, Google Chrome, Safari 등다양한플랫폼의 다양한웹브라우저에서동일한 GUI 환경의저작도구가실행가능함으로써사용자가쉽고다양한채 널로접근가능 JQueryMobile 기반의컨트롤디자인및저작기능을제공하며모바일 WebApp 의저작및모바일 기기에서의실행에최적화 기술개발필요성 모바일어플리케이션개발패러다임의전환 각앱스토어에맞춰개별적으로진행되는현재의애플리케이션개발작업이 2014년경에는대부분사라지고 HTML5와브라우저로플랫폼에구애받지않는개방적웹앱개발환경으로전환될것으로전망 (Gartner, 2010.10) 최근스마트폰및모바일웹의이용이급격히증가하면서모바일환경에서매쉬업콘텐츠를생성, 이용하려는수요또한크게늘고있으며, 이에사용자가언제어디서나쉽고빠르게매쉬업콘텐츠를생성, 이용할수있도록하는모바일매쉬업애플리케이션저작환경및콘텐츠제공기술개발이필요함 기존의매쉬업애플리케이션저작환경들은전문가 ( 개발자 ) 가아닌개발지식이적은일반사용자의경우접근과이용이쉽지않으며, 일반사용자를고려한경우에도대신미리정해진범위내에서제약된기능들만이이용가능함 현재모바일기기에서의실행을위한모바일매쉬업애플리케이션의저작환경은아직성숙되어있지못하며, 특히모바일기기에서직접매쉬업을저작하기위한저작환경은그예가미미함 본기술은상기의문제점들을해결하기위해전문가 ( 개발자 ) 용저작도구와일반사용자용저작도구를각각차별화하여제공하여, 일반사용자도접근및이용하기쉽도록하며제약될수있는기능들에대해서는전문가 ( 개발자 ) 용도구를연동하여보완함
5 기술의구성 PC 기반모바일매쉬업 WebApp 저작엔진기술, PC 기반모바일매쉬업 WebApp 저작및배포인터페이스기술및모바일매쉬업 WebApp 런타임엔진기술로구성되어있음 PC기반모바일매쉬업 WebApp 저작엔진기술 PC 기반모바일매쉬업 WebApp 저작엔진기술 : 매쉬업저작과정중모바일매쉬업 WebApp 저작인터페이스를통해전달되는사용자입력을바탕으로모바일매쉬업블록과모바일매쉬업 WebApp 을생성, 관리하며, 모바일매쉬업 WebApp 의미리보기와실행을위해매쉬업핵심및공통라이브러리등서버측기능제공 모바일매쉬업 WebApp 저작엔진기술 저작엔진인터페이스 : 저작엔진외부로단일화된인터페이스제공하여확장이용이함 레이아웃코드생성기 : 레이아웃정보를분석하여 HTML 통합코드를생성함. jquery Mobile을적용하여모바일환경에최적화 워크플로우코드생성기 : 워크플로우정보를분석하여매쉬업흐름을제어하는자바스크립트코드생성 매쉬업코어및공통라이브러리 : Ajax 호출, 프록시생성, 데이터검증, 상태관리, 공통기능등라이브러리화하여확장및블록저작용이함 모바일매쉬업빌트인블록제공 일반사용자도신규블록저작없이쉽고빠르게모바일매쉬업 WebApp 생성가능 이종인터페이스 Open API 매쉬업기능 Javascript 라이브러리형식의 Open API 매쉬업가능 (Google Map, Daum Map 빌트인블록 )
6 PC 기반모바일매쉬업 WebApp 저작및배포인터페이스기술 프론트엔드 (font end) 단으로서웹브라우저에 GUI 환경으로저작도구를제공하여사용자로하여금드래그앤드롭 (drag and drop) 방식으로손쉽게모바일매쉬업블록과 WebApp 을저작할수있게하며, 이렇게생성된모바일매쉬업블록과 WebApp 을배포, 공유, 검색할수있도록클라이언트측기능제공 모바일매쉬업빌트인블록제공 블록메타데이터입력 / 블록이벤트및오퍼레이션제공하기 위한자바스크립트에디터기능 UI(User Interface) 편집을위한 HTML 에디터기능 워크플로우저작제공기술 정의된레이아웃템플릿을이용한레이아웃구성기능 블록 ( 빌트인, 사용자정의블록 ) 을활용한편리한 UI 배치기능 블록 ( 빌트인, 사용자정의블록 ) 간선연결로워크플로우구성기능 배포인터페이스서비스제공기술 매쉬업 WebApp, 블록분류서비스기능 매쉬업 WebApp, 블록결과화면서비스기능 모바일매쉬업 WebApp 런타임엔진기술 모바일웹브라우저의 HTML5 기본요소와카메라 (Camera), 갤러리 (Gallery) 등모바일기기내자원을매쉬업하여모바일매쉬업 WebApp 으로생성할수있도록확장하며, 이렇게생성된모바일매쉬업 WebApp 을모바일기기에서실행할수있도록커스텀웹브라우저를제공 Mobile Runtime Engine 저작툴미리보기에뮬레이팅기능제공 AppDrone Browser 기본웹브라우저와동일한 HTML/CSS/JS 동작제공 Device Camera/Gallery 요소연동기능제공 사용자편의기능제공 ( 새로고침, 창관리, 페이지이동, 북마크관리, 히스토리관리 ) Runtime Blocks 저작도구에서활용가능한 HTML5 기본요소, Device 요소지원 빌트인블록제공 메타데이터정의및 JS 코드제공
7 기술동향 각앱스토어에맞춰개별적으로진행되는현재의애플리케이션개발작업이 2014 년경에는대부분사라지고 HTML5 와브라우저로플랫폼에구애받지않는개방적웹앱개발환경으로전환 국내기술 KT 와 LG 전자등은 WAC 표준기반추진 KT 와 LG 전자등은 WAC 표준기반으로 K- WAC 을개발하여웹마켓다운로드및 WebApp 실행이가능하도록추진중임 모바일앱개발도구로서 KT 에서폰갭 (PhoneGap) 기반의앱스프레소 (Appspresso) 를선보이고하이브리드앱 (HybridApp) 형식의앱개발이가능하도록함 행정안전부고시제2010-40호 (2010.06.24.) 에서는국민들이다양한모바일기기를사용할수있도록모바일앱 (App) 방식보다모바일웹 (Web) 방식을표준으로권고하고있음 해외기술 야후 (Yahoo), 마이크로소프트 (Microsoft), 노키아 (Nokia), IBM과인텔 (Intel) 중심으로매쉬업개발도구개발중 야후 (Yahoo) 는 Pipes 를개발하여모듈조합에의해매쉬업개발이가능하게함 마이크로소프트 (Microsoft) 는블록들을조합하여매쉬업개발이가능하도록 Popfly 를개발함 IBM 과인텔 (Intel) 도각각매쉬업개발도구로 IBM Mashup Center 와 Intel MashMaker 를개발하여선보이고있음 노키아 (Nokia) 는모바일기기내센서의상황정보를결합하여매쉬업이가능하도록태블릿 PC( 패드 ) 환경의매쉬업플랫폼을개발함 W3C에서모바일단말의다양한정보들을접근하기위한 API들에대한표준화작업이활발하게진행중이며, 이를고려하여모바일단말의정보들과연동하여매쉬업하기위한기술개발이필요함
8 시장동향시장동향 별도의애플리케이션을설치하지않아도인터넷에접속해손쉽게사용할수있는모바일웹사이트와웹기반툴이각광을받고모바일애플리케이션시장을주도할것으로기대 사용자간협업및네트워킹을통한콘텐츠확산이가능하도록모바일매쉬업 WebApp 콘텐츠를공유, 검색, 배포하는모바일매쉬업 WebApp 콘텐츠개인화관리및서비스기술개발이필요함 가트너는별도의어플리케이션을설치하지않아도인터넷에접속해손쉽게사용할수있는모바일웹사이트와웹기반툴이각광을받고모바일어플리케이션시장을주도할것으로전망함 (Garter, 2010) 가트너는 2011 년글로벌모바일애플리케이션다운로드가 177 억건으로지난해대비두배이상증가하고, 2014 년에는다운로드가 1,850 억건, 시장매출도최대 300 억달러로확대될것으로예상함 ( 서울경제, 2011.01.31) Forecast: Mobile Application Stores, Worldwide, 2008-2014(Gartner) 국내시장 모바일앱개발에매쉬업개념까지포함하고, 모바일환경의매쉬업개발을목적으로한모바일매쉬업앱개발도구는그예가미미하여본격적인개발및보급이시급함 모바일매쉬업 WebApp 서비스도입기에는시장개발차원으로신규시장을창출하고이후성장기에는시장확대전략을단계적으로진행 해외시장 IBM Mashup Center는웹서비스, RSS, ATOM, 레거시시스템, 로컬데이터등데이터중심의매쉬업기능제공 Intel MashMaker는파이어폭스 (Firefox) 브라우저의플러그인 (Plug-in) 형식으로제공되며, 여러웹페이지의데이터조합으로매쉬업하는기능제공 관련기업 수요처 KT, LG전자, 야후 (Yahoo), 마이크로소프트 (Microsoft), 노키아 (Nokia), IBM, 인텔 (Intel) 기술수요 적용처 주요거점관공서 / 포탈등서비스기업및공급자 / 모바일사용자 스마트콘텐츠, 모바일광고, 위치기반서비스
9 기술이전내용및범위 PC 기반모바일매쉬업 WebApp 저작엔진기술 PC 기반모바일매쉬업 WebApp 저작엔진설계서 PC 기반모바일매쉬업 WebApp 저작엔진시험절차서결과서 PC 기반모바일매쉬업 WebApp 저작엔진구현물 ( 바이너리 / 소스코드 ) PC 기반모바일매쉬업 WebApp 저작엔진기술 PC 기반모바일매쉬업 WebApp 저작및배포인터페이스설계서 PC 기반모바일매쉬업 WebApp 저작및배포인터페이스시험절차서결과서 PC 기반모바일매쉬업 WebApp 저작및배포인터페이스구현물 ( 바이너리 / 소스코드 ) 모바일매쉬업 WebApp 런타임엔진기술 모바일매쉬업 WebApp 런타임엔진설계서 모바일매쉬업 WebApp 런타임엔진시험절차서결과서 모바일매쉬업 WebApp 런타임엔진구현물 ( 바이너리 / 소스코드 ) 예상응용제품및기대효과 최종기술개발목표 Open API 기반의웹자원과사용자의모바일자원을융합하여사용자가다양한매쉬업콘텐츠를모바일기기에서직접저작및이용가능하게하는모바일매쉬업 WebApp 콘텐츠제공기술개발