Marco básico para presentaciones usando HTML5 + javascript

100

¿Conoce un marco para hacer presentaciones utilizando solo tecnologías HTML5 y javascript?
No estoy hablando de las funciones de "exportación" de varios programas de presentación (presentación en powerpoint o OOo).

Algunos requisitos para las presentaciones realizadas con este "marco":

  • aprovechar las últimas funciones HTML5 (audio, video, lienzo?)
  • lo mismo con CSS3 (soporte de fuentes, degradado, sombras, transiciones y transformaciones)

Si no existe tal cosa, se agradecería un ejemplo de buenas presentaciones o sugerencias sobre el tema.

Editar: Encontré un buen ejemplo, HTML5: desarrollo web al siguiente nivel .

javascript html presentation Brian Clozel
fuente
2
deck.js también en GitHub: imakewebthings.github.com/deck.js
Tammo B.
13
Más de 38 votos a favor, 26 marcadores, ¿pero cerrado? A riesgo de represalias por parte del moderador, debo decir que hay algo mal con la moderación aquí. He visto cerradas una docena de preguntas interesantes sin una razón válida.
Ben Lesh
4
Parece más bien que esto es indicativo de un problema con la moderación en el sitio, estar fuera de contacto con la audiencia del sitio. Francamente, también es una señal de que stackoverflow.com puede haber "saltado el tiburón".
Ben Lesh
3
@blesh Obtienes una descripción bastante buena en la razón cercana a continuación. Tenga en cuenta que estas razones cercanas han existido desde el comienzo del sitio, y está claramente codificado en las preguntas frecuentes que este tipo de preguntas no están permitidas, por lo que no debería ser una sorpresa. Con el volumen de tráfico que recibe SO, hay toneladas de este tipo de preguntas que pasan desapercibidas, pero eso no justifica su existencia. Puedes mencionarlo en meta, si quieres, pero no creo que la gente esté en desacuerdo con la razón cercana .
casperOne
3
@IvoFlipse: la pregunta no es si las respuestas son respuestas de "calidad" por alguna métrica vaga y completamente subjetiva, sino si son útiles para las personas. A juzgar por los votos, la pregunta y la respuesta son eminentemente útiles para muchas personas.
static_rtti

Respuestas:

65

Landslide es una aplicación bastante ordenada que genera presentaciones de diapositivas:

Deck.js es otro buen proyecto; esta vez, las diapositivas son HTML / CSS / JS puro.

Aún mejor, impresion.js se basa en transformaciones y transiciones CSS3.

Brian Clozel
fuente
He descargado los archivos de Landslide, pero como soy el novato que soy, estoy completamente confundido sobre cómo usarlo. Las instrucciones de Léame me suenan griegas con todas las instrucciones de la línea de comandos. Cualquier sugerencia para comenzar será apreciada. Gracias
Sbhambry
1
@Saurabh: asumiendo que ha clonado desde el repositorio de git, ejecute python setup.py buildy luego python setup.py installcon privilegios de root. Ahora tendrá el landslidecomando disponible, ejecútelo en el samples/directorio.
Ryan Li
@Ryan gracias por la respuesta. Le daría una oportunidad lo antes posible. ¡Gracias!
Sbhambry
Puede usar strut.io como GUI para crear presentaciones Impress.js y Bespoke.js.
Matt Crinklaw-Vogt
8

Como herramienta de presentación, uso Reveal.js , es una herramienta de presentación muy limpia y moderna.

Está hecho 100% con HTML5 / CSS3 / JS, las características que más me gustan son:

  • Transiciones 3D como CSS3 entre diapositivas
  • Puede crear diapositivas anidadas: diapositivas verticales en horizontales
  • Soporte font-face
  • haces enlaces internos entre diapositivas
  • El código es bonito, gracias a highlight.js
  • Vista general y modo de dos pantallas con Escy `s ''

Sé que realmente no lo quieres, pero puedes exportarlo a PDF y bifurcarlo en github :)

Javier
fuente
2

Si desea obtener compatibilidad con websocket y la capacidad de controlar presentaciones de Deck.js a través de una aplicación móvil Sencha 2.0 HTML5, puede probar Robodeck .

jdcravens
fuente
1

Esta biblioteca es para hacer presentaciones, historias y anuncios.

BoardJS

Porizm
fuente
0

Aparte de las respuestas, también puede estar interesado en un controlador nodejs para mantener sincronizados varios visores remotos entre sí.

controldesk.js

Neil
fuente