{"id":5248,"date":"2013-07-17T11:17:57","date_gmt":"2013-07-17T09:17:57","guid":{"rendered":"http:\/\/www.palentino.es\/blog\/?p=5248"},"modified":"2013-07-17T11:29:44","modified_gmt":"2013-07-17T09:29:44","slug":"alternativas-y-herramientas-para-la-creacion-de-animaciones-html5-al-estilo-flash","status":"publish","type":"post","link":"https:\/\/www.palentino.es\/blog\/alternativas-y-herramientas-para-la-creacion-de-animaciones-html5-al-estilo-flash\/","title":{"rendered":"Alternativas y herramientas para la creaci\u00f3n de animaciones HTML5 al estilo Flash"},"content":{"rendered":"

En esta entrada voy a exponeros las herramientas que he encontrado para crear animaciones al estilo Flash, pero generando HTML5.<\/p>\n

Como sabr\u00e9is, la desventaja principal del empleo de pel\u00edculas Flash es la no inclusi\u00f3n ni soporte por parte de Apple, en dispositivos como iPad e IPhone.\u00a0Poco a poco el gigante inform\u00e1tico de\u00a0Apple\u00a0ha ido desbancando al programa\u00a0Flash\u00a0<\/i>con un potente competidor, el\u00a0HTML5<\/strong>.<\/p>\n

Por otro lado, aquellos que conozcan la filosof\u00eda de funcionamiento de estas herramientas no encontrar\u00e1n grandes problemas para usarlas.<\/p>\n

<\/p>\n

Uno de los principales “inconvenientes” de emplear\u00a0HTML5\u00a0es su\u00a0incompatibilidad al 100% con los\u00a0navegadores\u00a0web<\/b>. En este sentido\u00a0Internet Explorer\u00a0es el que m\u00e1s problemas ofrece. A\u00fan as\u00ed, \u00a0con el tiempo, este peque\u00f1o inconveniente desaparecer\u00e1, y se podr\u00e1 apreciar las ventajas que conlleva usar\u00a0HTML5.<\/div>\n
<\/div>\n
Se ha demostrado que se puede realizar juegos bastante profesionales\u00a0en\u00a0HTML5 \u00a0junto con otras tecnolog\u00edas.<\/div>\n
<\/div>\n
Los inconvenientes de emplear la tecnolog\u00eda\u00a0<\/span>Flash\u00a0<\/i>son varios, entre ellos destacan el elevado\u00a0<\/span>consumo abusivo que hace de la CPU<\/b>. Aunque en sus \u00faltimas actualizaciones est\u00e1n haciendo un notable esfuerzo \u00a0para solucionar este problema, a\u00fan queda algo lejos el poder compararse con\u00a0<\/span>HTML5\u00a0en este aspecto.<\/span><\/span><\/div>\n
<\/div>\n
Tambi\u00e9n hay que tener en cuenta que\u00a0Flash\u00a0<\/i>es una tecnolog\u00eda, que aunque sea gratuita para que los usuarios puedan visualizar contenido web, para poder realizar este contenido\u00a0se requiere pagar y obtener una licencia\u00a0<\/b>de la aplicaci\u00f3n necesaria para crearlo, lo que supone un gasto extra.<\/div>\n
<\/div>\n
Del mismo modo, para poder visualizar el contenido realizado con\u00a0Flash\u00a0<\/i>se requiere de un plugin externo<\/b>. Con\u00a0HTML5\u00a0<\/i>esto no ocurre, se puede visualizar cualquier contenido hecho en\u00a0HTML5\u00a0<\/i>sin ninguna aplicaci\u00f3n externa, siempre que el navegador lo soporte.<\/div>\n
<\/div>\n
<\/div>\n
<\/div>\n
\"Barra-separadora-blog\"<\/a><\/div>\n
<\/div>\n
<\/div>\n
Las herramientas que me han gustado.<\/strong><\/div>\n
\n<\/div>\n
1\u00ba – HYPE \u00a0<\/strong>de\u00a0http:\/\/tumult.com\/<\/a><\/div>\n
S\u00f3lo es para Mac, pero su filosof\u00eda de funcionamiento es similar a flash, admite programaci\u00f3n. El precio es muy asequible. Me ha parecido excelente. Ver v\u00eddeos de funcionamiento.<\/div>\n

2\u00ba- A5 Animator<\/strong>, \u00a0http:\/\/www.a5-animator.com\/<\/a><\/p>\n

Existen una versi\u00f3n gratuita, pero ojo, si no la compras cuando generas el resultado, te sale una marca de agua. Adem\u00e1s existen unas peque\u00f1as limitaciones, es necesario comprar la PRO que vale 168 euros. No obstante es la segunda opci\u00f3n que m\u00e1s me ha gustado.<\/p>\n

El A5 HTML5 Animador PRO es una soluci\u00f3n completa de software para la creaci\u00f3n de modernas animaciones web basadas en los nuevos est\u00e1ndares web HTML5. Este software \u00a0permite crear contenido interactivo para la web, sin necesidad de conocimientos de programaci\u00f3n. El software incluye un editor WYSIWYG perfecto para una creaci\u00f3n sencilla y posicionamiento de objetos (por ejemplo, textos, im\u00e1genes, v\u00eddeos) mediante la t\u00e9cnica Drag-Drop (arrastrar y soltar). La creaci\u00f3n de animaciones se realiza con la ayuda de fotogramas clave, ya sea introducida manualmente o autom\u00e1ticamente en la l\u00ednea de tiempo. El software es una herramienta innovadora para la creaci\u00f3n de modernas y grandes animaciones HTML5 sin el uso de Flash. Todas las animaciones creadas con el A5 HTML5 Animator PRO se muestran en todos los dispositivos m\u00f3viles, como iPhone y iPad, al igual que en un PC o un port\u00e1til.<\/p>\n

Estas otras herramientas tampoco est\u00e1n mal:<\/p>\n

http:\/\/www.sencha.com\/products\/animator<\/a><\/p>\n

http:\/\/maqetta.org\/<\/a>\u00a0(open socurce)<\/p>\n

http:\/\/www.purpleanimator.com\/<\/a>\u00a0->Esta herramienta es para Mac, tiene buena pinta.<\/p>\n

Adobe se ha dado cuenta que necesita crear un producto similar a Fash para crear animaciones HTML5 y ha desarrollado Edge, pero es un servicio en la nube, de alquiler o pago mensual. Ver tarifas.<\/p>\n

http:\/\/html.adobe.com\/edge\/animate\/<\/a><\/p>\n

Otra herramienta online.<\/p>\n

http:\/\/editor.mixeek.com\/v2\/<\/a><\/p>\n

Con\u00a0Adobe Flash Professional CS6\u00a0ahora se puede hacer una transici\u00f3n f\u00e1cil de\u00a0HTML5\u00a0usando\u00a0Flash Professional Toolkit\u00a0para\u00a0CreateJS<\/strong>.<\/p>\n

Existe una extensi\u00f3n de google para convertir flash en html5,
\nSwiffy Extension for Flash Professional de google.<\/strong><\/p>\n

https:\/\/www.google.com\/doubleclick\/studio\/swiffy\/extension.html<\/a><\/h2>\n

Otro conversor de Adobe.<\/p>\n

http:\/\/www.adobe.com\/products\/flash\/flash-to-html5.html<\/a><\/p>\n

Para Crear juegos en 2D, usando htm5, recomiendo esta herramienta, que permite crear animaciones, stages, etc…, ver demos.<\/p>\n

https:\/\/www.scirra.com\/construct2<\/a><\/p>\n

Eso es todo.<\/p>\n","protected":false},"excerpt":{"rendered":"

En esta entrada voy a exponeros las herramientas que he encontrado para crear animaciones al estilo Flash, pero generando HTML5. Como sabr\u00e9is, la desventaja principal del empleo de pel\u00edculas Flash es la no inclusi\u00f3n ni soporte por parte de Apple, en dispositivos como iPad e IPhone.\u00a0Poco a poco el gigante inform\u00e1tico de\u00a0Apple\u00a0ha ido desbancando al programa\u00a0Flash\u00a0con un potente competidor, el\u00a0HTML5. Por otro lado, aquellos que conozcan la filosof\u00eda de funcionamiento de estas herramientas no encontrar\u00e1n grandes problemas para usarlas.<\/p>\n","protected":false},"author":1,"featured_media":5268,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[418,6,7,14,24],"tags":[415,685],"class_list":["post-5248","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html-2","category-multimedia","category-software","category-varios","category-web","tag-flash","tag-html5"],"_links":{"self":[{"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/posts\/5248","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/comments?post=5248"}],"version-history":[{"count":22,"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/posts\/5248\/revisions"}],"predecessor-version":[{"id":5279,"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/posts\/5248\/revisions\/5279"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/media\/5268"}],"wp:attachment":[{"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/media?parent=5248"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/categories?post=5248"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.palentino.es\/blog\/wp-json\/wp\/v2\/tags?post=5248"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}