My Presentation History

HighEdWeb 2008

Higher Ed on Rails

Powerpoint

Then

• HighEdWeb 2009 (missed it)
• HighEdWeb 2010 (didn't present)

But meanwhile ...

Back Home

HighEdWeb 2010 Report

Google Presentation

Back Home

HTML5

Keynote

HighEdWeb 2011

Swinging with Sinatra

Keynote

HighEdWeb 2012

I Can Convert!

Keynote

Available Presentation Tools

(and their limitations)

• Conventional (Powerpoint, Keynote)
• Cloud-based (Google)
• Flash-based (Prezi)

What About Version Control?

What About the Web?

It turns out
there are options.

Web-based Presentation Tools

The Basic Idea

HTML

HTML is used to structure content and mark it up,
often semantically

The Basic Idea

CSS

CSS is used to provide presentation styling.

The Basic Idea

JavaScript

JavaScript is used to add behavioral elements

Sound familiar?

Opera Show

• Presentation Mode
• media: projection
• XHTML and CSS
• Opera Show Generator

Tantek Çelik

http://tantek.com/presentations/2004sxsw/css.html

S5

Eric Meyer

• XHTML
• XOXO

http://meyerweb.com/eric/tools/s5/

S5

Pros:

• Printable
• Accessible
• Semantic

Cons:

• Fairly Static
• Single URL

Deck.js

Caleb Troughton

https://github.com/imakewebthings/deck.js

Deck.js

• Built with jQuery and Modernizr
• Themable slide and transition styles
• Simple HTML
• JavaScript API
• Contributed extensions

Reveal.js

Hakim El Hattab

https://github.com/hakimel/reveal.js

Transitions

Supports swipe/pinch navigation.

Code Highlighting

<section>
	<h2>Code Highlighting</h2>
	<pre><code contenteditable>
		<!-- Recursion here. Look away! -->
	</code></pre>
</section>
						

Overview

10,000-foot view of your presentation.

Mobile

Supports swipe/pinch navigation.

PDF Export

Supported via print Stylesheet (Chrome only at this time).

Pause

Theming

Uses SASS and related tools to make themes more consise.

Presenter View

See notes along with current/next slide and timer

Remote

(Server-side speaker notes)

Control presentations with another device.

Multiplex

Control presentation clients

API

• Read and observe presentation state
• React to presentation events
• Control and modify presentation

And more!

• Internal links
• Node.js
• Navigate via webcam or gamepad
• Generate presentations with Sinatra.

A few other options

Parallax scrolling

Flowtime

Prezi-style effects

Impress

jQuery

Fathom

Things to Look For

When Choosing a Platform

Navigation

• Keyboard
• Mouse
• History

Adaptability

• Printable
• Accessible
• Exportable (PDF)
• Semantics (XOXO)

Presenter Tools

• Overview
• Fullscreen
• Remote
• Pause
• Multiplex

Community

Content

• Online Editor
• Markdown

Style

• Themes and Theming
• Flexibility
• Code Highlighting

Behavior

• Transitions
• Animation
• API / Events

This is all so great!

• Version control? Sure!
• Collaboration? Why not!

Would I go back?

to Powerpoint/Keynote?

For delivery specifically in those formats

to Google Presentations?

For something small and simple

Better to go forward