웹캣소개서 (스마트교육연구소)

Web based E-learning HTML5 Contents Authoring Tool

I. 웹캣(WebCAT)으로 PC, Tablet, Smart Phone 을 한번에
웹캣(WebCAT)으로 저작한 HTML5 콘텐츠
PC
웹 브라우저를 제공 하는 대부분의 디바이스 에서 콘텐츠 구동 가능!!
기기 별 해상도를 고려한 웹캣 고유의 Contents Auto Resizing 기술을 통해
(IE7, 크롬, 사파리, FireFox)
One Source Multi Device HTML5 Contents 제공
태블릿
(아이패드, 갤럭시노트10.1, 갤럭시노트8)
스마트폰
(안드로이드, IOS)
* IE하위 버전(7이상) 지원 가능 (일부 기능 제한적)
http://webcat.openplay.kr 2

II. 웹캣(WebCAT)으로 저작된 콘텐츠의 주요 특
징
기존 이러닝 콘텐츠의 동일한 사용자 경험, 학습몰입도, 심미성 등을 제공
플래시의 다양한 유형의 학습 콘텐츠를 애니메이션 효과와 상호작용 등 이 포함된 HTML5로 구현
[음성 타임라인에 따른 애니메이션 효과 화면] [인터렉션을 기능으로 학습몰입도를 높인 학습 화면] [동영상(애니메이션) 요소를 삽입한 학습 화면]
[의견 입력하기 인터렉티브를 적용한 학습 화면] [퀴즈 지원 타입 – OX형, 다답형(단답형), 드래그형(삽입, 배치), 4지 선다형 등]

http://webcat.openplay.kr
다양한 서비스로의 확
장
plug-in 형태의 다양한
저작 모듈 확장
오직 하나의 소스만 개
발
One Source Multi Device
쉽고 빠른 저작 기능
No Coding
Drag & Drop
Template base
Instruction design
효율적인 개발 환경
Web Based
Cooperation
Resource Share
4
III. 웹캣(WebCAT)의 특장점(1/4)
웹캣(WebCAT)의 특장점
HTML5 콘텐츠를 쉽고 빠르게 저작할 수 있는 최적의 환경 제공
교육용 콘텐츠 비즈니스를 위한 모든 조건을 갖춘 솔루션은 WebCAT뿐 입니다.

효율적인 개발 환경
협업 가능한 Web-based HTML5 Contents Authoring Tool
웹기반 저작 환경과 리소스 관리 기능을 제공하여, 보다 효율적인 콘텐츠 개발을 위한 최적의 환경 제공.
• 웹기반으로 언제 어디서나 접속할 수 있습니다.
• 콘텐츠 리소스의 계정별 스토리지 서비스를 제공합니다.
• 자원, 사용자, 산출물 등을 효율적으로 관리할 수 있는 기능을 제공합니다.

쉽고 빠른 저작 기능
No Coding Drag&Drop, Template base & 교수 설계 프로세스 적용
드래그앤드롭의 WYSIWYG 방식, 콘텐츠 공통 요소의 Template 관리, 교수 설계 프로세스 적용을 통한
보다 쉽고 빠른 콘텐츠 저작 및 유지보수의 용이함.
• 콘텐츠 공통 요소인 템플릿을 활용하여 저작의 편의성을 높였습니다.
• 직관적인 UX와 일관된 UI를 적용하였습니다.
• 콘텐츠에서 자주 사용되는 효과와 기능 요소를 모듈화 하여 보다 편리합니다.

오직 하나의 소스만 개발
One Source Multi Device 지원
HTML5 기반의 한 개의 콘텐츠를 개발하는 것 만으로, multi device 와 cross browsing 지원 가능
• PC에서 mobile까지 서비스를 고려한다면, WebCAT으로 HTML5기반의 하나의 콘텐츠만을 개발하면 됩니다.
• 다양한 버전의 브라우저에서 one-source 콘텐츠로 대응할 수 있습니다.
* 일부 브라우저의 경우 브라우저의 특성상 일부 기능에 제한이 있을 수 있습니다.

