Recerca d'eines per a la creació de contingut interactiu

Recerca d'eines per a la creació de contingut interactiu

by Daniel Rueda Daudén -
Number of replies: 1

Senzill

Eina 

Enllaç

Formats 

Què ofereix 

Exemple 

Google Forms

https://forms.google.com

Compartir per enllaç i embed amb iframe (HTML).

Formularis i qüestionaris interactius.

blobid0.png

Scratch (projectes)

https://scratch.mit.edu/projects/editor/?tutorial=getStarted

Embed amb iframe del projecte.

Crear jocs/animacions interactives amb blocs; molt visual, ideal per contingut senzill tipus “mini-joc” o simulació. 

blobid1.png

https://scratch.mit.edu/starter-projects

Intermedi

Eina 

Enllaç

Formats 

Què ofereix 

Exemple 

Twine

https://twinery.org/reference/en/story-library/exporting.html

Exporta a HTML o Twee (.twee). 

Eina per fer històries ramificades (escollir opcions).

Exemple: crear 3 passatges amb enllaços [[Anar a A]] / [[Anar a B]] i exportar a .html. twinery​

Genially

https://genially.com/

JPG,PNG, GIF, SVG, PDF, MP4.

Crear contingut  interactiu i animat.

Jocs, quizzes, imatges, widgets, qüestionaris.

blobid2.png

https://view.genially.com/6524490f583ad900118639aa/presentation-examples-of-genially

Avançat

Eina 

Enllaç

Formats 

Què ofereix 

Exemple 

H5P 

https://h5p.org/content-types-and-applications

Interactive Video, Course Presentation, Branching Scenario, etc. S’incrusta via iframe/integra a Moodle/WordPress segons instal·lació. h5p​

Plataforma per crear activitats e-learning avançades (qüestionaris, llibres interactius, escenaris, hotspots…).

Exemple: fer un “Interactive Video” amb preguntes amb punts de pausa. https://h5p.org/content-types-and-applications

Web Components (Custom Elements + Shadow DOM)

https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements

El teu codi HTML+JS.

Permet crear etiquetes HTML pròpies (reutilitzables) i encapsular l’estil amb Shadow DOM (ideal per widgets interactius).

customElements.define("mi-widget", class extends HTMLElement { ... }) developer.mozilla​
In reply to Daniel Rueda Daudén

Re: Recerca d'eines per a la creació de contingut interactiu

by Daniel Rueda Daudén -

Eina

Navegadors suportats

Configuració específica

Dispositius comuns

Google Forms

Chrome, Firefox, Edge 

JavaScript + cookies actius; iframes per embed 

Ordinador (Windows/macOS), mòbil (Android/iOS amb Chrome/Safari)

Scratch (projectes)

Chrome, Firefox, Edge

Iframes no bloquejats; JavaScript 

Ordinador i mòbil; responsiu 

Twine (HTML)

Chrome, Firefox, Edge, Safari 

JavaScript per històries ramificades

Ordinador (Windows/macOS/Linux), mòbil amb navegador

Genially

Chrome, Firefox, Edge 

JavaScript + iframes/HTTPS 

Ordinador i mòbil (responsiu) 

H5P

Chrome, Firefox, Edge, Chrome/Safari 

JavaScript + iframes per integracions h5p

Ordinador, tauleta, mòbil responsiu 

Web Components

Chrome, Firefox, Edge 

JavaScript actiu per custom elements 

Ordinador i mòbil moderns 

Sopa de lletres generada amb Genially i incrustada amb Iframe en HTML:

Screenshot%20from%202026-02-10%2012-36-59.png

<!doctype html>

<html lang="en">

 <head>

   <meta charset="UTF-8" />

   <meta name="viewport" content="width=device-width, initial-scale=1.0" />

   <title>Forum 3</title>

 </head>

 <body>

   <div style="width: 100%">

     <div

       style="

         position: relative;

         padding-bottom: 56.25%;

         padding-top: 0;

         height: 0;

       "

     >

       <iframe

         title="Word Search: Corporate Culture"

         frameborder="0"

         width="1200"

         height="675"

         style="position: absolute; top: 0; left: 0; width: 100%; height: 100%"

         src="https://view.genially.com/6982370cfb2c4e15f93dbb6b"

         type="text/html"

         allowscriptaccess="always"

         allowfullscreen="true"

         scrolling="yes"

         allownetworking="all"

       ></iframe>

     </div>

   </div>

 </body>

</html>