REVEAL.JS
순수 웹기술인 HTML, CSS, JavaScript만으로 만들어진 프리젠테이션 도구로 간단한 HTML 코딩만으로 시각적으로 뛰어난 프리젠테이션을 만들 수 있고, 발표자 도구와 리모트 제어와 같은 고급 기능도 제공한다.
홈페이지
메뉴얼과 다운로드 받는 주소는 아래와 같다.
https://github.com/hakimel/reveal.js
기본사용법
샘플 페이지인 index.html에서 body 하위의 내용을 제거하고 아래와 같은 구조로 코딩한다. 하나의 화면에 표시된 내용을 section에 기록한다. section 하위에는 또 다른 section이 올 수 있는데 하위 section은 수직으로 장면전환된다.
<div class="reveal"> <div class="slides"> <section> <section> </div> </div>
발표자 도구
프리젠테이션 도구들은 발표시간과 현재 발표 내용과 다음 발표 내용을 발표자만 볼 수 있는 기능을 제공한다. 단축키 s를 누르면 이 기능을 웹에서 사용할 수 있다.
Multiplexing (원격제어)
원격으로 프리젠테이션을 제어할 수 있다. 구체적으로는 청중에게 보여줄 화면을 데스크탑에 띄어놓고 발표자는 스마트폰의 화면을 보면서 데스크탑의 프리젠테이션을 제어 할 수 있다. 다음 주소를 방문해서 secret와 socketId를 획득한 후에 이 값을 소스코드에 입력한다. Reveal.initialize의 인자로 전달되는 객체에 아래 내용을 추가한다.
multiplex: { id: '3d86709e1c6d671d', secret: '13654708940992018697', url: 'revealjs.jit.su:80' }
dependencies 배열에 아래와 같이 객체를 추가한다.
{ src: '//cdnjs.cloudflare.com/ajax/libs/socket.io/0.9.10/socket.io.min.js', async: true }, { src: 'plugin/multiplex/client.js', async: true }, { src: 'plugin/multiplex/master.js', async: true },
이해를 돕기 위해서 그림을 첨부했다.