#impress.js

Impress.js – Presentation Framework with Power of CSS3 Transitions

CSS3 Transitions rocks once again here in creating stunning presentations online. Say thanks to Impress.js a superb jQuery plugin that builds impressive presentations using the CSS3 transforms & transitions.

The presentations created using Impress.js are really mesmerizing as the transition effects make each and every slide come alive and give a different look. According to my point of view, If I…

Some pics from MACHINE LEARNING TALK BY KAT BAILEY

The idea is to give an overview of the different topics and how they fit together.

(via Topics in Machine Learning)

WHAT I LEARNED

Experience the original presentation! This is a Prezi-like presentation is built using Hovercraft. Use spacebar to move to next slide. Up/down or left/right arrow to move to prev/next slide.

Naar aanleiding van de presentaties omtrent de analyse van EMS zal dit hoofdstuk handelen over presentaties. Specifieker over alternatieve software dan powerpoint om presentaties te geven.

Powerpoint heeft zijn beste tijd gekend (ook al is het nog steeds marktleider!) en daarom staan we stil bij wat er al allemaal op de markt te vinden is.

Bij deze specifieke 'software' spreken we van Frameworks.Zoals eerder vermeld is er de alomgekende Powerpoint of Keynote. Maar er zijn ook andere frameworks zoals reveal.js, Flowtime.js, Impress.js, Slid.es en Bespoke.js. Enkele van deze frameworks gaan we hieronder kort toelichten met hun functies, voordelen en eventuele beperkingen.

Powerpoint

Maar voordat we spreken over deze frameworks, gaan we even terug in de tijd. Want het presenteren met programma's zoals powerpoint is pas ontstaan vanaf de jaren negentig.

Overheadsheets, flipovers of schoolborden zijn ook altijd veel gebruikte technieken/materialen geweest voor presentaties. Nu in mindere maten, maar het komt nog steeds voor. Denk maar aan de schoolborden tijdens lessen.

Het eerste echte presentatieprogramma was dus powerpoint en jarenlang heeft dit programma ook de markt gedomineerd. Het had zelfs enkele jaren een monopoly in de sector van presentatiesoftware. Powerpoint is een WYSYWIG-editor (What you see is what you get).Naarmate de evolutie vorderde kon je alles toevoegen in powerpoint: tekst, foto's, muziek, video's, animaties, ...

Probleem

Doordat elke computer bijna standaard is uitgerust met het programma powerpoint is het dus mogelijk om jouw presentatie op vrijwel elke computer te downloaden. Maar als het programma niet was geïnstalleerd op de computer dan kon je de presentatie ook niet openen, wat voor problemen zorgt. Hiervoor bestaan er nu wel Powerpoint-viewers. Dankzij deze programma's kan je de powerpoint wel openen, maar niet bewerken.

Een ander probleem met powerpoint is dat dit enkel draait/werkt op windows computers. Grote tegenhanger Apple ondersteunt deze programma's niet en dus ook hier is het niet mogelijk om presentaties, gemaakt in powerpoint, te openen.

In de plaats wordt er bij Apple gewerkt met het programma Pager of Keynote. Deze programma's zijn te vergelijken met Powerpoint. Maar ook hier is er weer het probleem dat de presentatie niet op elke computer kan worden afgespeeld omdat de computer die bepaalde extensie niet ondersteunt.

Oplossing

Als oplossing hiervan zijn er de frameworks zoals reveal.js, Bespoke.js, Flowtime.js, Impress.js en Slid.es.Dankzij de snelgroeiende/evoluerende web technologie is men erin geslaagd om applicaties te ontwikkelen die presentaties in een browser (zoals mozilla firefox, google chrome of safari) kunnen laten afspelen. Pagina-overgangen video's, foto's, tekst,... zijn allemaal functies die nu ook in deze applicaties mogelijk zijn.

Het grote voordeel bij deze applicaties is dat men enerzijds deze presentaties overal, op eender welke computer kan laten afspelen. Anderzijds kan men, indien de presentatie een meerwaarde biedt, de presentatie direct online maken, zodat deze voor iedereen toegankelijk is.

Doordat de mooi ogende presentatie vrij toegankelijk is kan iedereen gebruik maken van de opmaak, functies en codes. Dit krijgt de term open source software.

