如何把思維導圖秒變成幻燈?

場景

有一天給研究生上課,幾個學生分別上講臺展示仿真建模作業。

我打開筆記本電腦,一邊開著仿真工具驗證他們的代碼,一邊用思維導圖軟件記錄他們講解中出現的問題。

問題過多的時候,我示意學生下來。走上講臺,插上優盤,打開了一個幻燈。幻燈圖文并茂,針對剛才模型解釋和展示中的問題一一作了反饋。

學生們看得目瞪口呆。

倒不是因為我的幻燈做得有多么漂亮,而是他們心里有個大大的疑惑:

“老師,這個幻燈您是剛剛現場做的?”

“對啊。”

“啊?!……這么快?”

面對學生將信將疑,我把他們叫到了我的座位那里,打開筆記本,給他們看了我的思維導圖。

思維導圖的結構很清晰,我把他們講解中用到的代碼做了截圖,連同一些搜索到的關聯材料一起放在了思維導圖中。

看到這里,他們很淡定。因為現場做個記錄關鍵點的思維導圖,他們認為自己完全能夠勝任。

之后,他們就不淡定了。因為我給他們展示了如何一鍵把這個思維導圖變成了漂亮的幻燈片。

痛點

其實不光是老師,各種知識工作者總會遇到需要做幻燈的場景。

許多人都學會了秘笈——用思維導圖來整理思路。這是做幻燈之前準備材料的一種高效方式。

但是傳統軟件之間缺乏必要的溝通渠道。你畫好了思維導圖,等到制作幻燈的時候還得重新把導圖里出現的結構和內容填入幻燈工具中。

你做了兩遍工作,效率當然不夠高。

優秀的思維導圖軟件早就看到了用戶這一痛點,因此iMindmap等少數專業思維導圖工具都有一個重要功能——把思維導圖用幻燈形式展示。

但是一來這樣的工具都很貴,二來你只能在思維導圖軟件內播放幻燈。

這就給你帶來了很大限制——你無法像攜帶ppt文件一樣,一個優盤帶著隨處走隨處展示。這樣的結果有時很糟糕。想想一下,如果你興沖沖帶著Macbook和HDMI轉換插頭跑到會場做準備,卻發現人家只提供VGA接口……

你莫非還要當場下單買個iMindmap的新許可證不成?

這個痛點困擾了我很長時間。直到某一天,我突然發現有些思維導圖工具開始支持一種格式——文本包(textbundle)。于是我立即找到了解決的辦法。

本文我先給你介紹如何一鍵把思維導圖轉換成幻燈。咱們從配置開始,然后做個實際樣例展示。

如果你對原理感興趣,再往后看相關的知識介紹。

好了,我們開始做配置準備工作吧。

配置

請注意,因為思維導圖工具MindNode僅支持macOS和iOS,不支持Linux和Windows,所以本文僅展示macOS系統下的操作流程。如果后續發現支持其他操作系統,且可以生成文本包的思維導圖應用,我們會迭代更新本文。

我們一共需要安裝4款軟件。

MindNode

首先,你需要下載安裝MindNode。地址在這里

點擊頁面上的“Buy”按鈕即可轉到App Store購買應用。比起iMindmap來,價格還是便宜許多的。

唯一需要交費的軟件,你已經擁有了。后面的工具統統都是免費的了。

Anaconda

?請到這個網址 下載最新版的Anaconda。下拉頁面,找到下載位置。根據你目前使用的系統,網站會自動推薦給你適合的版本下載。

請注意,下載頁面區隔出左右兩欄,分別對應套件不同的Python語言版本。左側是3.6版,右側是2.7版。請務必選擇2.7版本,不然后面的流程可能會出現報錯。

?下載下來的文件是個以pkg作為擴展名的包裹,雙擊它,然后根據提示一步步安裝就好了。全中文界面,非常友好。

Pandoc

請到這個網址下載Pandoc工具。

下載其中的pkg擴展名安裝包

下載好后雙擊pkg文件安裝,方式與Anaconda大同小異,此處就不重復了。

mindnode2slide

這是我自己編寫的Python和Automator腳本程序,請到這個網址下載。

下載之前,別忘了點擊上方的“Star”按鈕,鼓勵我一下。

點擊綠色的“Clone or Download”按鈕。

選擇其中的Download Zip選項。

