일상다반사

HTML5 프리젠테이션 툴

빠릿베짱이 2015. 8. 31. 09:19
반응형

1. Reveal.js

Github에서 당당하게 가장 많은 인기를 끌고 있는 웹 프리젠테이션 도구로 상세한 문서화 및 다양하고 신규 기능이 계속 업데이트 되고 있음

* 데모: http://lab.hakim.se/reveal-js/

* 소스코드: https://github.com/hakimel/reveal.js


2. Impress.js

CSS3의 3D 전환 효과를 이용하여, Prezi와 유사한 동적이고 3차원 전환 프리젠테이션을 할 수 있는 도구임

* 데모: http://impress.github.io/impress.js/#/bored

* 소스코드: https://github.com/bartaz/impress.js

* 에디터 : https://github.com/tantaman/Strut

* 에디터 : http://strut.io/editor/

c.f.) WebGL을 이용한 프리젠테이션 도구로 마우스로 PT 이동 및 줌인/아웃도 가능함

* 데모: http://fhtr.org/webgl_presentation.html#9

* PT 에디터: http://fhtr.org/editor (오른쪽 상단의 Edit를 누르면 다양한 효과 가능)

* 소스코드: https://github.com/kig/kig.github.com/blob/master/webgl_presentation.html


3. Google HTML5 Slides

HTML5 발표 도구의 시초로 구글에서 HTML5 데모를 하기 위해 만들었던 것으로 유명해져서 Google I/O에서 발표 시 사용되고 있음

* 데모: http://io-2012-slides.googlecode.com/git/template.html

* 소스코드: http://code.google.com/p/html5slides/ (2012년 버전 https://code.google.com/p/io-2012-slides/)


4. Shwr.me

전체 슬라이드 미리보기를 할 수 있고, 바로 프리젠테이션으로 들어갈 수 있는 장점 있음

* 데모: http://shwr.me/

* 소스코드: https://github.com/shower/shower


5. 그 밖에 추천 도구


1) Shwr.me: 전체 슬라이드 미리보기를 할 수 있고, 바로 프리젠테이션으로 들어갈 수 있는 장점 있음

* 데모: http://shwr.me/

* 소스코드: https://github.com/shower/shower


2) Deck.js: HTML 발표 도구 중 유명했으나, 최근에는 업데이트가 계속 되지는 않고 있음

* 데모: http://imakewebthings.github.com/deck.js/introduction

* 소스코드: https://github.com/imakewebthings/deck.js


3) Mozilla Template: Mozilla 커뮤니티에서 사용하고 있는 발표 템플릿

* 소스코드: https://github.com/codepo8/mozilla-presentation-templates


참고) 생활 코딩의 HTML 온라인 배우기 http://opentutorials.org/course/11


퍼옴 - 

HTML5 프리젠테이션 도구를 아시나요?외부 강연을 하다보면 발표 자료를 자주 만드는데, 대부분 MS PowerPoint나 Apple Keynote 같은 것을 사용하게 됩니다. 그리고 나서 Slideshare나...

Posted by 윤석찬 on 2013년 8월 28일 수요일


반응형