На старте у нас пять раскадровок 240x400 и 728x90 от клиента с качественными фотографиями.

Идея баннеров классная — показываем обычную жизненную ситуацию на первом кадре, а уже на втором как Авито может помочь. Идеально.

Делим задачи на команду, чтобы сократить общие сроки — дедлайн известен, рекламная кампания должна запуститься вовремя

Это далеко не первый наш проект с Авито, поэтому мы быстро, но с вниманием к деталям собираем две структуры анимации. Проверяем все замедления, появления и время отображения каждого кадра. И утверждаем без правок.

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

Утвержденные раскадровки служат опорой для анимации. Когда известно как выглядят кнопка, заголовок, фотография в каждом — этап анимации ускоряется в разы. Это особенно нужно, когда у компании есть собственные гайды, которые важно учесть.

Ресайзы делаем также в два этапа, как и раскадровки: сначала первый пак, а затем остальные.

Отдельно готовим HTML5-баннеры для размещения на главной странице: проверяем скорость анимации, размеры текста и кнопки, нагрузку на процессор. Делаем все, чтобы на этапе модерации не словить ошибок.

За основу берем первый кадр из раскадровок для HTML5-баннеров. Кроме классических размеров, есть два нестандартных: 820х1580 (вертикальный) и 1580х820 (горизонтальный). В них нужно учесть, что края баннеров будут скрываться в зависимости от устройства, поэтому выверяем расположение каждого элемента до пикселя. Фото, заголовок, фирменные круги и кнопка должны быть на своем месте и видны каждому пользователю.

Собираем все файлы в одном месте и передаем ребятам из Авито. Все довольны.