瀏覽器會幫助你下載“mindmap2slide-master.zip”文件。

下載后,請把它解壓到系統的“下載”(Downloads)目錄。請一定要存儲到指定的位置,并且不要修改目錄名稱。否則后面會報錯。

可以看到,目錄下面有一個mindemap2slide文件,在我這里圖標是個小機器人。把小機器人拖動到macOS的dock上面,成為一個快捷按鈕。

到此為止,準備工作完全就緒了。

嘗試

配置好環境后,我們來動手實際做一張思維導圖,并且轉換為幻燈。

我們打開MindNode,做一個測試樣例。

注意這里的層級,是有講究的。

思維導圖的根節點是大標題。

一級分支是節名稱。一般幻燈內容比較多的時候,分成幾個節(部分)來講,會比較清晰。也容易讓聽眾明白當前的進度。

二級分支,是幻燈頁面的標題。

三級分支,是幻燈里依次出現的每一條目。

插圖可以放在三級分支上,就會和文字條目一起依次出現。而如果像我這樣放在二級分支上,就會被單獨做成一張全屏圖片幻燈出現。我比較喜歡后一種方式,因為這樣圖片展示可以更全面和美觀。

思維導圖做好之后,選擇菜單欄里的“導出至”按鈕。

子菜單中選擇“標記”。

這時會出現導出菜單。

注意勾選“包括圖片”,然后選擇“導出”。

對話框里面,默認保存到文稿,名稱和思維導圖根節點名稱一致。我們就按照默認的設置確認即可。

于是“測試幻燈.textbundle”文件就出現在了我們的文稿目錄下。

好,下面就是見證奇跡的時刻了。

我們把它拖拽到dock中那個小機器人圖標上。請參看以下gif動圖。

瀏覽器自動開啟,把轉換好之后的幻燈打開了。

點擊F鍵,進入全屏播放模式,可以用鍵盤上的左右方向鍵來控制播放。

幻燈第二部分播放的例子請見下面的動圖。

很激動吧?以后你就可以這樣做幻燈了。

內容修改全部都可以在思維導圖里完成,改好后重新導出并拖拽,一個更新迭代的幻燈版本就搞好了。

如果你打算把幻燈攜帶出去,怎么辦?

很簡單,回到你的mindmap2slide-master文件夾下面,你會看到比原先多出來了2個文件夾。

其中的export文件夾就是你的幻燈了。把它整個兒拷到優盤上,帶走就好。

到了別的電腦上,只要打開支持HTML5的瀏覽器,把export目錄下的slide.html文件拖入瀏覽器,就可以正常播放了。

瀏覽器我推薦Google Chrome。Firefox和Safari可以作為備選項。其他的瀏覽器我沒有測試過,歡迎你把測試結果告訴我。

魔法

如果你對實現的技術細節不感興趣,可以跳過本節,直接看“討論”章節。

這么有求知欲?好吧,那咱們講講這個“秒變幻燈”的效果是怎么來的。

剛剛我們提到,MindNode支持了文本包(textbundle)。說白了,文本包就是打包了的Markdown。

這個名字,就不那么陌生了吧?

對,如今使用Markdown來寫作的人,可是越來越多了。但如果你用Markdown寫作,可能也會遭遇過痛點——圖片。

你在甲工具里編輯Markdown,想全文拷貝到乙軟件做個備份,圖沒了。

你寫好了一篇文章,興沖沖發布到網上,圖沒了。

你把寫好的文章共享拷貝給朋友,圖又沒了……

Markdown的插圖,是用語句指定了圖片的位置。如果指定的是本地位置,遠程就無法正常顯示。如果指定的是相對位置,哪怕Markdown文件在本機一挪動,圖片位置也會失效。

面對這一痛點,有聰明人于是想出來一個招數——打包。就是把圖片和Markdown文本文件捆綁在一起,打成一個包,形成一種通用格式。這樣,把文章帶走,或者在不同應用間轉移,只需要拷貝或者共享這樣一個包,就可以了。

這個文本包,英文名稱叫做TextBundle。人們還專門建立了一個網站,說明目前哪些工具支持該格式。

思維導圖軟件MindNode支持文本包,就意味著你在思維導圖里面插入的各種圖片,都可以轉移到其他軟件中去。

可是我要做幻燈啊?Markdown插圖倒來倒去有什么用?

用處大了。

