4. 가트너, 2013년 10대 전략 기술 트렌드
• Mobile Device Battles
• Mobile Applications
and HTML5
• Personal Cloud
• Enterprise App Stores
• The Internet of
Things
http://www.gartner.com/it/page.jsp?id=2209615
• Hybrid IT and Cloud
Computing
• Strategic Big Data
• Actionable Analytics
• In Memory
Computing
• Integrated Ecosystems
6. 2016년 모바일 시장 전망
http://smarterplanet.co.kr/2012/11/06/mobile/
7. 2015년 사용 예상 기기
Televisions
Connected Cars
Game Consoles
Foldable Screen
Google Glass
83.5%
74.0%
71.2%
68.1%
67.1%
8. 스마트폰 + 태블릿 vs PC
Desktop PCs Notebook PCs Smartphones Tablets
0 M
1,000 M
2,000 M
3,000 M
2009 2010 2011 2012E 2013E 2014E 2015E
Smartphone + Tablet > PC
KPCB, http://techcrunch.com/2012/11/05/mary-meeker-internet-trends/
9. 모바일 웹 트래픽 점유율
http://royal.pingdom.com/2012/05/08/mobile-web-traffic-asia-tripled/ , http://gs.statcounter.com/#mobile_vs_desktop-KR-monthly-200909-201211
10. iOS vs Android
http://www.idc.com/getdoc.jsp?containerId=prUS23771812 , http://www.idc.com/getdoc.jsp?containerId=prUS23772412
2011 3Q 2012 3Q
14%30%
9%
4%
9%
18%
7%
50%
60%
태블릿 시장 점유율
Apple Samsung
Amazon Asus
Others
2011 3Q 2012 3Q
10%29%
75%
58%
15%14%
스마트폰 시장 점유율
iOS Android
Others
11. 모바일 기기별 웹 트래픽 점유율
iPhone
46%
Galaxy
17%
Others
37%
http://venturebeat.com/2012/10/17/android-smartphones-now-have-majority-mobile-web-traffic-share/
17. 비표준 웹기술 동향
스티브잡스, '아이폰
서 플래시 거부'
- 2010.5.15 | 연합뉴스
어도비, 모바일용 플래시 포
기... HTML5에 집중
- 2011.11.10 | ITWORLD
실버라이트5 공개 임박… 후속판은 없
다?
- 2010.11.10 | ZDNET
미래부, 웹사이트서 '액티
브X' 걷어낸다
2013.04.18 | 베타뉴스
MS! "HTML5는 옳은 길이다"
IE9는 HTML5 전격 지원
정부 정책 동향
행정안전부고시 제2010-40호
(웹 호환성 준수지침, 액티브X 배제)
방송통신위원회, 행정안전부 에서는 '액티브X(Active X)' 퇴출을 적극적으로 유도하고 있
음 (공공기관 우선 적용)
방통위의 액티브X 대체기술 가이드라인
(웹표준 기술 사용 권고)
한국정보화진흥원의 웹접근성 향상을 위한 국가
표준 기술 가이드 라인 제시
법제처의 장애인차별금지법 제정
(웹 접근성 개선 유도, 금융기관 우선 적용)
18. OS 업그레이드 리스크
2014년 윈도우 XP 지원 종료
-> IE9이상은 미 지원
-> 전세계 악성코드의 57%가 우
리나라에서 유포
MS 차세대 운영체제 윈도우 8
-> 모바일 환경은 Active-X 배
제
윈도우8
메트로 UI
29. From HTML5 DevConf
• HTML5
Application
Platform
• New Mobile OS
• CSS3, SASS, SPA,
BaaS, SVG, Canvas,
WebSocket,
NodeJS, ...
30. 브라우저 별 HTML5 지원 수준
0
100
200
300
400
500
Chrome
Opera
Safari
Firefox
IE10
IE9
IE8
Chrome
Firefox
Mobile
iOS6.0
Windows
Phone8
Android
297
320
386388390
42
138
320
372378389
434
DESKTOP MOBILE
http://html5test.com/results/desktop.html
31. HTML5 적용 전략
• Lowest common denominator
• Vertical slices
• Using Polyfills - Modernizr
• Using fallbacks strategies
http://www.codeproject.com/Articles/249438/HTML5-Adoption-Strategies
34. IE 6
Galaxy S2
Galaxy Tab 10.1
iPhone 4S
IE 7
Galaxy S3
iPhone 5
iPad 4
IE 9
chrome
0 875 1,750 2,625 3,500
3,398
2,070
951
907
680
541
438
356
255
171
모바일 브라우저 속도
vs PC 브라우저 속도
http://peacekeeper.futuremark.com/results?key=stats
35. 반응형 웹 디자인
• One website for every
screen
• 화면크기, 플랫폼 및 방향
에 반응하는 웹 디자인
• 구성요소
- A flexible/fluid grid
- Responsive images
- Media queries
http://www.templatemonster.com/infographics/responsive-web-design-interactive-guide.php, http://www.abookapart.com/products/responsive-web-design , http://opensignal.com/reports/fragmentation.php
36. 기업이 지원해야 할 모바일 OS의 개수
4+ 3 2 1 0
12%
39%
25%
15%
9%
http://www.nipa.kr/know/periodicalView.it?identifier=02-001-110531-000004&menuNo=28&code=B_ITA_01
멀티 플랫폼 요건 : 50%
(Forrester, July 2009)
37. 네이티브앱 vs 하이브리드앱 vs 웹앱
네이티브앱
- 빠른 속도
- 디바이스 제어
- 플랫폼 별 개발
하이브리드앱
- 개발 용이
- 멀티플랫폼
- 디바이스 제어
웹앱
- 개발 용이
- 멀티플랫폼
- 디바이스 제어
불가
38. 하이브리드앱
• Native App + Web Based UI
• Multi Device
• Device Control
Mobile OS (iOS,Android,Window Phone, …)
Sandbox
Hybrid App Framework
browser ApplicationNative
API
JavaScript
API
39. 하이브리드앱 플랫폼 비교
0
100
200
300
400
500
2008-01 2009-01 2010-01 2011-01 2012-01
Cordova PhoneGap Appcelerator Sencha
http://www.google.com/trends/explore#cat=0-5&q=phonegap%2C%20appcelerator%2C%20sencha&date=1%2F2008%2059m&cmpt=q
40. HTML5 is real, it’s now and it’s also
the future
http://venturebeat.com/2013/02/26/what-developers-do-with-html5-infographic/
http://venturebeat.com/2013/02/26/5000-developers-say-html5-is-real-its-now-and-yeah-its-also-the-future/
41. 멀티플랫폼 지원전략 - Facebook
• Android, iOS Native
앱 개발
- Tooling / Developer
APIs
- Scrolling performance
- GPU/CSS3
• Mobile Web 점유율은
여전히 50%이상
http://www.businessinsider.com/mark-zuckerberg-html5-mobile-2012-9
http://lists.w3.org/Archives/Public/public-coremob/2012Sep/0021.html
Keeping the Dream Alive, HTML5 DevConf
42. 멀티플랫폼 지원전략 - LinkedIn
• Hybrid App
• 10+ OS Support
iOS Android
Mobile
Web Others
80%30% 100%100%
20%
70%
Web Native
Mobile HTML5 implications on architecture, performance, process. HTML5 DevConf
43. 멀티플랫폼 지원전략 - Netflix
• N-Screen
• Over 400 devices
• WebKit+HTML
• Move from Silverlight
to HTML5
http://techblog.netflix.com/2011/09/netflix-webkit-based-ui-for-tv-devices.html
http://www.theverge.com/2013/4/15/4228248/netflix-plans-its-move-from-microsoft-silverlight-to-html5-video
48. • 보편적인 웹 접근성 확대와 특정 플랫폼에 종속적이지 않는 인터넷 환경
으로 개선
• 다양한 웹 브라우저 및 다양한 OS에 대한 높은 상호 호환성 확보
• 스마트폰, 태블릿PC 등 웹 접근이 가능한 다양한 모바일 디바이스를 동
시 지원할 수 있는 기술확보
• 인터넷 익스플로러, 액티브X에 대한 기술 편향성을 벗어나 글로벌 서비
스가 가능한 웹 표준으로의 빠른 이행 필요
• 국제적인 웹 트렌드 수용과 차세대 웹 표준인 HTML5 활용을 위한 기반
확보
• 높은 확장성을 기반으로 오픈소스 연계 및 HTML5와 같은 차세대 웹표
준 기술을 지원할 수 있어야 함
UI 솔루션 도입시 고려사항
49. 국내 UI제품 현황
구분
Out Of Browser RIAOut Of Browser RIA In Browser RIA (Pure Web)In Browser RIA (Pure Web)
구분
Component Platform Component Platform
특징
- 단순 컴포넌트 라이
브러리 형태로 제공
(DLL 형태)
- 실행환경과 개발툴을 통
합해서 제공
- 지난 10년간 UI시장의 주도
- 단순 컴포넌트 라이브러
리 형태로 제공(JS 형태)
- 웹 표준 실행환경과 개발툴을
통합해서 제공
- 멀티 OS, 멀티 브라우저, 모
바 일 웹 등을 지원
제품
IBsheet,
WiseGrid,Rmate,
Expert Grid 등
GAUSE, MI/
XPlatform(Runtime)
TrustForm, Flash/Flex,
SilverLight 등
IBsheet, WiseGrid 등
WebSquare, eXria,
XPlatform(AJAX)등
장/단점
- 가격 저렴
- 도구 부재로 인한 수작업
개발에 의한 생산성 문제
- Active-X기술을 사용하여 특정 OS
와 웹브라우저에 의존적 (MS
Windows, IE에 국한)
- 다양한 컴포넌트 제공이 가능하고
로컬 자원 접근 등 확장 기능들을 사
용하기 용이하지만 재사용성 및 플
랫폼 호환성이 부족함.
- 가격 저렴
- 플랫폼 제품을 선호하는 국내 특
성상 제한적으로 쓰임
- 도구 부재로 인한 수작업 개발에
의한 생산성 문제
- 모바일에 대한 지원이 미흡
- W3C 표준이 자연스럽게 준수되고 서
로 다른 기기에서 웹 브라우저 설치만
으로도 호환성이 보장됨.
- HTML5 표준화 작업 등이 진행되면서
Out of Browser RIA의 장점을 흡수
하고 있음.
향후 전
망
- 멀티 OS, 멀티 브라우저, 모바일 환경 지원에 한계 노출
- Flash는 HTML5 표준화가 진행되면서, iOS, IE 10 등 모바일 중
심의 주요 브라우저 및 플랫폼에서 퇴출될 가능성 있
- 차세대 운영체재인 Windows 8이후 Active-X 지원 불투명
(IE10 모바일 버전에서는 Active-X 사용 불가)
- 정부적인 차원에서 점차적으로 Active-X 사용을 줄이고자 하여
그 씀임새가 줄어 들것으로 예상됨
- 멀티 OS, 멀티 브라우저, 모바일 환경 지원에 한계 노출
- Flash는 HTML5 표준화가 진행되면서, iOS, IE 10 등 모바일 중
심의 주요 브라우저 및 플랫폼에서 퇴출될 가능성 있
- 차세대 운영체재인 Windows 8이후 Active-X 지원 불투명
(IE10 모바일 버전에서는 Active-X 사용 불가)
- 정부적인 차원에서 점차적으로 Active-X 사용을 줄이고자 하여
그 씀임새가 줄어 들것으로 예상됨
- 컴포넌트 보다는 국내 특성상 개발도구가 포함된 플랫폼 제품이 시장을
주도할 것으로 전망됨
- 멀티 OS, 멀티 브라우저, 멀티 디바이스(모바일) 충족에 대한 수요가 폭
발적으로 늘어나면서 웹표준 시장도 확장
- 구글, MS,애플, 각 브라우저 회사, 수많은 웹 개발자들의 지원을 받고 있
는 차세대 웹표준 HTML5가 주요 웹구현 기술로 자리 잡을 것임
- 따라서 Pure Web시장이 커지면서 In Browser RIA제품의 수요가 늘어
날 것으로 예상됨
- 컴포넌트 보다는 국내 특성상 개발도구가 포함된 플랫폼 제품이 시장을
주도할 것으로 전망됨
- 멀티 OS, 멀티 브라우저, 멀티 디바이스(모바일) 충족에 대한 수요가 폭
발적으로 늘어나면서 웹표준 시장도 확장
- 구글, MS,애플, 각 브라우저 회사, 수많은 웹 개발자들의 지원을 받고 있
는 차세대 웹표준 HTML5가 주요 웹구현 기술로 자리 잡을 것임
- 따라서 Pure Web시장이 커지면서 In Browser RIA제품의 수요가 늘어
날 것으로 예상됨
54. One Source, Multi Use
다양한 이기종 H/W 플랫폼 지원관리문서다양한 OS 지원
윈도우즈
MS사윈도우즈계열
OS동작지원
비스타및윈도우7도
지원
Mac OS
iOS
애플사MacOS계열동
작지원
아이폰용OS인iOS에서
동작지원
리눅스
오픈소스Linux계열
OS에서동작지원
태블릿 PC 지원
아이패드 갤럭시 탭
PC 지원
데스크 톱 PC 노트북 PC
스마트 폰 지원
아이폰 계열 갤럭시 계열
스마트 TV
안드로이드
구글사의모바일OS인
안드로이드에서동작
지원
Multi
Device
Multi
Platform
55. 차세대 시스템 구축
Port MIS 구축 차세대 시스템 구축
e-TRM 시스템 구축
품질관리 시스템 구
축
통계 DB 시스템 구축
환경부 국가 온실가
스 종합관리 시스템
구축
u-도시생활 폐기물
통합관리 서비스
차세대 종합정보시스
템
지능형 재난감시 및
상황전달시스템
온실가스정보 시스템통합정보시스템 구축
해운 종합정보시스템
RFID기반 음식물쓰
레기 관리시스템
글로벌통합물류무역
3단계 구축
장기배전설비계획
시스템
웹표준 RIA 인프라
구축
舊한국산재의료원 통
합 정보시스템 구축
국가 온실가스 종합
관리 시스템 고도화
자동차보험 과오납보
험료 환급조회 통합
시스템
공공
웹 청약시스템
코러스 WINAS
한국어능력시험 운영
기반시스템
차세대 시스템 구축 학생정보시스템 구축
자동차보험 진료비
전자청구시스템
차세대 시스템 구축
KT BIT 프로젝트
(차세대 시스템 )
영진대 차세대 시스
템
통신/교육
도요타 DMS시스템
구축
e-catering 시스템 위기관리 시스템 홈페이지 리뉴얼
아시아나항공 차세대
클럽시스템
이지웨어 재구축
기타
차세대 시스템 구축
LIG GA 법인 시스템
구축
차세대 시스템 구축
신한은행 콜센터 어
플리케이션 구축
알프스론 시스템
(온라인 대출 시스
템)
전자투표 시스템 구
축
LIG 모바일 시스템
파일럿 구축
차세대 시스템 구축 대고객 웹서비스 및
정보보호시스템
통합정보시스템
신한은행 글로벌뱅킹
구축
스마트 채널 인프라
(직원용)
프로젝트
테블릿 영업지원 시
스템 1차 구축
테블릿 영업지원 시
스템 2차 구축
인터넷뱅킹
(오픈뱅킹) 리뉴얼
IFRS 시스템 구축
사이버창구 구축
중소기업 보증공제
시스템 구축
LIG손해보험 신사업
구축
한국신용평가 차세대
시스템 구축
금융
홈페이지 및 모바일
시스템 구축
홈페이지 재 구축
마케팅 BI 구축
구축
종합정보 시스
템 구축 모바일 뱅킹 구축
Global Product
Support System
차세대 업무 시스템
구축
기술평가 시스템 구
축
다물 식자재 관리 시
스템
GPSS 고도화
하이닉스 Hy
CRM 구축
태양광 시스템 구축 Klnet 전자물류사업 내부업무시스템 구축
e-planning 프로젝
트
카드마감시스템
하이브리드 앱 구축
(스마트워크)
기간계 시스템 구축
Outbound Mobile
Service
Global ERP EP 시스
템 구축
실적원가시스템 구축
전자지갑시스템 구축
금융 솔루션 구축
제조/유통
포트MIS 구축
광양물류고등학교
56. •웹 표준 기술
•One source, Mult-use (하이브리드 앱 지원)
•Cross Browsing/Cross Platform 지원
•WYSWYG 통합 개발도구 (데스탑/모바일)
•반응형 웹 지원
•웹 접근성 지원
•다국어 지원
•그리드 등 다양한 UI 컴포넌트
웹스퀘어로 가능한 것들
58. HTML5 기반의 RIA 플랫폼 선도 기업“ ”
대표자 어 세 룡
설립년도 2002년 4월 16일
홈페이지 www.inswave.com
(정직원 기준)
인원 현황
기술지원
(19명)
SM/SI
(25명)
영업 (4명)
연구소 인력
(20명)
기타 지원
(7명) 75명
주
소
본사 서울시 구로구 구로3동 182-13 대륭포스트타워 2차 414호
소
데이터 센터 서울시 강남구 역삼동 708-6 LG화재 강남빌딩 2층
직원수 75명 (정직원 기준)
연락처 Tel. 02-2082-1400 (대표전화) Fax. 02-2082-1410
Business
Package
소프트웨어
개발/판매
WebSquare (웹 표준 기반 RIA 플랫폼)
ProWorks (차세대 ALM기반 통합 프레임워크)
시스템 통합 프로젝트 수행
IT Outsourcing, 데이터 센터 운영 및 시스템 관리
시스템 개발 및 유지보수 운영
시스템 통합
시스템 관리
사업 현황
Direct* Insurer (보험 기간계 Package)
Direct* Plus (컨택센터 시스템 Package)
방카슈랑스/보험중개사 패키지 등
59. 발표자 소개
김욱래
• (주)인스웨이브 시스템즈 SW본부 본부장
• HTML5 UI 플랫폼 WebSquare 개발
• 하나은행 차세대 프로젝트 J2EE 프레임워크
(ProWorks) 구축 PM
• wlkim@inswave.com