Estabas pensando en crear tu propia campaña de display en Google Adwords pero te has encontrado con un pequeño problema.
¿Cómo vas a hacer los banners animados?
Si, ya lose, ahora mismo tú sólo sabes que hay banners animados, probablemente sepas que hace tiempo se usaban imágenes GIF para crear los banners animados pero ahora la tecnología ha avanzado mucho más.
Muchos de los banners que estás viendo ahora en las webs que visitas ya no son imágenes GIF, son imágenes hechas con HTML5, CSS y javascript.
Y ¿cómo puedes hacer tú esos banners sin complicarte la vida?
La respuesta es fácil.
¿Qué es Google Web Designer?
Google Web Designer es un programa que ha puesto Google a disposición de todo el mundo pero con un objetivo claro.
Ayudar a quien crea campañas de display a crear anuncios gráficos rápidos y visibles en cualquier dispositivo.
Google Web Designer es un programa con una interfaz bastante sencilla aunque su uso puede que te cueste un poco ya que no es un simple editor de imágenes.
¿Conoces Flash?
Sí, esta tecnología de Adobe que tuvo su popularidad en su momento y ahora ha decaído tanto porque sus bonitas animaciones no son compatibles con dispositivos móviles.
Con Google Web Designer puedes realizar tus propias animaciones, no tiene una interfaz tan avanzada como la que pudiese tener Flash en su día pero sin duda vas a poder obtener un buen banner en poco tiempo.
¿Cómo es la interfaz de trabajo?
He pensado que antes de descargarte el programa te interesará saber cómo es por dentro y qué te puedes encontrar.
Por tanto te dejo una imagen con la interfaz del programa.
Como verás la apariencia de la interface es similar a casi todos los programas de edición de imágenes.
En la parte superior del programa está un menú bastante escueto con las opciones comunes de estos programas. Archivo, Editar, Ver y Ayuda (entiendes porque te digo que es escueto?).
En el lateral izquierdo están las herramientas con las que puedes trabajar en el diseño de tu banner.
En el lateral derecho tienes el menú con las propiedades, componentes, eventos y CSS. Este lateral es super importante ya que nos va a permitir configurar el banner a nuestro gusto.
Si estás familiarizado con el uso de Photoshop, Illustrator, Gimp o cualquier programa de imagenes sabrás que cuando creas por ejemplo un rectangulo, en la parte superior, debajo del menú, tienes las propiedades para editar ese rectanculo.
En este programa estas propiedades las encontrarás en el menú derecho, algo poco intuitivo que me llevó un rato averiguar.
La parte de abajo tiene la línea de tiempos y donde podremos manejar en qué momento aparece cada componente de los que crees. Esta línea de tiempos es muy similar a la línea de tiempos que había en Flash, donde creabas un fotograma clave y transiciones para hacer tu banner animado.
Cómo crear banners animados con Google Web Designer.
En este caso creo que tiene mucho más sentido que te ponga unos vídeos en los que te explican paso a paso y de forma clara cómo puedes crear un banner animado sin ningún problema.
En este primer video encontrarás la explicación de cómo crear un banner animado con eventos dentro del banner.
He seleccionado otro vídeo interesante para tí donde aprenderás a profundizar un poco más sobre las transiciones.
Te dejo otro vídeo para que veas lo que se puede hacer con la herramienta, este es el vídeo promocional de Google.
interesante, me haces uno?
Si, te puedo hacer todos los que quieras 😀
Si podrias ponerte en contacto conmigo tengo unas dudas y me gustaria consultarte.
Saludos!
Muy interesante la entrada, aportas contenidos muy relevantes para hacer campañas.
Cuando lance mi primer curso lo tendré en cuenta para la campaña.
Un abrazo!!
Muchas gracias Ángel, espero que te estén ayudando 🙂
Sr Juan, he tenido la oportunidad de poner en practica varios de las guias que usted nos da en los libros y quiero decirle que son fáciles de entender y de verdad se obtienen resultados en muy corto plazo. espero seguir creciendo en mi empresa y en un futuro no muy lejano contratar su servicio. Gracias.
Muchísimas gracias Esperanza, no te imaginas lo que me alegra ver que he podido ayudarte 🙂
Juan muchísimas gracias, desconocía esta herramienta!! Me será muy útil
Hiper util!,
si no fuera por esta clase de tutoriales, sencillos y bien hechos en español, deberíamos tal vez tomarnos horas para aprender algo tan sencillo, felicitaciones!
hey brot una duda como subo un banner a mi blog ?? no encuentro tutoriales
Buenas noches Juan, disculpa, es posible crear un banner con GWD e introducirlo de alguna manera en un código html? para que se visualice y realice la acción própia del click, como llevarte a otra web. Gracias
Se puede exportar un banner hecho en Google Web Designer como .gif ?
Increíble artículo, ¡gracias por compartir tus conocimientos sobre cómo hacer banners animados con Google Web Designer! ¿Podrías compartir algún consejo adicional para hacer banners atractivos y efectivos para AdWords?