因為本文中展示的幻燈,不是PPT,而是漂亮的HTML5文件。沒錯,你剛才做了個靜態網頁出來。

我們利用的幻燈工具,叫做Reveal.js。它可以渲染HTML5文件,把它們用幻燈片的方式一頁頁播放。

你可以隨心所欲更換自己喜歡的主題。只需要修改一個字符串,幻燈的樣子就大不相同。

可以是這樣。

也可以是這樣。

可是你會發現,從Markdown到HTML5,中間好像有個缺失鏈條啊!

沒錯,把Markdown文件轉變成HTML5格式,我們使用了格式轉換界的瑞士軍刀了——Pandoc。

它可以在數不清的文件格式之間,輕易轉換。

看不清?那就對了,它支持的格式太多了!

有了Pandoc,我們的轉換鏈就補齊了:

MindNode -> textbundle (Markdown) -> Pandoc -> HTML5 -> Reveal.js幻燈

看著都頭暈吧?每次要是都讓你這樣做一遍……

換做是我,恐怕也跑回去用PPT了。

我們使用電腦,就是要讓它替我們做自己懶得做的事情。否則要它干嘛?

而電腦最善于處理的,恰巧就是這種程序化的瑣碎事務。

將思維導圖到幻燈的轉換流程自動化串接起來,我們用到了Python。

Python如今很火。大家都知道它可以用來做爬蟲、做數據分析,甚至是做網站。但是不要忘了,作為腳本語言,它從來都是一種非常好的膠水工具,可以連接各個環節,幫我們把流程自動化完成。

只是即便一行命令就可以完成自動化過程,許多人恐怕還是不愿意跑到命令行下面敲字兒。所以我又在Python腳本上面,包裝了macOS自帶的Automator腳本。

其實,它里面只有一句話而已。

這就是為什么你不能在安裝的時候選擇其他的目錄。否則傻乎乎的Automator小機器人根本就找不到Python腳本了。

如果你對實現的技術細節感興趣,可以查看源代碼。這個腳本陸續寫了很長時間,其中Markdown到幻燈的轉換還是我剛學Python的時候寫的。如果你發現其中有很多蹩腳的代碼,那很正常。我這個懶人實在懶得改了,能湊合著用就好。歡迎你幫我改進。

如果你愿意把它開發成為更好用的Web服務,歡迎在留言區或者私信跟我聯系。

討論

你平時是怎么做幻燈的?這種思維導圖秒變幻燈的方式你喜歡嗎?你有沒有更高效的幻燈制作方法?歡迎留言,把你的思考分享給大家,我們一起交流討論。

如果你對我的文章感興趣,歡迎點贊,并且關注我的文集《玉樹芝蘭》。

如果本文可能對你身邊的親友有幫助,也歡迎你通過微博或朋友圈分享給他們。讓他們一起參與到我們的討論中來。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,119評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,382評論 3 415
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,038評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,853評論 1 309
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,616評論 6 408
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,112評論 1 323
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,192評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,355評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,869評論 1 334
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,727評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,928評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,467評論 5 358
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,165評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,570評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,813評論 1 282
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,585評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,892評論 2 372

推薦閱讀更多精彩內容

  • 文/晚晴 9月末做了次思維導圖的線上分享,主題是“如何用思維導圖提升工作和生活效率”,現在回看,講的內容還蠻初級的...
    落櫻晚晴閱讀 10,462評論 12 258
  • 我為什么使用思維導圖? 每個人缺的不是「時間」,而是「注意力」。 如果有一個完美的時間記錄儀,用來記錄每個人花在每...
    harrytc閱讀 11,739評論 6 4
  • 紅樓夢整個在寫“癡”這個字,不知道為什么林黛玉一直哭,沒有辦法解釋,如果你家里有個女兒是這樣子,如果你是個老師...
    望京屯子coding沐閱讀 628評論 0 0
  • 失物招領處有把劍 把那個劍送給那個刻舟的人吧!我們都是刻舟人。 瑜哥兒晚上十點打電話給我,問她是不是做錯了什么。惹...
    e4b685b8fdc5閱讀 192評論 0 0
  • 剛剛才得知,你是13年畢業的,那我可應該叫你老老老學姐了,我一直以為你也大四呢!我才開始工作一個月,就已經覺得自己...
    蔣二十閱讀 183評論 0 0