마스터 부제목 스타일 편집

2015-09-21 1

SMART HTML5!

HTML5 기반 웹 표준 UI/UX구축 개발 솔루션

마스터 부제목 스타일 편집

2015-09-21 2

Co

nte

nts

01 웹 기술 동향 02 HTML5의 활용 03 웹스퀘어5 소개

마스터 부제목 스타일 편집

2015-09-21 3

01 웹 기술 동향

마스터 부제목 스타일 편집

2015-09-21 4

사물 인터넷

사용자 화면, 관리화면 등 PC/모바일 통합 UI 필요

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 5

웨어러블 디바이스

갤럭시 기어

AppleWatch

Google Glass

웨어러블 디바이스는 몸의 착

용 부위에 따라 안경, 시계,팔

찌, 신발/깔창, 반지, 허리벨트,

팔뚝 밴드, 목걸이, 이어셋, 의

류, 배지 등 다양한 종류가 있

다.

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 6

One Source Multi Use

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 7

N-Screen

Multi Device

반응형 웹(Responsive Web)

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 8

플러그인 퇴출 가속화

" 플러그인 퇴출을 위해 발벗고 나선 웹 브라우저 개발사 "

구글은 올해 9월 출시 예정인 크롬 45 버전(현재 43 버전)에서 NPAPI 자체를 크롬에서 퇴출시킬 예정

모질라 재단도 파이어폭스에서 NPAPI가 자동 실행되는 것을 막았고, 이후 NPAPI를 제거하겠다고 공지

오페라 역시 웹 브라우저 엔진을 크롬과 공유하는 만큼 크롬과 비슷한 시기에 NPAPI를 제거할 가능성이 높음

어도비 역시 플래시에 대한 지원을 하나씩 중단하며, HTML5로 전환을 권유

Active-x 퇴출

액티브 X와 같은 낡은 규제에 안주한 결과 국내소비자의 해외직구는 폭발적으로 느는데 해외소비자의 국내 역 직구는 걸음마 수준입니다.

- 박근혜 대통령 신년 기자회견 -

"정부의 지향점은 민간에서 가급적 HTML5 솔루션을 도입하

고 비표준 기술을 더이상 쓰지 않도록 장려하는 것"

NPAPI 퇴출

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 9

One Source Long Use " MS의 본격적인 One Platform 정책 가시화 " MS는 오는 7월 말 윈도10과 함께 출신되는 최신 웹 브라우저 '엣지'는 인터넷 익스플로러 11보다 한층 강경한 정책을 편다. 액티브X 뿐만 아니라 실버라이트까지 설치할 수 없도록 함.

MS는 윈도10과 함께 출신되는 최신 웹 브라우저 '엣지'는 액티브X 뿐만 아니라 실버라이트까지 설치할 수 없도록 할 예정

실질적으로 자사가 개발한 모든 플러그인을 포기함.

2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013 2014 2015 2016 2017 2018 2019 2020

마이크로소프트 윈도우 및 브라우저 버전업 주기와 EOS(End of Support) 시점

IE6 IE7 IE8 IE9 IE10 IE11

XP Vista 7 8 8.1

엣지

10

XP EOS

7 EOS

Vista EOS

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 10

웹 3.0

웹3.0은 웹2.0의 한계를 넘어 우리에게 꼭 필요한 정보를

찾아서 분석한 후, 원하는 정보를 알려주고 보여줄 수

있도록 고안된 웹 기술

웹 1.0

•인터넷 등장

•일방적 정보 전달

•미디어

웹 2.0

•개방형 인터넷

•참여, 정보 공유

•플랫폼 (생산)

•유투브

웹 3.0

•지능형 인터넷

•씨멘틱 웹

•개인 맞춤형

•HTML5

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 11

웹 기술 동향의 공통점 ?

호환성 좋은 기술이 필요

Plug-In 기술을 대체 할 수 있는 기술이 필요

2014년 10월 28일

W3C총회에서

HTML5 표준 확정

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 12

별도의 플러그인 없이도 웹 자체에서 다양한 어플리케이션을 표현 할 수 있는 기능이 대폭 향상

Multimedia

비디오 및 오디오 기능을 자체적으로 지원

3D, Graphics & Effects

다양한 2차원 및 3차원 그래픽 기능을 지원

Offline & Storage

네트워크 미지원 환경에서도 웹 이용을 가능하게 함

Device Access