Frameworks

De vier reeds genoemde frameworks zijn allemaal javascript frameworks. Javascript is een scripttaal van het web.

Bij javascript wordt er echt geprogrammeerd, dus enige kennis is zeker vereist om zulke programma's te kunnen maken. Om deze programma's te gebruiken is het gelukkig wat gebruiksvriendelijker.

1) Reveal.js

De speler met het grote marktaandeel binnen deze frameworks is reveav.js. Het is ontworpen door een 23-jarige Zweedse hacker.

Het is een vrij uitgebreid programma met een heel aantal functies. Een voordeel is dat je de markdown automatisch kan converteren naar slides. Je kan dus op een snelle en makkelijke manier mooi ogende HTML slideshows maken.

2) Bespoke.js

Een variant op reveal.js. Het is bij wijze van spreke de kleinere broer van reveal.js. De software is kleiner, lichter en eleganter. Door de het lichte gebruik en doordat het snel laadt kunnen we spreken van een micro framwork. Bij bespoke.js zijn er veel overgangsmogelijkheden tussen de slides.

3) Flowtime.js

Een zeer recente software is Flowtime.js. Ondanks dat het nog maar recent is opgericht bezit het programma al vrij veel features.

Enkele nadelen zijn dat het een vrij complexe manier van werken heeft en dat het, in tegenstelling tot bespoke.js veel zwaarder is.

4) Impress.js

Het is het buitenbeentje tussen de presentatiesoftware. Het heeft dezelfde werking als het concept van de prezi (op uitzondering van het gebruik van Flash.) en als de kracht van CSS3.

5) Slid.es

Last but not least is er ook nog Slid.es. Deze webservice draait op een revael.js server, maar heeft een eigen grafisch framework gebouwd. Doordat het een webservice is moet er geen software gedownload worden en kan je meteen aan de slag.

Alles wat je dan maakt op dit programma wordt ook online opgeslagen en kan je dus overal raadplegen/bewerken/presenteren als er een internetverbinding is.

Een nadeel is de beperkte mogelijkheden en controle bij het programma. Je kan minder je eigen zin doen.

Prezi

Ten slotte is er ook nog prezi. Dit is het 'originele buitenbeentje' (zie impress.js). Dit komt omdat je niet werkt met de traditionele pagina's maar met één grote pagina waarbij je kan/moet spelen met het in-en uitzoomen.

Few days back i came across this impressive presentation library by Bartek Szopka .its called imress.js and yes it is impressive. It harnesses the raw power of client side javascript which every one seem to be in love these days. this allows you  to create an unlimited canvas and navigate to parts  with effects.

First things first you need to have some coding or atleast fiddling experience for  this one ,thought it has a gui based editor called jspres i thought its better to keep it real ;). Another thing it is based on htm5 so  dont even bother trying it  in ie. and if you are still using ie it  is better you stop reading now.

To get yourself started download a copy of this from github , all you need to get going is a text editor and a browser.

All you need to do is a plane html page and create a div with id "impress" . Each div inside this acts as a slide, with some parameters like data-x,data-y ,data-scale allows you to move around the canvas generating cool transitions like pan and zoom.

Another cool thing is it allows you to rotate in full 3 d  along x ,y and z cordinates . with some good co -ordinate geometry one can achieve some real fancy stuff.

This tool will not make your presentations interesting. but if you have somthing interesting to say impress.js sets you up

Now the good part what i feel is a good thing to do is we can host this cool impression(not using presentation , defying ms) on your google drive . All you need to do is go to drive.google.com and create a new folder and change the sharing setting to public.

upload the html,js and css to the folder, you can also any images that you have in the impression to the same folder.  When done with uploading click on your html and open it with your googe drive viewer.

there is a preview option 

 On clicking you can see this page as a web. This url is accessible to all and can be shared  :)

  Five points which makes impress.js kick ass is

its all web , means light weight can be hosted any where no need to carry the  presentation in a flash drive 

It harnesses the web so its platform independent  no installations required

Amazing transitions  no competition here

Html5 support means you can add all audio and vedios in your impression

and lastly its unique : break free from  the monopoly of microsoft power point

  look at a sample presentation here. done in one sitting using the github files only nothing fancy.