Impress.js demo - presentation program

Impress.js demo - presentation program(bartaz.github.com)

105 points by misleading_name 13 years ago | 34 comments

nacs 13 years ago |

This library has been around a while and is pretty compact and easy to use.

A better page of examples (user-contributed) is here: https://github.com/bartaz/impress.js/wiki/Examples-and-demos

SEJeff 13 years ago | |

Shameless plug, my git talk using impress: http://sejeff.github.com/git-talk/

blackhole 13 years ago |

While this is truly, ahem, impressive, I sure hope a real presentation doesn't involve nearly as many dizzying rotations. When attempting to convey an idea, animations should be subtle, or the idea gets lost in the pretty effects.

CGamesPlay 13 years ago | |

I tend to agree. I have tried using impress to create presentations that were spatial, focusing less on the dizzying animations and more on the actual content... But Impress isn't set up for it. Impress is really designed to move the camera about a scene and moving the camera is the only operation it supports well.

You'll notice the user examples from that wiki are mostly the same basic idea... because it's quite difficult to make something more complex with impress out of the box. YOu can see a few pull requests that try to make this easier, like the one that supports subslides (i.e. a slide transition that doesn't cause a camera movement).

randall 13 years ago | | |

I think the only place for these presentations is where you're not physically giving the talk. In most cases, simple cuts or dissolves between slides is fine, since like you said, none of this actually adds much to the presentation.

tommikaikkonen 13 years ago | |

I agree. Many of the transitions in the demo presentations, while fancy, take too long to finish. They don't add anything to the presentation.

If you're going to use effects, make sure they actually contribute to or complement the content.

diggan 13 years ago | |

It's a framework for creating presentations and what's linked here is only a demo for showing the functionality. If you want to see real life (yeah, "real life") demos, look under "Presentations" on this page: https://github.com/bartaz/impress.js/wiki/Examples-and-demos

manojlds 13 years ago | | |

Saw the first one under presentations - http://bartaz.github.com/meetjs/css3d-summit/#/title

Really distracting and I wouldn't want to attend the presentation, like the comments above mention.

DanBC 13 years ago |

It's lovely! Well done.

I really strongly suggest you find a use for it that is not presentation. When I'm presenting I want people to be listening to what I'm saying, or getting information of the slide (or from their handouts); I don't want them thinking "Hey, that's a nice transition, I can't do that in powerpoint, I wonder what they used; wait, did he just say 27% up or 27% late? Wow, what was that group for?" etc.

I liked the way it told me after a few seconds that I needed to use arrows or the space bar. And it kept the back-button functionality.

mitchi 13 years ago |

I opened up the source code and it was like a walkthrough. I like this a lot. I'll be spending some time on this tomrrow.

All the references to Yoda made me dig up this classic. http://www.youtube.com/watch?v=493ljyoox6o

whatusername 13 years ago | |

So completely off-topic -- but if you like Darth Vader Rapping - then I need to suggest Epic Rap Battles (Of History):

Pt1: http://www.youtube.com/watch?v=AFA-rOls8YA Pt2: http://www.youtube.com/watch?v=CeLrlmV9A-s

(The rest of the series is quite fun as well -- and impressive for an indie outfit)

keithpeter 13 years ago | |

Yup, the 'messages in the comments' aspect reminded me of the early days in mid to late 1990s.

I will get round to doing a mind map in this. A 'run time' steerable navigation mode would be great (I tend to do 'random walks' while teaching, and I use slide sorter view a lot during lessons).

ChrisNorstrom 13 years ago |

Very nice. Although at first, I didn't realize the slideshow kept going after the 3rd slide. It looked like it ended. It was only out of curiosity that I used the right arrow key and saw the whole sliding effect. Maybe make a note of that on the 3rd slide.

nishantmodak 13 years ago |

Having played around with reveal.js (http://lab.hakim.se/reveal-js/) just last week. This is even more interesting!

maxvs 13 years ago | |

I didn't hear about reveal.js. I was considering impress.js (I've known this tool for some time already) as a tool to make my next presentation but I think reveal is better choice in my situation (I think it's easier to use and has everything I need). Thanks for the link!

koevet 13 years ago |

Slidery is a Java based project which allows to write presentations in markdown and generate slides in Impress.js and a bunch of other javascript presentation frameworks.

https://github.com/aestasit/slidery

(the guy who created it is my business partner)

scommab 13 years ago | |

I assume there are a number of these, this is my version (written in python instead of java): https://github.com/scommab/impressor

Not surprisingly I like mine better, since you (in theory) shouldn't need to write any code, just create a markdown file a correctly formatted file.

prezjordan 13 years ago |

Seems a lot of people (based on the comments) have written presentation generators :) Here's my contribution [1]. I created it to whip up quick slideshows for my club presentations on campus.

[1]: http://prezjordan.github.com/cleaver

webfuel 13 years ago |

I love the concept of impress.js and started making a presentation for the agency I work for: http://kitchdigital.com/about/

Warning, there is a lot of zooming around and you might feel sick.

NathanKP 13 years ago | |

The only thing I hate about pages like this is that they hijack the browser with their fake history. When I press the back button from this page I want to go back to your homepage, or back to HN. I don't want to have to click it 20 times to get back to where I was. Playing the presentation in reverse doesn't even make sense so it's not a use case you should design for.

bastih 13 years ago | |

I felt sick after two transitions. Why would you create something that triggers potential customer's motion sickness?

maxvs 13 years ago | |

I think this presentation/page isn't simple enough. You use too much different fonts and styles (there are slides with regular, bold and italics style in one sentence). I liked the rocket-shape of presentation though. It's just my opinion, I'm not an expert.

ktavera 13 years ago |

I started this little project several months ago based on impress.js

should still work in chrome/safari.

http://stepludesigner.azurewebsites.net/designer

bhashkarsharma 13 years ago |

I used it to give a talk at Droidcon hacknight. Here's a <dark> video :) http://www.youtube.com/watch?v=oYiSuxPpJTg

apathetic 13 years ago |

This has been around for awhile now.

braveheart1723 13 years ago |

this is great Bartaz - congratulations.

Although I'd stress not too use too many effects.

I read this recently...

http://www.guardian.co.uk/uk/interactive/2012/dec/28/2012-in...

and it's just way too disorienting.

Stay subtle :)

maxcan 13 years ago |

jmpress.js is an interesting fork of this with more features and some kind of deeper jquery integration. Worth a look: http://jmpressjs.github.com/jmpress.js/#/home

urza 13 years ago | |

Nice, but it feels like jmpressjs is actually somewhat restrictive compared to impress, am I right? jmpressjs feels more slide-oriented, whereas impress is more like prezi - position it yourself wherever you like in 2D space.. is this correct?

maxcan 13 years ago | | |

I thought jmpress was pretty much a superset of the functionality of impress. I could be wrong though.

BilalBudhani 13 years ago |

I'm truly impressed with the library. Simply Amazing !!

sweely 13 years ago |

I'm actually impressed by this. Good stuff!

ignaciogiri 13 years ago |

Add mousewheel and it would kill.

RaSoJo 13 years ago |

cool. But i never ended up using prezi. the animations made me feel sea sick :(

dksidana 13 years ago |

loved it