Aplicaciones para hacer animaciones en HTML5 sin saber programación

Este artículo se puede leer en aproximadamente 188 segundos

La revolución HTML5 ya está aquí y vino para quedarse. La nueva versión del lenguaje de marcado (HTML5) apunta a que los desarrolladores web puedan dejar volar su imaginación y crear infinidad de elementos multimedia. Les traigo una recopilación de herramientas que nos van a facilitar el proceso de crear animaciones directamente en HTML5.
Aplicaciones para hacer animaciones en HTML5 sin saber programación


HTML5 se espera que se convierta en moneda corriente dentro de muy poco tiempo. Por el momento, no existen demasiadas ofertas de software de edición de animaciones, amigables y que no requieran conocimientos de programación. Hacer una animación sin el apoyo de una aplicación especial, no es imposible (ni mucho menos..) pero requiere varias líneas de código, para indicarle al navegador la secuencia temporal en la que debe ir mostrando los elementos y la posición que van ocupando frame a frame. Si uno no está muy metido en este tema, probablemente nos lleve mucho tiempo lograr hacer la más básica de las animaciones, por lo que, estas aplicaciones, si bien no son de lo más sofisticadas, representan los primeros intentos por hacer más sencilla la creación de animaciones HTML5. Veamos cuáles son las mejores que hay disponibles en este momento.

 

Cooties

 

Cooties | HTML5 desde la web

 

Cooties es una aplicación web gratuita que te permite hacer animaciones HTML5 sin necesidad de instalar nada. Permite dibujar y animar formas básicas, texto e imágenes externas. Tiene un sistema de capas que pueden activarse/desactivarse para loggrar efectos más sofisticados. Cooties dispone de varias opciones de configuración, podemos determinar el tamaño del lienzo, el color del fondo, los FPS y más. Las imágenes externas que vamos insertando quedan almacenadas en una especie de librería para poder re-utilizarlas cuántas veces querramos. Cuando hemos terminado nuestra obra de arte, el programa nos genera el código HTML para que insertemos en nuestros sitios web. Fácil, rápido y eficaz.

La aplicación se integra con tu cuenta de Google, una vez que nos loggeamos, las animaciones que hagamos se irán almacenando en ella.

 

Link: Cootie | Blue Dojo
 

Sencha Animator

 

Sencha Animator | Animaciones CSS3

 

Este programa realiza la animación en CSS3, pero en un futuro se preveé que también ofrezca la posibilidad de crear el código en HTML5. Es una de las primeras aplicaciones de este tipo y permite obtener muy buenos resultados. Ofrece un control muy preciso de los movimientos de los distintos objetos que incorporemos a la animación, así como también de la línea de tiempo. Se pueden hacer transiciones, transformaciones, efectos 2D y 3D y tipográficos.

 

Link: Sencha Animator.

 

Hype

 

Hype - Animaciones HTML5 para Macs

 

Esta aplicación está destinada al público mac-ero. Al igual que Cooties, permite construir de forma fácil e intuitiva, nuestra animación, indicando los elementos que vamos a utilizar, entradas, salidas, movimientos, transiciones, etc. Una vez completada, Hype se encarga de convertir todo esto a HTML5. También tiene una integración con Dropbox para poder compartir los trabajos realizados con colegas o clientes. El proyecto está en sus etapas iniciales, sus creadores afirman que van a mejorarlo paulatinamente, incluyendo soporte para WebGL (un engine para renderizar gráficos 3D directamente en el navegador) y más funcionalidades y efectos.

 

Link: Hype | App Store.

 

Espero que les sea de utilidad, nosotros nos vamos a poner a hacer algún banner para WebAyunate ;) .

 

Fuentes: ILoveFreeSoftware | WebAdictos | Mashable.

 

 

Introduction to Web Applications Development
Desarrollo de Aplicaciones Web (GRATIS)
HTML5 First Look
Primera mirada a HTML5 (GRATIS)
Sexy Web Design
Sexy Web Design (GRATIS)

 
 

¿Quieres más guías y e-books gratis? No olvides visitar nuestra sección de Guías Gratuitas

 

Te interesó esta nota? Leé más!

10 comentarios en “Aplicaciones para hacer animaciones en HTML5 sin saber programación

  1. Pingback: Bitacoras.com

  2. Jorge!

    Si, hay que darles una chance para saber si son útiles o no para lo que cada uno necesita hacer…

    Estuve visitando tu sitio, muchos éxitos para la radio!!

    Gracias por comentar, saludos!

  3. Gracias por la información, siempre valioso buscar alternativas. Probé Cooties cm una necesidad d buscar una alternativa gratuita al Flash d Adobe para mi trabajo. En lo personal le falta mucho desarrollo para ayudarnos cm herramienta. Creo q ni la descarga ni el código son funcionales, a la hora d manipular la animación, lo q me dió un poquillo d miedo d su desarrollador :s

  4. Hi, Neat post. There’s an issue with your web site in web
    explorer, could check this? IE still is the market chief and a huge
    component of other folks will omit your fantastic writing because of
    this problem.

  5. See, it is the springs that allow us to be able to lift the heavy garage door using just a
    slight bit of force. That is why many people look
    to add windows to their garage door. Rolling shutters of ROMA have a patented sound body and are therefore
    pleasantly quiet.

  6. What’s up, I check your new stuff regularly.
    Your humoristic style is witty, keep doing what you’re doing!

  7. The media for downloading hasn’t been this fast and simple as it is now.
    Just because a link is on Piratebay does not
    necessarily mean that the users are getting, and hence, the flawed data.

    The most enjoyable element of Revenge of the Fallen is its sheer familiarity.

  8. When some one searches for his necessary thing, so he/she wishes to be available that
    in detail, so that thing is maintained over here.

Dejar un comentario

Tu email no será publicado. Los campos requeridos son marcados con *

*

Podés usar etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>