Google Web Designer. Где скачать, уроки, создание баннеров, анимация и шаблоны

Google Web Designer — это простой инструмент для создания баннеров HTML5, которые представляют собой новый тип рекламных материалов. В отличие от обычных баннеров они интерактивны и не только могут менять содержимое, но и взаимодействовать с пользователем, показывая материал при наведении или выводить цену/специальные предложения.

Данный инструмент был реализован, чтобы повысить количество «качественных» баннеров и увеличить CTR объявлений. Также он намного легче аналогов, подразумевающих наличие серьезных навыков в дизайне.

При использовании Google Web Designer любой пользователь сможет всего за пару дней освоить процесс создания HTML5 баннеров и не нужно будет учить большое количество уроков. Для простоты Google разработал базовые шаблоны, позволяющие сделать процесс создания креатива максимально простым.

Что такое Google Web Designer и как скачать

Google Web Designer представляет собой программу для персонального компьютера, которая может работать с платформами Windows (7 и выше) и Mac (10 и выше). Скачать которую можно пройдя по ссылке: https://webdesigner.withgoogle.com/.

Среди возможностей данного ПО:

• Интерактивные баннеры. Данные креативы смогут не только двигаться, но и при наведении выдавать заранее продуманную информацию или же выполнять заданные инструкции;
• Динамический ремаркетинг. Данная функция будет полезна сайтам с популярными предложениями, что позволит выдавать заранее подготовленные наборы продуктов с их ценами, названиями и изображениями. В этом случае можно будет создать несколько сегментов или аудиторий, посещающих разделы сайта и заранее возвращать их при помощи креативных баннеров и выгодных предложений;
• Анимация. Позволяет объектам двигаться, например, реклама машины станет гораздо интересней, когда она едет по дорогам или можно имитировать движение букв, составляющих название бренда. Все это позволяет привлечь внимание и сделать баннер более привлекательным, обойдя конкурентов;
• 3D. Для тех, кто любит сложные задачи или хочет удивить своих клиентов подойдут 3D баннеры, которые можно не только пускать в рекламу, но и использовать у себя на сайте, например, в карточках ключевых товаров;
• Простые баннеры. Позволит создать базовый баннер без знаний фотошопа, а благодаря установленным шаблонам можно будет легко подогнать каждый креатив под рекламу в Google Ads.

Уроки по Google Web Designer — баннер и анимация на русском

Для создания собственного шаблона потребуется войти в программу и использовать готовый шаблон или начать с чистого листа.

Если выбрать шаблон, то на экране можно увидеть такое:

---

В этом случае потребуется заменить готовые элементы, на свои, после чего создать красивый баннер с движущимися объектами.

Если Вы еще не знакомы с интерфейсом и возможностями Google Web Designer, то лучше начать с чистого листа для освоения.

В поле «библиотека файлов» можно загрузить исходные изображения для дальнейшего редактирования. Выбрав каждый объект на листе можно посетить свойства, что позволит редактировать его размеры, цвет или стили.

Также доступно редактирование CSS, что даст возможность знакомым с этим языком сверстать страницу целиком без использования редактора.

В нашем случае мы добавляем в редактор логотип и три миниатюры из статьи, после чего в ниже дописываем их названия (в упрощенном виде).

Далее в нижней части экрана мы создаем имитацию движения, что позволит картинкам двигаться с верхней части в нижнюю, после чего вернуться на место. Интервал для движения половины пути выбираем в пол секунды, соответственно, путь «в один конец» займет секунду, а «туда и обратно» 2 секунды.

В итоге получаем двух секундный баннер, показывающий превью статей с лого на чистом листе с имитацией движения: https://web-rynok.ru/forbanner/banner5.html

Шаблоны в Google Web Designer

Для того, чтобы ознакомиться со списком шаблонов и использовать их потребуется войти в программу.

После этого выбираем «Использовать шаблоны».

Перед пользователем появляется галерея шаблонов, которую он может использовать для работы. Сюда входят:

• Динамический ремаркетинг. Один из самых популярных шаблонов для показа сразу нескольких предложений (товаров или услуг). Например, можно показывать туры, недвижимость, автомобили, товары, авиабилеты и многое другое;
• App Install. Поможет при создании креатива для рекламы мобильного предложения;
• Banner for Display. Специальный формат, который может быть размещен на каждом сайте;
• Баннер для Google Ads и AdMob. Универсальный формат, легко продвигающийся среди мобильных устройств;
• Data Driven. Показывает по очереди преимущества бренда;
• Demostration. Баннер с интерактивными элементами, например, вывод текста при наведении;
• Expandable. Показывает один большой баннер и несколько маленьких, позволяя продвигать связные товары/услуги;
• Floathing. Редкий формат, показывающийся только на ПК;
• In-stream video. Показ видео вместо баннера, что становится достаточно популярным;
• Interstitial & in-app. Баннер для планшетов для продвижения мобильных приложений;
• Lightbox. Универсальный формат, способный использовать видео, карты и картинки для продвижения товаров и услуг;
• Parallax. Создает красивую иллюзию сразу нескольких слоев и обладает быстрой скоростью загрузки;
• Rising star. Редкий формат для компьютеров, создающий интерактивный эффект.

После того, как основной макет выбран, каждому пользователю предоставляется возможность выбрать из любого формата.

В этом случае пользователь сможет подготовить баннер под любые размеры, к тому же они будут указаны. Соответственно, мы получаем готовый список размеров, базовый шаблон, в который останется только установить собственные картинки/видео и тем самым реклама в Google Ads сможет собрать как можно больше показов при высоком значении CTR.

Заключение

Google Web Designer это новый и удобный способ начать создавать привлекательные креативы, а также позволяющий маркетологам и директологам без знаний Фотошопа и других графических программ быстро научиться рисовать анимированные HTML5.

Данный инструмент упростит жизнь любому специалисту, работающему с рекламой и позволит повысить показатели рекламных каналов, за счёт привлекательных креативов.

Большим преимуществом инструмента является возможность быстро освоить его за счёт простого интерфейса, базовых шаблонов, а также сторонних уроков.

С уважением, Алексей Даренский.