reveal.js

Posted by TJ Wei on 星期四, 4月 03, 2014 with No comments

最近幾次演講的投影片,試著使用 reveal.js,Reveal.js 是 HTML based 的投影片工具
我最近的幾個投影片可以在 http://b81.org/s 找到。
Reveal.js 的
優點:

  1. 預設的 3D 旋轉換頁還挺有質感的。
  2. 支援 Markdown語法,可以把焦點放在內容上。如果習慣泛高橋流/類高橋流的簡報方式,寫起來還挺快的。
  3. 上下左右的二維、二階層簡報編排邏輯,比傳統的直線式簡報拓樸結構要容易整理。 不需要詳細說明的內容,可以很自然的按右鍵跳到下一個主題。
  4. 支援 code 的彩色語法,還有 MathJax 顯示數學。
  5. 因為是 HTML/CSS/Javascript based, 所以直接可以用這些來擴充、顯示所以有他們可以顯示的東西。
  6. 支援講者小抄功能。
  7. 支援 leapmotion 之類體感操控。


缺點:

  1. 放大縮小、換頁,會干擾一些 javascript module 以及  plugin 的功能。有時候也會干擾 CSS。
  2. 不像 Powerpoint 或是 Keynote 等,可以用所見即所得的方式編寫。
  3. MathJax 要支援黑底白字有一點麻煩。而且 Render 似乎不是很可靠。
  4. 預設的 syntax highlight 字有點小。
  5. 不同瀏覽器有時候會有差異,測試時要小心。
  6. 很懷疑如果亂搞 javascript , pdf export 能支援到什麼程度。

然後我發現一下子還真的想不到有什麼太大的缺點。

因為我的投影片中,常常會有數學式子,所以之前很常用 LaTeX 的 Beamer, Beamer 中也很容易做程式碼的 Syntax Highlighting, 比方我之前 COSCUP 的投影片
但 Beamer 如果要放動畫或者其他效果就比較差了。

以下在我最近的投影片中的一些實驗:

  1. markdown 中放數學式子 http://b81.org/s/imo_algebra1.html#/1/5  (主要是不要讓 a_{x} 這樣的東西被 markdown 吃掉。)
  2. GIF 動畫 http://b81.org/s/from_star.html#/3 (按往下)
  3. 放互動式的 Python 程式碼。 (同上,繼續往下,用 Ctrl-Enter 執行程式碼)
  4. 放遊戲 http://b81.org/s/imo_algebra1.html#/4 (不過只有在 Firefox 排版正確)
  5. 放表格 http://b81.org/s/math2.html#/7/1 這個是拿來當計分板的,而且是用 livescript 寫的。
如果放入 d3.js,看起來應該也很有趣。
有興趣的話,不妨看看 html source,可以看到一大堆 markdown。