Cómo crear un banner con Adobe Animate CC
A continuación ofrecemos un video tutorial de como crear un banner HTML5 con el programa Adobe Aninmate CC.
Si bien la forma de creación y herramientas que ofrece el programa son exactamente iguales a las de Adobe Flash, la exportación, uso de scripts y configuración de publicación son diferentes.
Código Javascript para generar Pausa en animación HTML5
// Generador de Pausa FM v1.1 var tl=this; tl.stop(); var delay = 500; // Cambiar aquí este valor en milisegundos. (Ej. 1000 = 1 seg) var startTime=createjs.Ticker.getTime(); createjs.Ticker.addEventListener('tick',f); function f(e){ if(createjs.Ticker.getTime()-startTime>delay){ tl.play(); createjs.Ticker.removeEventListener('tick',f); } }
Código para implementar clickTag en archivo .html
Los banners HTML5 deben contener el siguiente código (Sólo lo que está en negritas):
En el encabezado del archivo .html dentro de las etiquetas <head>:
Aclaración: Donde dice «www.sitioweb.com» reemplazar por el sitio web al cual debe direccionar el banner cuando se hace click
<head> <script type="text/javascript"> var clickTag = "http://www.sitioweb.com"; </script> </head>
Y entre las etiquetas <body> lo siguiente:
<body onload="init();" style="margin:0;"> <a href="javascript:window.open(window.clickTag)"><!-- Aquí canvas del banner --></a> </body>
Material a enviar y tiempos de implementación
• Una vez Publicado el banner enviar en un .zip lo siguiente:
– La carpeta «images» generada
– El archivo .html generado
– El archivo .js generado
• Las piezas deben ser entregadas con al menos 24 hs. de anticipación al comienzo del pautado.
• Enviar la URL (dirección web) a la que debe apuntar el banner cuando éste recibe un click