IV. 웹캣(WebCAT)의 도입에 따른 기대효과
다양한 서비스 확장
콘텐츠 개발 원가 절감! 유지보수 및 관리의 용이성!
HTML5 콘텐츠 제작의 모바일 콘텐츠에 대한 시장의 요구사항 등 고객사의 Needs를
최대한 수용할 수 있는 솔루션.
비용절감
유지보수/관리
용이성
모바일 트렌드
대응
1. 비용절감
HTML5 전문 프로그래머가 아닌 교수설계자나 디자이너도 손쉽게
콘텐츠를 저작 할 수 있는 환경의 도입.
PC, 모바일 구분 없이 하나의 콘텐츠 개발로, 개발 기간 단축.
2. 유지보수/관리의 용이성
웹캣을 통해 저작된 콘텐츠는 PC, 모바일 구분 없이 단 한번의 수정
혹은 리뉴얼로 작업 완료 가능.
3. 모바일 트렌드 대응
소비자(학습자)들의 모바일 콘텐츠에 대한 Needs가 증가하고
있으며, 이에 대응한 서비스를 제공하기 위해서는 모바일 환경에
부적합한 기존 Flash 콘텐츠가 아닌 HTML5 기반의 콘텐츠가 주목
받고 있음.
WebCAT은 모바일 콘텐츠 Needs에 대응하기 위한 최적의 도구.

V. 웹캣(WebCAT)의 기능 소개(1/6)
웹캣의 주요 기능
HTML5 콘텐츠 개발을 위한 웹캣의 4가지 주요 기능
2. 저작하기
1. 생성하기
4. 관리하기 3. 내보내기
1. 생성하기
콘텐츠 저작에 필요한 기본 구성 요소(콘텐츠/템플릿 생성)
및 실제 콘텐츠 생성 기능(차시/과정)을 제공합니다.
2. 저작하기
콘텐츠 및 템플릿에 대한 저작 기능을 제공합니다.
각각의 레이아웃과 화면 페이지에 대한 상세 편집이
가능합니다.
3. 내보내기
만들어진 콘텐츠를 개별 차시 단위로 혹은 과정 별로
그룹핑하여 export 할 수 있습니다. export시 기기 별
맞춤형 스킨 선택과 손쉽게 진도 연동을 하실 수 있습니다.
4. 관리하기
사용자가 만든 콘텐츠 및 템플릿에 대한 관리 기능과 저작
시 사용한 리소스에 대한 관리 기능을 제공합니다.

생성하기 : 콘텐츠 개발 프로세스
웹캣(WebCAT)을 이용한 HTML5 E-learning 콘텐츠 생성 프로세스
템플릿 지정
•‘템플릿 선택’ 에서
미리 만든 템플릿
선택/ 적용
학습 내용 구성
(콘텐츠 페이지
편집)
•설정한 템플릿이
적용된
편집화면 제공
•선택한 학습 메뉴 별로
각 페이지 단위로
내용 구성
새 콘텐츠 생성
•‘내 컨텐츠 관리’
메뉴에서
생성 가능
•‘차시 복사’ 기능으로
쉽고 편리한 콘텐츠 생성
콘텐츠 속성
설정
•기본 정보 설정 : 과정명
입력
•사용자 스크립트 편집
: LMS연동을 위한 값 편집
학습 구조 편집
•메뉴 갯수 설정
•메뉴명 입력
•메뉴 구성요소
설정
차시 생성 완료
•차시 기본구조
완성
콘테이너 설정
및 내보내기
•저작한 콘텐츠에 대한
내보내기 기능 제공
•PC & 모바일
컨테이너 선택
콘텐츠 완성
•콘텐츠 완성
•언제나 쉽게 재편집 가능
리소스 등록
&
템플릿 생성

생성하기 : 템플릿 개발 프로세스
콘텐츠 배경 및 각 페이지별 디자인 일괄 편집 가능한 템플릿 기능 제공
내 템플릿 관리 새 템플릿 생성
템플릿 속성
설정
템플릿 속성
저장
•‘새 템플릿 만들기’ •설정 완료
템플릿 편집
(배경)
•템플릿명, 개발유형,
키워드
템플릿 편집
(기본 페이지)
템플릿
저장하기
•‘내 템플릿 관리’
메뉴에서
생성, 수정, 삭제 가능
•각 구성요소(페이지)별
미리보기 및 수정 기능
제공
템플릿 완성
•각 페이지별 사용될 공통
혹은 비공통 배경
편집(복수
구성 가능)
•각 학습 유형별 배경 선택
및 구성(타이틀, 구조
등)편집
•학습 유형 추가 가능
•템플릿 완성 •편집 완료한 템플릿 저장
•언제나 쉽게 재편집 가능
리소스 등록

