Как создать баннер (Create Ad)
Iana Nosova
Последнее обновление год назад
При нажатии на Create доступны несколько функций:
Create:
New Ad – создание нового объявления
Responsive Ad – создание адаптивного объявления
From template – создание объявления на основе шаблона баннер-сетов
Folder – создание новой папки
Upload:
Ad – загрузка одного объявления
AdSet – загрузка набора объявлений
Import:
Import from Figma – импорт файлов из Figma. Подробнее про подключение Figma – в отдельном разделе.
Import from PSD – импорт файлов из Photoshop. Загрузите файл в формате PSD.
Чтобы создать новый баннер, нажмите кнопку Create и выберите New Ad.
После нажатия появится всплывающее окно с выбором размеров. На этом этапе нужно выбрать размер, в котором вы хотите создать баннер. В списке представлены предустановленные шаблоны, но если нужного размера нет, можно воспользоваться поиском.
Если нужного размера нет в базе, можно создать свой, нажав кнопку справа сверху Custom Size. В появившемся окне указываем ширину и высоту (например, 300x300) и нажимаем Create and go to builder.
После этого открывается редактор.
Редактор представляет собой пустой баннер без слоев. Чтобы начать работу, необходимо добавить элементы.
Слева расположены вкладки:
Text – добавление заголовков и текста
Elements – формы, кнопки, иконки, маски
Uploads – загрузка изображений, видео, svg
Background – заливки, градиенты, фоны
Animation – анимационные эффекты
Resize – изменение размеров баннера (разберем в отдельной статье)
Во вкладке Text доступны три предзаготовленных текстовых элемента: Header, Subhead и Body. Они отличаются только размером шрифта. Добавленный текст можно перетащить в нужное место.
Настройки текста включают:
Выбор шрифта
Выравнивание
Размер, межбуквенное расстояние
Цвет, стиль (верхний/нижний регистр)
Если стандартных шрифтов недостаточно, можно загрузить свой. Для этого:
Открываем выпадающий список шрифтов
Переходим во вкладку Uploaded
Загружаем шрифт с устройства и выбираем его
Во вкладке Elements можно добавить:
Buttons – кнопки для взаимодействия. Несколько предустановленных стилей с возможностью кастомизации.
Footages (Stock) – стоковые материалы
Primitives (SVG) – примитивные векторные фигуры (SVG), которые можно настраивать
Shapes – базовые формы, такие как круги и квадраты, которые можно редактировать
Lottie – поддержка анимаций в формате Lottie с возможностью настройки и зацикливания анимаций
Для добавления элемента достаточно нажать на него.
Во вкладке Uploads можно загрузить изображения и добавить их на баннер. Поддерживаются форматы PNG, JPG, SVG.
Фон может быть:
Однородной заливкой
Градиентом
Изображением
Также в этом разделе в нижней части окна можно добавить рамку для баннера, задать ей цвет и толщину.
Во вкладке Animation доступны предустановленные эффекты:
In – анимация появления
Out – анимация исчезновения
Выбрав эффект, можно посмотреть, как он работает. Если анимация не нужна, можно выбрать None.
Правая панель содержит две вкладки:
Settings – панель управления слоями в правой части интерфейса
Slides – добавление новых слайдов или импорт через Figma, настройка длительности кадра и зацикливания Loop count (до 7 раз или бесконечно)
После настройки баннера можно:
Экспортировать его
Создать ресайзы
Доработать в следующих сессиях