做投影片

這篇一開始貼在 buzz, 後來貼在 google+, 這邊稍微重新編輯一下

2011-07-27 4:46:03 AM

前情提要：為了這次 rubyconf.tw/2011 要做新的投影片，
這次想嘗試一下不一樣的作法，因為老是用 apple keynote 做投影片讓我害怕，
害怕的點跟用 powerpoint 半斤八兩。其實我對 keynote 還算是滿意，
雖然要做龜毛投影片有點困難，但要快速做出還可以看的投影片，
算是滿容易的。自己覺得 keynote 最好，其他軟體很少有的功能是
snap 的部份。keynote 的 snap 功能滿好用的，可以很快對齊各種點，
不管是投影片的中心，或是相對於其他物件的中心，都滿容易拉的。

那麼如果要換軟體，換什麼軟體好？後來我自己是滿喜歡 markdown,
寫起來很簡潔，就算是純文字的瀏覽效果也不錯。所以就想找 markdown
轉投影片的軟體。一開始是找到 slidedown

這是在我正式決定改找其他軟體做投影片之前就找到過的。那時候試用
是覺得缺不少東西，版面也很難調整，所以放棄回到 keynote. 這次看了看，
大概還是不能用吧，所以想再找別的。明明之前就有看過幾個所謂 html5 的
投影片做得還可以...

後來看到這個投影片：
The state of the art of nginx.conf scripting
(p.s. nginx 玩成這樣真是沒話說! ngx_openresty)
老林說是用這個做的: slides.htm

雖然他處理了字型的問題還不錯，不過之前試要跑起來有點複雜，文字格式
我也不是很習慣，再加上翻頁會閃動的狀況，至少在我電腦上實在太嚴重了。
想想就還是算了。最後終於找到: landslide

這應該就是那個很炫的 html5 的投影片用的工具。原本居然還是 google 的人
寫的。基本上用起來還滿單純的，也有整合 pygment, 目前我覺得最好的
syntax highlighter. 所以除去小毛病的話，這大概就是我想要的理想方法吧。
用 markdown 寫投影片，用簡單地方式做 syntax highlight, 想我當初在 keynote
裡自己用手一個個上色，還用取色工具確保上的顏色跟 TextMate 一樣，
真是超辛苦的 =_= 而 pygment 我原本也有做一份 twilight 的 theme,
真要用的話也是沒有問題的，雖然可能有版本問題要再稍微調整一下。
pygmentize

landslide 輸出的 html 基本上是打成一包的，embed javascript, css, 甚至連
圖片都用 base64 全部 embed 進去，所以攜帶性應該是還可以。他甚至可以
輸出 pdf! 不過是透過另一個軟體，把 html 再轉成 pdf: princexml
試了一下，基本上結果有點慘不忍睹，算了。要試可以用 homebrew 灌，
參考: Add Prince
brew install https://github.com/adamv/homebrew-alt/raw/master/non-free/princexml.rb
或是新版:
brew install https://raw.github.com/godfat/homebrew/e7bb2f0268859d7fc3d1ebad8b3aac17d7642d6a/Library/Formula/prince.rb

總之，那麼接下來就是尋找畫圖表的工具了。把製作投影片跟圖表的工具
分開，應該也是一個不錯的決定吧。可惜一直不順利。在 google+, twitter,
和 facebook 上詢問，好像只有在 twitter 沒得到回應？很感謝大家。總之
說實在要錢的懶得試，好幾個線上的則有點彆手彆腳，應該能用，但總覺得
好像少了點什麼決定性的關鍵。後來找到了: Dia
用起來是還可以，雖然在 mac 上跑 x11 實在不太順。試做的圖見圖一。

本來是決定要用 dia, 但後來忽然發現輸出的圖片難以決定大小！試了很多方式，
用各種方式輸出，最後有一個方法是輸出 svg, 然後再用 svg2png (brew install svg2png)
輸出即可決定大小。但是還是不對，因為那是按照比例 scale 的，這使得
輸出的圖大小雖然相同，但圖表比例卻不一樣...。

然後感謝 ET Blue, 我試了 LibreOffice, 不過這要控制輸出大小更是...
預設是 A4, 我該說啥，好像完全不適合拿來做圖片。沒試多久就覺得不太對。
不過功能本身是滿強的，要輸出的話應該可以用吧...

最後最後，我試到 InkScape
這套軟體是我目前用過跑在 mac 的 x11 上效果最好的！雖然終究是 x11,
所以用起來還是很怪又不太順，但以 x11 能做到這樣真的已經讓人讚嘆了...
只能說 apple 的 x11 支援還是很差吧，雖然我猜也沒人在意。

結果如圖二。我承認我畫得很醜，但至少滿足我的要求了。能控制輸出大小，
比例不能亂跑，位置可以控制，大概就這樣吧。真是奇哉怪也，明明要求不多，
卻很難找到軟體能符合這些要求。總之我後來就決定用 inkscape.

故事還沒結束。瞧還有圖三吶。既然我妹願意幫我做，何不讓他試試？
一方面應該能做得美觀許多，另一方面我也能省下點時間，老是在
那邊刻圖表我也覺得很煩啊。結果就是圖三了，用 illustrator 做的。
說來 illustrator 好像也沒有比 inkscape 好..。跟他在那邊弄半天，
位置老是沒辦法對齊，也似乎不能輸入座標？輸出成圖片位置又會跳動，
實在是完全不知道該說什麼。雖然說或許這就是 vector 的天限，但輸出
pdf 效果很好，真不知道為什麼輸出圖片就怪怪的，位置會有些微偏差。

嘛，也罷，反正圖表本身我是還滿滿意的，稍微抖動的問題就再說吧...
大不了乾脆整個用 illustrator 做，然後輸出 pdf 就可以有完美結果了 :/
只希望不要再調整位置了，我真搞不懂為什麼 illustrator 要調整位置有
這麼痛苦。說真的，我現在非常認真覺得 flash 是個很棒的繪圖工具...
早知道搞不好乾脆一開始就用 flash 做算了，調位置很容易，可以輸入
座標，東西也能做成 symbol, 不用改一個鬼就要動十個鬼，實在是...

繪圖也要模組化啊！（暈）

總之總之，就這樣用 landslide 和 illustrator 的輸出圖搭配看看...。
希望能順利把投影片做完就是了。

p.s. 結果其實程式都還沒完全寫完哩。 rest-core
不過也罷，反正想看程式的人根本不多... 慢慢來就是了 :s

reference:
google+ thread #0
google+ thread #1