制作Geek風(fēng)格的投影片

做投影片用什么？如果你的回答是用PowerPoint，有沒有感覺弱爆了？好吧，也許你會說用開源的替代，比如openOffice/Libreoffice。當(dāng)然其實(shí)本質(zhì)都是一樣的，那就是PPT！

從今天開始不要再說、再用 PPT這三個字母了！ 我們現(xiàn)在要重新定義，使用它本來的名稱投影片！，即便是要裝B用英文的話，也要用Slides這個詞！

今天開始，這些都不用了，我將會最有Geek風(fēng)格的投影片制作方法，也就是Markdown+HTML5的方法。先來說這種方式有什么好處：

1. 采用”輕文本標(biāo)記型語言“，主要是Markdown語言。文檔和格式分開，輕便簡單方便操作

2. 采用HTML5技術(shù)，先進(jìn)快捷。在瀏覽器中打開投影片，非常簡單易行。大多數(shù)現(xiàn)代瀏覽器（IE瀏覽器和國產(chǎn)山寨瀏覽器除外）都是支持的。

3. 非常酷，因?yàn)榇蠖嗍怯肑avascript腳本實(shí)現(xiàn)的，所以想要多酷就有多酷，完全自由！

4. 因?yàn)槭蔷W(wǎng)頁格式，不用擔(dān)心中文的問題（與Latex Beamer相比較）。只要瀏覽器能顯示和渲染就行。

5. 易于分享，只要放到網(wǎng)站上即可，看的人不需要安裝任何軟件！所以目前有越來越多的項(xiàng)目在github上弄個網(wǎng)頁來展示投影片。

6. 即便不會Javascript和HTML5的語法也沒關(guān)系，只要用Markdown和一些工具，就能完全自由的制作投影片咯！

7. 像寫代碼一樣寫投影片，非常有Geek Style！

既然是要用Markdown，那么首先用markdown來寫一個演講稿大綱，并把這個大綱按照投影片的方式整理一下：

% 主標(biāo)題
% 演講人
% 日期時間
----
# 投影片的標(biāo)題
## 副標(biāo)題
- 列表
- 列表項(xiàng)**強(qiáng)調(diào)的內(nèi)容**
- 列表項(xiàng)3
----
#又一個投影片的標(biāo)題
1. 有序列表1
2. 有序列表2 *斜體的內(nèi)容*
----
# 第三張投影片
！ [圖片](p_w_picpath/press.jpg)

Markdown+Impress.js

這是我第一個嘗試的辦法，有個項(xiàng)目叫mdpress，它可以實(shí)現(xiàn)Markdown+Impress.js的結(jié)合，可以參考這篇文章。如果不想看英文呢，我就說說如何在Ubuntu下安裝mdpress，簡單至極：

1. 首先安裝需要的包：
   

   sudo apt-get install gem ruby-1.9.1-dev

2. 然后安裝mdpress：

   sudo gem install mdpress

3. 剩下的就是把投影片"編譯"一下：  

   mdpress slides.md

4. 此時會在當(dāng)前目錄下得到一個叫slides的目錄，這個目錄名和上面的文件名是一樣的，然后進(jìn)入這個目錄可以看到一個index.html網(wǎng)頁，用任何現(xiàn)代瀏覽器（Firefox\Chrome\Opera）打開即可。

5. 左右鍵控制翻頁，大多數(shù)瀏覽器用F11來全屏瀏覽。

6. Impress.js還有恨多非?？岬奶匦?，在markdown寫的投影片里用至少三個連續(xù)短線"----"來分割投影片，在短線下面可以寫上一些impress.js提供的特效參數(shù)。最終版，源文件

mdpress項(xiàng)目還有一些示例可以看看，項(xiàng)目主頁：https://github.com/egonSchiele/mdpress

Markdown+Pandoc+Reveal.js

這是最近剛剛發(fā)現(xiàn)的一個，實(shí)現(xiàn)的最終效果和上一個差不多，但是我覺得更炫。這是由Reveal.js提供的，自帶了好幾個主題包，其3D效果非常炫。我這里還要用到Pandoc，所以安裝略有點(diǎn)復(fù)雜?？梢钥催@篇文章和這篇文章。

1. 首先是安裝pandoc。

   sudo apt-get install pandoc

2. 然后需要下載reveal.js項(xiàng)目的代碼https://github.com/hakimel/reveal.js/archive/master.zip

3. 解包，進(jìn)入目錄。然后下載這個gist得到template-revealjs.html文件，放到revel.js項(xiàng)目根目錄下。

4. 準(zhǔn)備好演講用的投影片文件比如slides.md，也放到reveal.js的根目錄下，然后在命令行執(zhí)行：

pandoc -t html5 --template=template-revealjs.html \
--standalone --section-divs \
--variable theme="beige" \
--variable transition="linear" \
slides.md -o slides.html

1. 上面這段有很多參數(shù)，其中theme可以指定reveal.js自帶的主題，transition可以指定reveal.js自帶的切換效果。-o后面的文件名就是“編譯”完成以后的投影片。直接用瀏覽器打開即可。最終效果

2. 用上下左右鍵來翻頁，用ESC可以看到整個投影片結(jié)構(gòu)（這是比impress進(jìn)步的一點(diǎn)）。注意頁面右下角有操作提示，非常方便！

3. 如果以上步驟嫌麻煩，那么reveal.js還開發(fā)了一個完全所見即所得的網(wǎng)站，在線制作投影片，在線播放！ http://www.rvl.io/

結(jié)論

以上兩種方法各有優(yōu)缺點(diǎn)，如果想表達(dá)效果更炫，可以選用reveal.js的方法。如果想要更簡單快捷的制作投影片可以選用impress.js的方法。

總之，無論使用以上何種方法，都遠(yuǎn)好于用PPT！