Your SlideShare is downloading. ×
[uengine.org-uEngine Day] 스마트폰과BPM의만남:프로세스터치프로젝트발표자료
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

[uengine.org-uEngine Day] 스마트폰과BPM의만남:프로세스터치프로젝트발표자료

1,029
views

Published on


0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,029
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
30
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Process Touch(모바읷 앱) 개발을 위한 최적의 기술 유엔짂 오픈소스 프로젝트 2010년 11월 03일 김보상 책임 커미터 bskim@uengine.org
  • 2. Contents 1 How to develop a mobile app? 2 Mobile web standard 3 Hybrid development toolkit 4 Conclusion 5 Process Touch
  • 3. How to develop a mobile app?모바일 앱 개발에 대한 고민 or
  • 4. How to develop a mobile app?모바일OS 별 점유율 추이 ※ 출처: http://metrics.admob.com/2010/06
  • 5. How to develop a mobile app?플랫폼 별 개발특성 비교 모바일 웹은 한번 개발로 여러 플랫폼에서 사용 가능! ※ 출처: 모비젞 허광남 팀장
  • 6. How to develop a mobile app?스마트폰의 공통점 Palm Pre WEBOS 모바일 웹 브라우저는 대부분이 Webkit을 지원 ※WebKit : 웹 브라우저를 만드는 기반을 제공하는 오픈소스 응용프로그램 프레임워크
  • 7. How to develop a mobile app?WEB, 그리고 남은 숙제 1. 플랫폼에 독립 된 앱를 만들려면 Webkit 기반의 웹 앱으로 개발. 2. 웹 앱에서 다양한 모바일 디바이스들의 제어 방법? 3. 웹 페이지 로딩 속도 개선 방안?
  • 8. Contents 1 How to develop a mobile app? 2 Mobile web standard 3 Hybrid development toolkit 4 Conclusion 5 Process Touch
  • 9. Mobile web standardAdobe-flash support for iPhone
  • 10. Mobile web standardAdobe-flash support for iPhone Adobe Flash CS 5에 포함된 iPhone 용 앱 패키지를 통하여 포팅된 아이폰 앱 그러나 애플은 이렇게 개발된 앱을 앱스토어에서 승읶하지 않도록 정책을 바꾸었다. 지난 4월 20일, Adobe on Tuesday evening said it is ceasing investment in a software tool that enables Flash develop ers to port software into native iPhone and iPad apps, according to Mike Chambers, Adobe’s principal product manag er for Flash developer relations. --wired.com 애플의 변 - “Someone has it backwards-- it is HTML5, CSS, JavaScript and H.264 (all supported by the iPhone and iPa d) that are open and standard, while Adobe’s Flash is closed and proprietary, an Apple representative said in a statem ent provided to CNET.
  • 11. Mobile web standard모바일 웹 표준 관계도
  • 12. Mobile web standardW3C의 HTML5 배경 ※HTML5 : 웹 표준 기구인 W3C에서 만들고 있는 차세대 웹 표준안으로 모든 브라우저 벤더가 참여하고 있는 산업 표준. ※출처 : 실젂 HTML5 가이드
  • 13. Mobile web standardW3C의 HTML5 특징 확장 된 태그 편리한 폼 기능※출처 : 실젂 HTML5 가이드 리치 웹 미디어
  • 14. Mobile web standardW3C의 HTML5와 모바일모바일 네트워크 특성- 네트워크에 항시 연결되어있지 않은 WIFI 젂용기기( iPod Touch , iPad ) 들도 있다.- 네트워크 트래픽을 최소화 하는 것이 아주 중요하다. 오프라읶 기능과 로컬 DB의 지원은 웹서버 와 독립 된 web app이 가능해짐. <일반 웹 아키텍처> <모바일 웹 아키텍처> ※출처 : 실젂 HTML5 가이드
  • 15. Mobile web standardW3C의 HTML5와 모바일 1. 모바일을 위해서 HTML5에서 특화 된 기능 - Offline 지원 : LocalStorage , Web Database , App Cache - 미디어 처리 : Video , Audio , Canvas - 입력 지원 : Advanced Forms - 위치 정보 : GeoLocation ( 연계표준 ) 2. HTML5 의 스펙 중 아직 주요 브라우저에서 지원되지 않는 기능. - WebSocket - FileReader - IndexedDB - Web Workers
  • 16. Mobile web standardW3C의 Device APIs(DAP)W3C DAP은 HTML5와 함께 모바일 단말에서 단일한 방식으로 모바일 앱의 다양한 표현과기기 접근을 가능하게 할 가장 중요한 두 가지 표준(표준화가 아주 기초 단계)
  • 17. Mobile web standardOMPT의 BONDIBONDI initiative 는 2008년 OMTP 멤버쉽에 의하여 탄생했으며 웹앱과 플랫폼 갂 인터페이스를 정의하며 W3C의 DAP와 통합 될 계획.(별도로 웹 플랫폼을 설치해야 웹 어플리케이션이 구동이 가능)
  • 18. Mobile web standard모바일 웹 표준의 고찰1. 웹 표준과 모바일 지원기능 사용을 위해서는 HTML5을 적용해야 함.2. 디바이스 표준에 의한 단말기 통합 접근(Top-down 방식)은 시기상조.
  • 19. Contents 1 How to develop a mobile app? 2 Mobile web standard 3 Hybrid development toolkit 4 Conclusion 5 Process Touch
  • 20. Hybrid development toolkitPhonegap의 소개스마트폰 OS 브라우저들의 Interface를 이용하여 단말의 기능들을 HTML+Javascript만으로 이용할 수 있도록 해주는 하이브리드앱(Web+App) 오픈소스 프레임워크이다.
  • 21. Hybrid development toolkitPhonegap의 로드맵
  • 22. Hybrid development toolkitPhonegap의 웹페이지 실행‘WWW’ 폴더 내에 웹 소스를 모두 넣고 어플리케이션을 만들기 때문에 실행 시에 웹이단말기 로컬에서 웹페이지가 실행된다. Android(eclipse) iPhone(Xcode)
  • 23. Hybrid development toolkitPhonegap의 구조 • Phonegap android PhoneGap Native app ver. • Phonegap iphone ver. • Phonegap winMo ver. Device Contact Profile phonegap Native File LBS WebKit System (???) ① URL change event방식 Browser (iPhone & WinMo) gap://beep(5) Accelerator ② Javascript & JAVA obj mapping Application URL (Android) written in change event • iPhone PhoneGap ③ • Android Device • WinMo JS API • • ① • Performance with AJAX - UI & Data Separation JSON,XML MobileWebApp. • Vector Graphic with SVG – raphael + mobile ok Guidelines (JS) • UX – native like ②
  • 24. Hybrid development toolkitPhonegap의 동작 PhoneGap <iphone> <Command> Web page Phonegap UIWebkit Sound Device ….. (html) Delegate beep 버튺클릭 beep(2); Load WithRequest execute()
  • 25. Hybrid development toolkitRhomobile의 소개웹 앱을 기반으로 Webkit 브라우저에 내장시켜 보여주는 방식이 아닌 실제 각 플랫폼별 Native App을 생성시켜주는 부분에서 Phonegap과 큰 차이가 있다.(루비와 루비젬스에 익숙해야 사용가능)
  • 26. Hybrid development toolkit모바일 앱 개발 방법 비교 장점 단점Native - 각 플랫폼에서 제공하는 모든 기능을 -다른 플랫폼에서 사용 할 수 없다. 홗용할 수 있다. -개발언어에 제약을 받는다. - 화면 랜더링 속도가 빠르다.Web - 개발이 용이하다. - 모든 정보를 웹 서버에서 다운로드 - 모든 플랫폼에서 사용 가능. 를 받아야 한다.(속도, 네트워크) -디바이스 제어가 힘들다.Hybrid - 웹 개발방식으로 개발하고 모바일 디바 - 초기 개발홖경 구축 비용.(native +web) 이스 제어 가능. - 모든 플랫폼에서 사용 가능.
  • 27. Hybrid development toolkit웹 앱의 디바이스 제어와 로딩 속도 웹 앱에서 다양한 모바일 디바이스들의 제어 방법? 1. Webkit 기반의 PhoneGap으로 단말기 통합 접근(Bottom-up)이 해결법. 웹 페이지 로딩 속도 개선 방안? 1. PhoneGap은 웹페이지를 로컬에서 실행하기 때문에 화면 로딩 시 일반 웹처럼 HTML 소 스를 네트워크를 통하여 가져올 필요가 없다. 2. Ajax를 통하여 UI와 Data를 분리한다. 3. 가볍고 사용하기 편한 Json을 사용한다. 모바일 서버 네트워크 Ajax Json type의 data PhoneGap
  • 28. Contents 1 How to develop a mobile app? 2 Mobile web standard 3 Hybrid development toolkit 4 Conclusion 5 Process Touch
  • 29. Conclusion모바일 웹 앱 개발을 위한 기술정리 1. Webkit : 대부분의 단말기 웹브라우저에서 지원하는 플랫폼. 2. HTML5 : 웹 표준, 모바일 지원 기능과 리치 웹 미디어 . 3. PhoneGap : Webkit 기반에 다양한 단말기 디바이스 제어 가능하며 웹페 이지 로컬 실행. 4. Ajax : 웹 페이지 로딩 속도를 위한 UI와 data 갂 분리. 5. Json : Ajax의 data의 경량화
  • 30. Conclusion결롞 플랫폼에 독립적읶 모바읷 앱을 개발하기 최적의 아키텍처 Ajax Json HTML5 Webkit PhoneGap iPhone Android WM … Device Device Device
  • 31. Contents 1 How to develop a mobile app? 2 Mobile web standard 3 Hybrid development toolkit 4 Conclusion 5 Process Touch
  • 32. Process Touch Introduce 워크리스트 확인 프로세스 모니터 및 업무 노티 기능 링 기능 Process 모바읷 기반 회의관리 및 Touch BPMS의 프로세스와 연계 • 프로세스 시작 시점의 연결 회의 시 가장 홗용성이 높은 모바일 단말(아이폰,안드 로이드폰 등)을 홗용하여 LBS와 카메라, 녹음기를 이용 하여 참석자 및 회의내용을 기록하여 프로세스의 시작 을 암시하는 회의 내용을 젂자화함회의시갂 회의 녹취 및 사짂 이슈 발행(프로세 • 프로세스의 Traceability를 강화(타임아웃)설정 첨부, 노트 기능 스 개시) 기능 회의 후 회의내용 정리 및 배포를 짂행하고, 회의 내용 에 따른 후속 업무와의 연계를 BPM 시스템으로 지원 하여 Notification 과 업무확인 및 모니터링의 즉시성 을 제공하여 후속업무의 Traceability를 높임 • 오프라읶 업무와의 연계성 강화 모바일 홖경 단독으로 처리하기 보다는 기존 시스템과 의 연계를 통하여 다양한 시너지를 발행할 수 있으며 연계방안은 프로세스 기반의 시스템 홖경이 효율적으 로 적용 가능함 Page  32
  • 33. Process TouchScenario online 프로세스의 시작 현장직 (이슈의 발생) (상황읶지) Off-line 팀장/의사결정자 현장 담당자 (회의실) Edited from Oracle Source
  • 34. Process TouchPlatform and Framework Nice mobile web apps 웹 언어를 통한 네트워크 성능 렌더링 속도 리치한 표현 디바이스접근 최적화 JQtouch-like PhoneGap Json Ajax framework Webkit JQuery HTML5
  • 35. Process TouchFunctions Nice mobile web app Process Touch 회의 관리 BPM Client 참석자 회의자료 회의시갂 설정 및 프로세스 인스턴스 워크아이템 음성 녹취 네비게이터 자동인식 첨부 완료시갂 알람 시작 리스트 핸들러 PhoneGap JQuery Ajax
  • 36. Process TouchCommunity http://phonegap.pe.kr
  • 37. 감사합니다