极客风---尝试用代码做一份演示文稿吧

什么是“用代码做演示文稿”

用代码写类似于PPT的演示文稿，大多数都是在底层基于HTML来实现的，利用Markdown风格的语言，借助成熟的模板、软件，可以快速的制作一份漂亮的演示文件。

用代码写演示文稿，优势何在？

引子

打个比方，PowerPoint就像是一把大刀，百儿八十斤，死沉死沉。

• 往大了说，拿它杀鸡宰牛完全不虚。笔者拿她做过游戏、做过视频动效，是一个强大可靠的工具。
• 往小了说，雕个萝卜花也不是不可以，就是端久了实在累胳膊。假如说只想做个素色的文稿，还得一点点加文本框…而笔者又是个不折腾会死星人，各种各样的插件塞了满满一排。光是打开就很费时间了。

而代码写的演示文稿，就像一把小折刀，应付日常的任务绰绰有余，然而要是爱折腾，也不是不可以用她干票大的。

敏捷快速

设想这样一种情况，晚上翻看ddl，突然发现一份PPT还没有做，从0开始写PPT费时费力，随手套模板也可能遇上大大小小的问题。
又或者你心血来潮，打算顺着思路做一份PPT，却发现冗杂的格式调整，让你的热心和灵感一点点丢失。

基于HTML的PPT制作隐藏了大部分繁琐的格式控制，在做PPT的时候不需要过多考虑美观与布局，你唯一需要做的就是写下自己的灵感，自动模板会帮助你完成剩下的一切。
当然，隐藏了格式并不代表完全不能对格式进行随心所欲的操纵，许多模板内置了格式控制代码块，完全可以进行深度定制。

简单易上手

大部分模板的语言都是Markdown风味的，一分钟瞄一眼格式控制符号就能快速上手，五分钟读一下格式控制就能迅速进阶，多做几份，你就是大佬。
这也意味着，当你写完了一份Markdown文档，稍加修改就可以将文档轻松转化为演示文稿。一文两用，极度舒适。

代码写演示文稿，适用于什么样的情景

学术报告

学术报告堪称“花里胡哨星人的禁区”，越是硬核的报告，演示文稿可能越朴素。ban掉动效、装饰组件的情况下，PPT上场显然就有些多余。用代码实现的演示文稿则表现得又快又好。

创新场合

这里，是 代码实现演示文稿 弯道超车的地方。PowerPoint属实强大，但也有难以做到的地方，比如转场3D，更加风骚的特效，而这些却正是js和css的主场。
来欣赏一下这两个花枝招展的家伙，这种要多骚气有多骚气的玩意，往往能在千篇一律的模板里让评委眼前一亮：

目前较为成熟的代码演示文稿软件/模板

Yu-Writer Pro

点击进入官网
这款工具是一个国人出品的，极其完善的MarkDown写作平台。写演示文稿是这玩意下辖的一个强大的功能。该平台在Markdown的支持上可以Typora打的有来有回。

语法简单，文档详细，能基本还原PowerPoint的静态显示部分，支持实时显示预览，同步滚动，最重要的一点是，它不需要任何修改就可以直接进入演示，是文档与演示文稿的通用体。

软件可以免费下载，不氪金已经可以满足大多数基础功能，氪金激活后可以解锁所有功能，并去除演示时的水印，有学生优惠。（别想着白嫖，一方面网络上基本不存在破解版，另一方面国人的软件，有条件的话支持一下比较好）

x1 然而没法直接从剪贴板贴图
x2 作者 @河马大佬 花式拖更
—来自笔者的碎碎念

Remark

点击观看demo
点击进入下载
轻量而不失强大的HTML模板，在格式的支持上没有过多选择，但演示模式却极为强大。她基本实现了PowerPoint的所有演示功能，计时，演讲者模式，提示文本等（除了激光笔和实时笔迹暂时不支持，不过用处不大，因为激光笔可以用光标代替，实时笔记可以配合截图工具实现）
在实时渲染上也极为优秀，所有改动在0.5s内基本都能完成更新。

学术报告类演示文稿必备佳品！

不过在Latex的渲染上好像有bug，似乎渲不出来…
—来自笔者的碎碎念

Remark-it

点击观看demo
点击进入下载
这玩意是国人在Remark基础上添加各种组件，升级融合的产物，打个比方，就像个武装到牙齿的瑞士军刀，堪称代码风演示文稿对抗正统PowerPoint的种子选手。
继承了Remark的所有优点，添加的组件让花里胡哨的式样成为可能，唯一的问题就是渲染比较费时间，建议先用楼上Remark写个初版，再进来 加 特 效。而且建议不要自动刷新，不然改代码的刷新空窗能逼死人。

Impress.js

点击观看demo
点击进入下载
8说了，贼几把炫酷。唯一能和这玩意的换场动效抗一波的，应该只有万彩家的动画大师了。
项目WiKi里有句话过于真实：

WARNING
impress.js may not help you if you have nothing interesting to say

Code Surfer

码农展示代码专用装逼神器…
然而这玩意渲染起来太慢了，建议写之前仔细阅读语法规则，写完了渲染一波带走，免得出问题又要重新渲染。

点击观看demo1
点击观看demo2
点击进入下载

关于代码演示文稿的导出工具

由于这些玩意实现的演示文稿过于妖艳，浏览器的打印网页功能已经完全伺候不了他们了。这种时候需要脚本的力量。

DeckTape

点击进入下载
禁止执行脚本的解决方案
适用于Remark系列的演示文稿系列，有动效的还是洗洗睡吧。
路径还是建议用单引号括起来。不然玩意有空格会识别错误。

碎碎念-关于笔者的演示文稿观

很多人瞧不起用PowerPoint模板的行为，认为这样老套，俗气，没有自主性和创新精神。这种观点在我看来是狭隘的。
认为模板老套俗气，也许因为他们遇到的模板都比较廉价。没错，挑PPT模板也是一门学问，并不是随随便便拽一个模板，就能拿去玩万能套娃的。模板的配色、布局等各种细节都决定了他的适用范围。而这往往需要一定的美学功底，才能牢牢驾驭。挑模板，以及对模板进行适应性改造的过程，就是自主性和创新精神的最佳体现。
同时，笔者作为学生，演示文稿的用途基本都是拿去答辩，非商业化的行为也基本回避掉了大部分 可能因为模板里字体和图片 而产生的版权纠纷（再说即使自己从零做起，一不小心也会有版权风险）。
因此，即使是热爱制作演示文稿的笔者，一般情况下也套模板，怎么简单怎么来，追求高效率的投入产出比。这里的模板，是作为工具出现的。只有静下心来有闲工夫的情况，或者遇到了值得认真起来的场合，才会从零开始，一点点慢慢做设计。而此时的演示文稿，就不仅仅是一个冷冰冰的工具，而是一个有血有肉有温度的艺术品。