无论你喜欢还是讨厌,演示文稿都是学术界和商界生活的重要组成部分。传统上,创建演示文稿意味着使用微软的 PowerPoint,但苹果的 Keynote 和 LibreOffice/OpenOffice.org 的 Impress 也是可靠的替代方案。所有这些应用程序的问题(除了前两者的闭源性质)是,你需要安装这些应用程序才能查看你创建的演示文稿。你可以尝试在 Google Drive 或类似工具中打开文件,但成功率会有所不同。
近年来,用于创建演示文稿的 Web 框架大量涌现。这些框架利用 HTML5、CSS3 和 JavaScript 来创建可以在几乎所有现代 Web 浏览器中显示的演示文稿。而且,作为额外的奖励,演示文稿设计者可以完全控制他们的演示文稿。他们不必担心文件兼容性或被锁定在特定的基于 Web 的服务中。由于这些演示文稿框架是开源的,因此可以根据你的意愿进行扩展和增强——但公平地说,编写 HTML、CSS 和 JavaScript 比仅仅使用 PowerPoint、Keynote 或 Impress 要复杂一些。
最有趣的演示文稿框架之一是 impress.js,它的目标是将演示文稿从标准的幻灯片模式中解放出来。下面,我将向你介绍 impress.js 以及两个可以轻松创建 impress.js 演示文稿的工具。
Impress.js
Impress.js 是一个由 Bartek Szopka 开发的 JavaScript 演示文稿框架。它受到 Prezi 的启发,利用 CCS3 转换提供超越传统幻灯片模式的演示体验。使用 impress.js 进行演示,演讲者可以通过在三维空间中滑动、旋转和缩放的演示文稿给观众留下深刻印象。
基于标准的 Web 技术(HTML、CSS 和 JavaScript)意味着 impress.js 不会将用户锁定在使用特定的应用程序或基于 Web 的服务来创建演示文稿。因为它是在 MIT 和 GPLv2+ 许可下发布的,如果 impress.js 不能像你期望的那样工作,你可以自由地自行更改它。然而,与其他一些开源 JavaScript 演示文稿框架不同,impress.js 需要非常现代的 Web 浏览器才能查看演示文稿。它旨在充分利用最新的 Web 技术。对旧版浏览器的支持不是开发的优先事项。但是最新版本的 Chrome、Firefox、Safari 和 Internet Explorer 应该可以很好地与 impress.js 一起工作。
即使对于具有良好 HTML 和 CSS 技能的人来说,创建 impress.js 演示文稿也不是一件容易的事。基本的标记很容易理解,但 impress.js 演示文稿可能非常复杂,需要大量的思考和计划。没有默认主题,因此你必须自己设计演示文稿的外观和感觉。演示文稿的流程完全由你决定,因此你必须计划每个幻灯片如何过渡到下一个幻灯片,以及幻灯片在画布中的相对位置布局。从头开始创建 impress.js 演示文稿可能需要大量工作,但结果可能会令人印象深刻。 演示和示例可供参考和指导,并且为那些想要深入了解更多信息的人提供了教程。
如果从头开始创建 impress.js 演示文稿对你来说太复杂,那么有一些工具可以使创建 impress.js 演示文稿更容易。下面列出的两个工具各有优缺点。不妨都尝试一下,看看哪个适合你。
Hovercraft
Hovercraft 通过允许你使用 reStructedText 标记创建演示文稿,从而简化了 impress.js 演示文稿的创建过程。你无需在制作演示文稿时编写 HTML 标记,只需专注于编写文本即可。你可以移动和更改内容,而无需处理复杂的标记。例如,以下文本创建一个比前一个幻灯片大五倍并旋转 90 度的幻灯片。
---- :data-scale: 5 :data-rotate: 90 Heading ======= * Bullet Point 1 * Bullet Point 2 ----
使用 Hovercraft 创建 impress.js 演示文稿大大简化了流程并增强了 impress.js。Hovercraft 支持四种不同的幻灯片定位方法。如果在标记中未指定定位,则最终会得到传统的向左滑动幻灯片演示。如果你想要更精细的效果,可以使用相对定位,幻灯片的位置基于你相对于前一个幻灯片指定的偏移量。此方法允许你轻松地在演示文稿中间插入新的幻灯片,并使所有后续幻灯片重新调整其位置。如果你想要完全控制,可以使用绝对定位,这允许你指定幻灯片的精确坐标。最后,你可以为演示文稿指定要遵循的 SVG 路径。根据 Hovercraft 的文档,SVG 布局“有点难以使用”,但对布局进行如此精确的控制可以产生一些非常令人印象深刻的幻灯片演示。此外,Hovercraft 支持对你要包含在演示文稿中的任何源代码进行语法突出显示,并添加带有计时器和注释的演示者屏幕。当你完成演示文稿的编写(或想要测试你目前编写的内容)后,一个非常简单的命令会将 reStructuredText 文件转换为 HTML 演示文稿
hovercraft [markupfile] [output directory]
尽管 Hovercraft 有其优势,但它仍然要求用户非常精通 CSS。默认的 Hovercraft 主题非常简朴,因此如果你想要比白色背景上的纯黑色文本更精美的效果,仍然需要对演示文稿进行样式化。向演示文稿添加 CSS 并不复杂,但它不如在 PowerPoint 中选择新的演示文稿主题那么容易。
你可以阅读 Hovercraft 的文档以了解更多信息。
Hovercraft 由 Lennart Regebro 创建,并根据 Creative Commons CC0 1.0 Universal 许可获得许可。
Strut
如果你想要一个更像传统演示文稿软件的工具,那么 Strut 就是为你准备的工具。Strut 是一个基于 Web 的应用程序,它提供了传统的幻灯片排序器和编辑工具。图形工具使你可以向幻灯片添加文本、图像、视频、网站和预先设计的形状。你还可以轻松地一次性更改整个演示文稿或逐个幻灯片地更改幻灯片背景和表面(幻灯片出现的前景幕布)的颜色。Strut 还支持使用 Markdown 向幻灯片添加文本。对于高级用户,你可以将自定义 CSS 类应用于对象,并从 Strut 内部编写自定义 CSS 规则。设计好幻灯片后,你可以切换到概览模式并以图形方式布局幻灯片。你只需拖动幻灯片并输入深度、旋转和缩放的值。除了创建 impress.js 演示文稿外,Strut 还可以使用 bespoke.js 框架创建演示文稿。
Strut 非常好,但它仍然有一些不足之处。用户会偶尔遇到错误,并且该项目的待办事项列表有点长(但这并不是主要问题)。该项目遵循“尽早发布,经常发布”的原则,任何希望改进该项目的人都可以通过在 GitHub 上贡献代码来帮助改进。
尝试使用 项目网站上的编辑器 试用 Strut,或者从 GitHub 下载源代码 并在本地(或服务器上)运行它。你需要 Node.js 的 npm 和 Grunt 来安装依赖项并构建 Strut。
Strut 的创建者 Matthew Crinklaw-Vogt 已根据 GNU Affero General Public License, Version 3 发布了该应用程序。
6 条评论