카메라, 동작센서 등의 H/W 기능을 웹에서 직접적으로 제어

Web Socket

웹 (클라이언트)에서 서버 측과 직접적인 양방향 통신 가능

Geo-Location

GPS없이도 단말기의 지리적인 위치 정보를 제공

Styling Effects

글씨체, 색상, 배경 등 다양한 스타일 및 이펙트 기능 제공

Semantics

웹 자료에 의미를 부여하여 사용자 맞춤형 검색 제공

2014년 10월 28일 TPAC 행사에서 공식 스펙으로 확정됨 HTML5 스펙을 지원하는 웹브라우저에서 동작함

웹 기술 동향 01

마스터 부제목 스타일 편집

2015-09-21 13

02 HTML5의 활용

마스터 부제목 스타일 편집

2015-09-21 14

최근 웹 UI 개발 시 고려사항

• 웹 페이지가 아닌 웹 어플리케이션 개발

• 원소스 롱유즈 (상위호환성)

• 원소스 멀티유즈 (멀티플랫폼 지원)

• PC, 모바일 동시 지원 (반응형 웹 지원)

• 검증된 기능 및 성능 지원

• 개발 생산성 (통합개발도구 지원)

• 손쉬운 수정 및 반영 (유지보수 편의성)

• UX를 위한 다양한 UI컴포넌트 지원

• UI 표준화 및 코드 표준화

HTML5의 활용 02

마스터 부제목 스타일 편집

2015-09-21 15

HTML5 적용 시 문제점

복잡한 기술구조

낮은 개발생산성 기술지원

낮은 코드표준화

낮은 유지보수 효율성

•스크립트 남용(성능저하) •소스 가독성 저하 •악성코드 생산(보안)

문제점

HTML5의 활용 02

마스터 부제목 스타일 편집

2015-09-21 16

솔루션

HTML5의

효과적인 개발과 유지보수를

위해서는

솔루션 도입이 필요!

HTML5의 활용 02

마스터 부제목 스타일 편집

2015-09-21 17

03 HTML5 UI 플랫폼 소개

마스터 부제목 스타일 편집

2015-09-21 18

WebSquare5(웹스퀘어5)

2008년 9월

2010년 2월

2011년 9월

2014년 4월

2015년 2월

웹스퀘어5 SP1 출시

- 최신 선진 기술 적용

- 개선된 개발환경

- 성능 향상

국내 최초 웹 표준 UI 플랫폼 출시

"웹 표준 UI 플랫폼 웹스퀘어"

웹 표준 UI 플랫폼 최초 모바일 웹 지원

다양한 모바일 웹 지원

웹스퀘어 하이브리드 앱 플랫폼 출시

One Source Multi Use 지원

웹스퀘어5 출시

HTML5 UI 플랫폼

HTML5 UI 플랫폼의 소개 03

마스터 부제목 스타일 편집

2015-09-21 19

제품 개요

Open Architecture

HTML5 Standards

No ActiveX ! No Runtime ! Only Standard !

Any WAS, Any Framework, Any OS 지원

오픈 소스 재활용을 통한 개발 생산성 향상 지원

다양한 오픈/상용 라이브러리의 손쉬운 연계 지원

다양한 보안솔루션 연계 지원

One Source Multi Use Cross Browsing Multi OS / Multi Device Responsive Web Canvas, 3D, Web socket,

Web storage 지원

Easy development

강력한 개발 편의 기능을 통해 획기적인 개발 생산성을 보장

코드 매크로 Snippets User Defined Component Data Collection Inheritance easy-to-use API Grid를 포함한 60여개의 UI 컴포넌트 제공

High performance

Single Page Web Application 엔진 최적화 대용량 데이터 처리 지원 XML, JSON, CSV 등 다양한 데이터 포맷 지원

압축 지원

HTML5 UI 플랫폼의 소개 03

마스터 부제목 스타일 편집

2015-09-21 20

제품 특장점

HTML5 UI 플랫폼의 소개 03

마스터 부제목 스타일 편집

2015-09-21 21

Responsive Web + Adaptive Web

PC 화면

태블릿 PC 화면 스마트폰 화면

HTML5 UI 플랫폼의 소개 03

마스터 부제목 스타일 편집

2015-09-21 22

Thank you

홈페이지 : http://www.inswave.com

웹스퀘어 : http://www.websquare.co.kr

기술지원 : https://www.inswave.com/support

Smart HTML5