{"id":231,"date":"2020-10-15T09:51:33","date_gmt":"2020-10-15T07:51:33","guid":{"rendered":"https:\/\/portal.edu.gva.es\/aules\/?p=231"},"modified":"2024-07-31T10:38:56","modified_gmt":"2024-07-31T08:38:56","slug":"exportar-projectes-jclic-a-html5","status":"publish","type":"post","link":"https:\/\/portal.edu.gva.es\/aules\/exportar-projectes-jclic-a-html5\/","title":{"rendered":"Exportar projectes JClic a HTML5"},"content":{"rendered":"<p>En aquest apartat s&#8217;explica com convertir un fitxer de projecte JClic als formats HTML5 i SCORM. Aquests formats us permetran publicar el vostre projecte per a ser visualitzat des de qualsevol dispositiu (ordinadors, m\u00f2bils, tauletes\u2026) sense necessitat de Java ni d&#8217;un altre complement.<\/p>\n<p><strong>Formats de fitxers utilitzats per JClic<\/strong><br \/>\nCom ja sabeu, els projectes JClic es guarden en uns fitxers que porten la doble extensi\u00f3 &#8220;.jclic.zip&#8221;, a pesar que els sistemes Windows normalment amaguen el &#8220;.zip&#8221; final.<br \/>\nEn exportar un projecte a HTML5 es generen molts fitxers: d&#8217;una banda el &#8220;index.html&#8221;, que ser\u00e0 el document principal obert pel navegador web quan publiquem el projecte. Despr\u00e9s, totes les imatges i sons que s&#8217;hagen usat en el projecte, amb el nom adaptat sense espais ni car\u00e0cters especials perqu\u00e8 es puguen descarregar sense problemes des del servidor web, i finalment altres fitxers addicionals que fan falta per a fer funcionar el sistema. Veureu que en el moment d&#8217;exportar a HTML5 es crea una carpeta especial per al projecte, on aniran a parar tots aquests fitxers.<br \/>\nEl format SCORM \u00e9s, de fet, un contenidor que permet englobar en un \u00fanic fitxer ZIP tots els fitxers generats en l&#8217;exportaci\u00f3 a HTML5. \u00c9s com un env\u00e0s que ens servir\u00e0 per a enviar tots els ingredients de les activitats al servidor en una \u00fanica operaci\u00f3. Els fitxers SCORM que genera el JClic tenen tamb\u00e9 una doble extensi\u00f3: &#8220;.scorm.zip&#8221;<\/p>\n<p><strong>Abans de comen\u00e7ar\u2026<\/strong><br \/>\nUs haureu d&#8217;assegurar que teniu l&#8217;\u00faltima versi\u00f3 del JClic Author. Per a saber-ho feu clic a Ajuda | Quant a\u2026 i us apareixer\u00e0 una finestra semblant a aquesta:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-238 aligncenter\" src=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/1-1-300x258.png\" alt=\"\" width=\"300\" height=\"258\" srcset=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/1-1-300x258.png 300w, https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/1-1.png 509w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><br \/>\nEl codi de la versi\u00f3 ha de ser 0.3.2.4 o superior. En cas que siga inferior, actualitzeu el vostre sistema (si \u00e9s Lliurex) o b\u00e9 descarregau l&#8217;instal\u00b7lador per a Windows o Mac des de: <a href=\"http:\/\/clic.xtec.cat\/ca\/jclic\/download.htm\">http:\/\/clic.xtec.cat\/ca\/jclic\/download.htm<\/a><\/p>\n<p><strong>Instal\u00b7laci\u00f3 d&#8217;un projecte per a fer la pr\u00e0ctica<\/strong><br \/>\nPer a fer aquesta pr\u00e0ctica hem triat el projecte &#8220;Els bombers&#8221; de Montserrat Casas que trobareu en: <a href=\"http:\/\/clic.xtec.cat\/repo\">http:\/\/clic.xtec.cat\/repo<\/a>. Podeu usar aquest o qualsevol altre si ho preferiu. Com ja sabeu, podeu buscar per nivell, \u00e0rea, idioma\u2026<br \/>\nFeu clic a la targeta del projecte triat per a accedir a la finestra d&#8217;informaci\u00f3 ampliada, i despr\u00e9s feu clic a la &#8220;tasseta de caf\u00e9 Java&#8221; que hi ha en la part inferior. Aix\u00f2 iniciar\u00e0 el proc\u00e9s de desc\u00e0rrega i instal\u00b7laci\u00f3 del projecte al vostre ordinador. Segons el sistema operatiu que utilitzeu, pot ser que el proc\u00e9s s&#8217;inicie autom\u00e0ticament, o b\u00e9 que us descarregue un fitxer anomenat &#8220;install.jnlp&#8221; sobre el qual haureu de fer doble clic per a posar-ho en marxa.<\/p>\n<p><strong>Exportaci\u00f3 del projecte a SCORM i HTML5<\/strong><br \/>\nUna vegada instal\u00b7lada el projecte obriu-lo amb el JClic Autor.<br \/>\nEn la pestanya projectes veureu la informaci\u00f3 del projecte:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-237 aligncenter\" src=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/2-1-256x300.png\" alt=\"\" width=\"256\" height=\"300\" srcset=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/2-1-256x300.png 256w, https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/2-1.png 633w\" sizes=\"(max-width: 256px) 100vw, 256px\" \/> <img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-236 aligncenter\" src=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/3-1-300x253.png\" alt=\"\" width=\"300\" height=\"253\" srcset=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/3-1-300x253.png 300w, https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/3-1.png 633w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/p>\n<p>En aquest cas no cal que modifiqueu les dades, ja que s\u00f3n bastant completes, per\u00f2 abans de pujar el vostre projecte si que us haureu d&#8217;assegurar que tots els camps estiguen emplenats: autor, centre, descriptors, idiomes\u2026<br \/>\nA continuaci\u00f3 aneu al men\u00fa Fitxers | Exporta a HTML5\u2026<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-235 aligncenter\" src=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/4-1.png\" alt=\"\" width=\"253\" height=\"268\" \/><br \/>\ni s\u2019obrir\u00e0 una finestra com aquesta:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-239 aligncenter\" src=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/export-300x165.png\" alt=\"\" width=\"300\" height=\"165\" srcset=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/export-300x165.png 300w, https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/export.png 594w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><br \/>\nDepenent del sistema operatiu que utilitzeu (Windows, Linux, MacOS\u2026) les rutes que es mostraran poden canviar. Deixeu els par\u00e0metres per defecte i feu clic a D&#8217;acord.<br \/>\nSi tot va b\u00e9, el sistema us mostrar\u00e0 una finestra amb el resum de les accions que s&#8217;han realitzat. Feu clic a D&#8217;acord.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-234 aligncenter\" src=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/5-300x286.png\" alt=\"\" width=\"300\" height=\"286\" srcset=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/5-300x286.png 300w, https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/5.png 650w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><br \/>\nSi ara aneu a l&#8217;explorador de fitxers del vostre ordinador veureu que dins de la carpeta JClic hi ha dues carpetes m\u00e9s, a m\u00e9s de la carpeta &#8220;projects&#8221; que ja coneix\u00edem:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-233 aligncenter\" src=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/6-300x157.png\" alt=\"\" width=\"300\" height=\"157\" srcset=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/6-300x157.png 300w, https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/6.png 329w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><br \/>\nEn la carpeta export trobareu una subcarpeta per a cadascun dels projectes que h\u00e0geu exportat. Dins d&#8217;aquestes van tots els fitxers necessaris per a utilitzar les activitats en format HTML5. Si teniu un servidor web propi, aquestes carpetes de projectes s\u00f3n les que haur\u00edeu de pujar per a publicar les activitats a Internet. I si no teniu acc\u00e9s directe a cap servidor, no patiu: la zonaClic us ofereix un espai per a publicar-los.<br \/>\nEn la carpeta scorm trobareu un fitxer amb extensi\u00f3 &#8220;.scorm.zip&#8221; per cadascun dels projectes que h\u00e0geu exportat. Aquests fitxers ZIP contenen el mateix que les subcarpetas de &#8220;export&#8221;, amb l&#8217;avantatge de trobar-se tots els components envasats en un \u00fanic fitxer:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-232 aligncenter\" src=\"https:\/\/portal.edu.gva.es\/aules\/wp-content\/uploads\/sites\/644\/2020\/10\/7.png\" alt=\"\" width=\"267\" height=\"185\" \/><br \/>\nAquest fitxer bombers.scorm.zip \u00e9s el que necessitareu per a afegir &#8220;Els bombers&#8221; a la vostra biblioteca personal del projectes.<br \/>\nQuan cregueu el vostre projecte \u00e9s molt important que el JClic estiga dins d&#8217;una carpeta que porte el mateix nom.<br \/>\nEl nom del vostre projecte ha de portar un nom curt i sense espais.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>En aquest apartat s&#8217;explica com convertir un fitxer de projecte JClic als formats HTML5 i SCORM. Aquests formats us permetran publicar el vostre projecte per a ser visualitzat des de qualsevol dispositiu (ordinadors, m\u00f2bils, tauletes\u2026) sense necessitat de Java ni d&#8217;un altre complement. Formats de fitxers utilitzats per JClic Com ja sabeu, els projectes JClic &#8230; <a title=\"Exportar projectes JClic a HTML5\" class=\"read-more\" href=\"https:\/\/portal.edu.gva.es\/aules\/exportar-projectes-jclic-a-html5\/\" aria-label=\"Read more about Exportar projectes JClic a HTML5\">Llegir m\u00e9s \/ leer m\u00e1s<\/a><\/p>\n","protected":false},"author":5974,"featured_media":197,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[85],"tags":[],"class_list":["post-231","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-formacio-va","no-featured-image-padding"],"lang":"va","translations":{"va":231,"es":242},"pll_sync_post":[],"_links":{"self":[{"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/posts\/231"}],"collection":[{"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/users\/5974"}],"replies":[{"embeddable":true,"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/comments?post=231"}],"version-history":[{"count":2,"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/posts\/231\/revisions"}],"predecessor-version":[{"id":246,"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/posts\/231\/revisions\/246"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/media\/197"}],"wp:attachment":[{"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/media?parent=231"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/categories?post=231"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/portal.edu.gva.es\/aules\/wp-json\/wp\/v2\/tags?post=231"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}