저작하기 : 콘텐츠 저작 화면
No Coding! Drag & Drop!!
웹캣의 저작 기능은 콘텐츠 저작 및 템플릿 저작 기능이 있으며, 저작시 기능 및 화면 구성은 동일함.
1) 편집 요소 리스트 제공
- 학습구조, 구성요소리스트 속성 설정 제공
- 현재 편집 중인 내용, 요소, 속성값에 대해
한눈에 파악 가능
• 속성값 : 텍스트, 이미지에 대한 세부 설정
선종류, 굵기, 크기, 투명도, 컬러, 위치, 회전 등
2) 미리보기 기능 제공
- 저작 중인 콘텐츠/템플릿에 대한 미리보기
기능 제공
- 음성, 동영상 미리보기 기능 제공
3) 객체 삽입 영역
- 이미지, 오디오, 비디오, 텍스트, 문항, 게시판,
인터렉티브, 외부리소스, 자막
- 모듈 단위로 제공하여 드래그&드롭 으로 손쉽게
기능 적용 가능
1
2
3

내보내기 : 콘텐츠 Export
Device별 스킨 선택, LMS 별 스크립트 추가
모바일과 PC, 각 구동 환경에 맞게 디자인된 스킨(컨테이너)을 선택,
고객사 LMS 연동을 위하여 편집된 사용자 스크립츠 추가 하여 콘텐츠 Export
1) 최적화된 스킨 제공
- 모바일, PC/태블릿 겸용 스킨 리스트 제공
- 블로그 스킨과 동일하게 언제든지 변경
가능
2) 콘텐츠 진도 연동 값 설정 부분
- LMS와 진도 연동을 위한 값 설정
(사용자 스크립트 편집/추가)

관리하기 : 리소스 및 콘텐츠 관리
리소스(이미지, 오디오, 비디오 등)에 대한 관리 기능 제공
웹 서버에 올리는 스토리지 방식을 채택하여 언제 어디서나 손쉽게 리소스 등록 및 관리 가능.
사용자 계정 별 혹은 그룹별 콘텐츠/템플릿 저작에 필요한 리소스 관리.
1) 트리 구조의 폴더 생성/삭제
- 윈도우 탐색기와 동일한 트리 구조 제공
- 차시별, 과정별, 계정별로 손쉽게 파일 위치
확인 및 업로드, 수정 등의 관리 가능
- 리소스 관리가 용이하도록 리소스 관리를
위한 폴더 생성 및 삭제 기능 제공
2) 이미지, 오디오 업로드/이동
- 콘텐츠 저작에 필요한 이미지, 오디오
업로드/이동 기능 제공(등록, 수정, 삭제 가능)
3) 비디오 링크 관리
- 콘텐츠 저작에 필요한 비디오 링크 관리
- URL 입력을 통한 손쉬운 등록 기능 제공
4) 그룹(고객사)별 리소스 관리 기능
- 고객사별 웹캣 이용자들(계정)이 사용할
리소스에 대한 통합 관리 기능 제공

VII. 포트폴리오(HTML5 과정)
서울대학교 평생교육원
- 1개 과정 16차시
서울대학교 평생교육원
영산대학교 원격평생교육원
- 3개 과정 117차시
한국인터넷진흥원 KOREA HTML5
경기도여성능력개발센터
- 27개 과정 197차시
한국씨티은행
- 725차시

테크빌닷컴㈜
www.tekville.com
HTML5 는 차세대 웹 기술 표준으로서 이러닝 시장 뿐만 아니라 전체 IT시장에서 가장 큰 주목을 받고 있습
니다.
국내 HTML5 저작도구의 선두 주자이자, R&D 및 마케팅 각 분야 전문가로 구성된 테크빌닷컴㈜ 의
웹캣(WebCAT)이 여러분에게 새로운 가치를 창출해 드리겠습니다.
HTML5 기반의 고품질 이러닝 콘텐츠를 보다 쉽고 빠르게 저작 할 수 있는 솔루션 웹캣(WebCAT)을 선택하
십시오!
서울시 강남구 역삼동 654-3 프라자빌딩 5, 6, 8F
스마트교육연구소 – 전략사업팀
Tel.02-3442-7783(213) / Fax.02-3453-7793
Email : webcat@tekville.com

웹캣소개서 (스마트교육연구소)

Recommended

Recommended

More Related Content

Viewers also liked

Viewers also liked (20)

Similar to 웹캣소개서 (스마트교육연구소)

Similar to 웹캣소개서 (스마트교육연구소) (20)

More from tekville2

More from tekville2 (6)

웹캣소개서 (스마트교육연구소)