Из чего складывается цена, и почему нельзя сделать качественный баннер «за час»? Какая идея баннера считается хорошей? На какие этапы разработки нужно обратить особое внимание? Почему красивая раскадровка иногда превращается в отвратительный баннер, и кто виноват в таких ситуациях? Чем отличается хорошая анимация от плохой, и как сделать каждый баннер максимального качества для сотни площадок с совершенно разными техническими требованиями?

Статья поможет заказчику вникнуть в процесс разработки баннеров и ответить на эти вопросы.

Ниже мы будем говорить только об интернет-баннерах.

Разработка баннера включает в себя 4 этапа. Мы рекомендуем утверждать каждый из первых 3-х этапов по порядку — это позволяет клиенту контролировать ход разработки. Ведь он платит не за кота в мешке.

• Идея
• Раскадровка
• Анимация и программирование
• Подготовка баннера к размещению на рекламной площадке 

Идея

Заказывая баннеры, следует помнить, что разработка идеи — это самая сложная часть. Думаю, что около 5% специалистов могут придумывать качественные идеи. Хорошо, если этим занимаемся копирайтер, понимающий все возможности и тонкости производства.

Не стоит доверять разработку креатива баннеров компаниям или агентствам, которые не имеют представления о разработкой интернет-баннеров. К примеру тем, кто занимается только наружной рекламой. Многим сложно перестроиться от статичных идей для полиграфии к идеям в интерактивной среде. Стоит заметить, что для полиграфии тоже можно разработать и реализовать идею, подразумевающую взаимодействие с пользователем, интерактивную идею.

Какая рекламная идея считается хорошей?

Продающая. Не может быть никаких компромиссов. Не важно, стоит ли задача продать товар или услугу за неделю или бренд выстраивает стратерию на 50 лет вперед. Конечная цель всегда — продажи.

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

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

Информационная. В некоторых случаях достаточно ясно донести информацию без избытка «креатива».

Возможны любые сочетания типов идей.

Ниже приведены примеры реализованных нами идей:

• Продающая эмоциональная информационная идея,
• Продающая имиджевая,
• Имиджевые эмоциональные (эмоция за счет нестандартности) баннеры,
• Эмоция в чистом виде,
• Имиджевый эмоциональный баннер

Раскадровка

Раскадровка представляет собой картинку, содержащую ключевые кадры анимации.

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

Дизайнер, рисующий раскадровку, изначально должен учитывать ограничения по весу баннера — размеру в КБ. Можно нарисовать красивую раскадровку с большим объемом качественной графики. Но она не пройдет по весу, графика ужмется до безобразия, и в результате мы получим тихий ужас вместо хорошего баннера. В этом случае дизайнер не может утверждать, что он нарисовал хорошую раскадровку, а во всем виновата площадка с ее жесткими требованиями. Работа дизайнера по разработке раскадровки — это решение задачи воплощения идеи в заранее известных рамках по весу баннера, с учетом требований к оформлению. Именно поэтому при любых технических требованиях площадок к рекламным материалам клиент должен получать и утверждать ту раскадровку, которая будет воплощена в виде анимированного баннера. Если раскадровка выглядит хорошо, а баннер в итоге ужасен, в этом виноваты разработчики, которые не объяснили заказчику все тонкости процесса разработки баннеров.

Имея на руках медиаплан с техническими требованиями площадок, необходимо заранее выбирать способ реализации раскадровки. Если сценарий баннера достаточно длинный, а ограничение по весу равно 25 КБ, возможно, есть смысл использовать только векторную графику, отказавшись от растра.

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

Анимация и программирование

Эту работу должен выполнять моушн-дизайнер со знанием экшн скрипта. Если требуется глубокое программирование, то в разработке, наряду с флеш-дизайнером, должен участвовать флеш-программист. Ни в коем случае нельзя считать анимацию баннера технической работой и доверять ее флеш-технологам (программистам). Анимация баннера — это творческая работа.

Пример. Представим, что по сценарию баннера точка должна по прямой траектории переместиться из пункта «А» в пункт «Б». Толковый моушн-дизайнер, в отличие от технического специалиста (программиста, технолога) понимает, что сделать это можно бесконечным количеством способов. И выбор способа реализация движения точки зависит от контекста.

5 типов анимаций в качестве примера.

Качество анимации

Теперь мы знаем, что прямолинейное движение точки из пункта «А» в пункт «Б» может быть выполнено множеством способов. Важно всегда выбирать именно тот способ анимации, который соответствует контексту, т. е. делать качественную анимацию. Что это значит?

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

Если мы анимируем реалистичную графику из реального мира (авто, чайник, дерево) и нам не нужна стилизация, то анимация должна повторять их движения так, как это происходит на самом деле, в реальном мире. Мы знаем, как трогаются автомобили, как они останавливаются, потому что видим это каждый день. Знаем, как колышется листва деревьев при небольшом ветре, как листья отрываются и летят при сильном ветре и т. д. Задача хорошего моушн-дизайнера — избавить пользователя от просмотра анимации. Пользователь должен видеть суть, не обращая внимание на технику реализации: едет автомобиль, падает рояль, взлетает самолет и т. д. В жизни практически невозможно встретить абсолютно равномерное движение, всегда присутствует ускорение или замедление какой-то степени.

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

Подготовка баннера к размещению на рекламной площадке

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

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

• 200x300, yandex.ru, 25 КБ
• 240x400, mail.ru, 35 КБ
• 240x400, sports.ru, 40 КБ

то от разработчика стоит требовать уникальный баннер для sports.ru, до 40 КБ. Немного адаптировать для mail.ru и упрощать для yandex.ru. При таком подходе на больших рекламных кампаниях мы получаем все баннеры максимального качества.

Недобросовестные разработчики применяют другую систему, обманывая клиентов: делают простейший баннер по самым жестким ограничениям веса (в нашем случае это yandex.ru, до 25 КБ), избавляя себя тем самым от сложной работы по оптимизации последующих ресайзов и клиента от качественных баннеров. В то время, как баннер до 40 КБ мог выглядеть эффектно, у них он получится таким же «упрощенным», как и версия до 25 КБ. Такой подход, конечно, неприемлем.